如何通过在其他gridview中单击Linkbutton的onclick事件来使用Json绑定gridview

本文关键字：gridview 事件 绑定 Json onclick Linkbutton 何通过 其他 单击 | 更新日期: 2024-05-25 15:34:02

我使用json（第一个Gridview）绑定Gridview，它有一些带有链接按钮的列。

我想在点击第一个网格视图中的链接按钮时使用json绑定其他网格视图（第二个网格视图）。我该怎么做，请建议我如何在链接按钮点击事件上激发json？

如何通过在其他gridview中单击Linkbutton的onclick事件来使用Json绑定gridview

[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.Web.Script.Services.ScriptService]
public class StudentWebService : System.Web.Services.WebService {
    public StudentWebService () {
        //Uncomment the following line if using designed components 
        //InitializeComponent(); 
    }
    [WebMethod]
    public DataTable GetStudents()
    {
        string constr = @"Server=WAQAS'SQLEXPRESS; Database=SampleDB; uid=sa; pwd=123";
        string query = "SELECT ID, Name, Fee FROM Students";
        SqlDataAdapter da = new SqlDataAdapter(query, constr);
        DataTable table = new DataTable();
        da.Fill(table);
        return table;
    }
    [WebMethod]    
    public int UpdateStudent(int id, string name, decimal fee)
    {
        SqlConnection con = null;
        string constr = @"Server=WAQAS'SQLEXPRESS; Database=SampleDB; uid=sa; pwd=123";
        string query = "UPDATE Students SET Name = @Name, Fee = @Fee WHERE ID = @ID";
        con = new SqlConnection(constr);
        SqlCommand command = new SqlCommand(query, con);
        command.Parameters.Add("@Name", SqlDbType.NVarChar).Value = name;
        command.Parameters.Add("@Fee", SqlDbType.Decimal).Value = fee;
        command.Parameters.Add("@ID", SqlDbType.Int).Value = id;
        int result = -1;
        try
        {
            con.Open();
            result = command.ExecuteNonQuery();
        }
        catch (Exception)
        { }
        finally
        {
            con.Close();
        }
        return result;
    }    
}

    public partial class _Default : System.Web.UI.Page 
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!Page.IsPostBack)
        {
            StudentWebService service = new StudentWebService();
            ListView1.DataSource = service.GetStudents();
            ListView1.DataBind(); 
        }
    } 
}


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="scripts/jquery-1.4.3.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        var row;
        var id, name, fee;
        function EditStudent(editButton) {
            row = $(editButton).parent().parent();
            id = $("#id", row).text();
            name = $("#name", row).text();
            fee = $("#fee", row).text();
            row.addClass("highlightRow");
            DisplayEditStudentDialog();
            return false;
        }
        function DisplayEditStudentDialog() {
            $("#spnID").text(id);
            $("#txtName").val(name);
            $("#txtFee").val(fee);
            $("#editForm").show();
        }
        function UpdateStudent(e) {
            name = $("#txtName").val();
            fee = $("#txtFee").val();
            $.ajax({
                type: "POST",
                url: "StudentWebService.asmx/UpdateStudent",
                data: "{'id':'" + id + "', 'name':'" + name + "', 'fee':'" + fee + "'}",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function(response) {
                    var result = response.d;
                    if (result > 0) {
                        $("#name", row).text(name);
                        $("#fee", row).text(fee);
                        row.removeClass("highlightRow");
                        CloseEditStudentDialog();
                    }
                    else {
                        alert('There is some error during update');
                    }
                },
                failure: function(msg) {
                    alert(msg);
                }
            }); 
            return false;
        }
        function CloseEditStudentDialog() {
            $("#editForm").hide();
            row.removeClass("highlightRow");
        }
    </script>
    <style type="text/css">
        .table
        {
            border: solid 2px #507CD1; 
            width: 50%;
        }
        th
        {
            text-align: left;
        }
        .headerRow
        {
            background-color: #507CD1; 
            color: White;
        }
        .highlightRow
        {
            background-color: #dadada;
        }        
        .editForm
        {
            display: none;
            position: fixed;
            width: 380px;
            height: 200px;
            top: 50%;
            left: 50%;
            margin-left: -190px;
            margin-top: -100px;
            background-color: #ffffff;
            border: 2px solid #507CD1;
            padding: 0px;
            z-index: 102;
            font-family: Verdana;
            font-size: 10pt; 
        } 
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <asp:ListView ID="ListView1" runat="server">
        <LayoutTemplate>
            <table class="table" cellspacing="0" cellpadding="3"
                rules="rows">
                <tr class="headerRow">
                    <th style="width:40px;">                        
                    </th>
                    <th style="width:40px;">
                        ID
                    </th>
                    <th style="width:230px;">
                        Name
                    </th>
                    <th style="width:230px;">
                        Fee
                    </th>
                </tr>
                <tbody>
                    <asp:PlaceHolder ID="itemPlaceHolder" runat="server" />
                </tbody>
            </table>
        </LayoutTemplate>
        <ItemTemplate>
            <tr>
                <td>
                    <img id="btnEdit" style="cursor: pointer;" alt="Edit" src="images/edit.png" onclick="EditStudent(this);" />                    
                </td>
                <td>
                    <span id="id"><%# Eval("ID") %></span>
                </td>
                <td>
                    <span id="name">
                        <%# Eval("Name")%></span>
                </td>
                <td>
                    <span id="fee">
                        <%# Eval("Fee")%></span>
                </td>
            </tr>
        </ItemTemplate>
    </asp:ListView>
    <div id="editForm" class="editForm">
        <table style="width:100%;" cellpadding="5" cellspacing="0">
            <tr class="headerRow">
                <td>
                    Edit Item
                </td>
                <td style="text-align: right;">
                    <a onclick="CloseEditStudentDialog();" style="cursor: pointer;">Close</a>
                </td>
            </tr>
            <tr>
                <td>
                    ID:
                </td>
                <td>
                    <span id="spnID"></span>
                </td>
            </tr>
            <tr>
                <td>
                    Name:
                </td>
                <td>
                    <input type="text" id="txtName" />
                </td>
            </tr>
            <tr>
                <td>
                    Fee:
                </td>
                <td>
                    <input type="text" id="txtFee" />
                </td>
            </tr>
            <tr>
                <td>
                </td>
                <td>
                    <input type="submit" id="btnUpdate" value="Update" onclick="UpdateStudent(); return false;" />
                </td>
            </tr>
        </table>
    </div>
    </form>
</body>
</html>
相关文章：