填充的GridView使用Ajax [英] Populating Gridview Using Ajax

问题描述

我有两个gridview的。在点击一个网格的一排我必须填充另一个GridView控件。这样的OnClientClick javascript函数我叫AJAX返回的数据表来填充另一个网格。现在，我坚持了如何使用JavaScript绑定网格视图。

下面是code

 ＆LT; ASP：GridView控件ID =gridview1＆GT; .....＆LT; / ASP：GridView控件＆GT;
＆LT; ASP：GridView控件ID =gridview2＆GT; .....＆LT; / ASP：GridView控件＆GT;
 

codebehind

 保护无效GridView1_RowDataBound（对象发件人，GridViewRowEventArgs E）
{
    如果（e.Row.RowType == DataControlRowType.DataRow）
    {
             LinkBut​​ton的分贝=（LinkBut​​ton的）e.Row.Cells [0] .Controls [0];

        db.OnClientClick =FunPopulateSecondGrid（+ CTYPE（CTYPE（e.Row.DataItem，System.Data.DataRowView）.Row，标签）的.text +）;
            }
}
 

的javascript

 函数FunPopulateSecondGrid（产品ID）
{
   $阿贾克斯（{
            网址：'...'，
            数据：{getExEmpList：真，SelectedShop：selectedShop，则AjaxCall：真}，
            方法：GET，
            数据类型：JSON，
            的contentType：应用/ JSON的;字符集= UTF-8，
            成功：功能（数据）{
//我困在这里怎么绑定
//gridview2.datasource=数据
//gridview2.databind（）
            }，
            错误：函数（XHR，状态）{
                警报（'对不起，出现了一个问题，同时把你的Ajax请求联系管理员！'）;
            }
        }）;
}
 

解决方案

您需要将数据追加到GridView控件在这样成功的部分。

如果您已GridView控件ID为gridview2

 函数FunPopulateSecondGrid（产品ID）
    {
       $阿贾克斯（{
                网址：'...'，
                数据：{getExEmpList：真，SelectedShop：selectedShop，则AjaxCall：真}，
                方法：GET，
                数据类型：JSON，
                的contentType：应用/ JSON的;字符集= UTF-8，
                 成功：功能（数据）{//你需要将数据追加到GridView控件
             对于（VAR I = 0; I＆LT; data.d.length;我++）{
                    $（＃gridview2）附加（＆其中; TR＆GT;＆其中; TD＆gt;中+ data.d [I] .ProductName +
                                                ＆所述; / TD＆GT;＆其中; TD＆gt;中+ data.d [I]。价格+＆LT; / TD＆GT;＆LT; / TR＆gt;中）;
                 }，
                错误：函数（XHR，状态）{
                    警报（'对不起，出现了一个问题，同时把你的Ajax请求联系管理员！'）;
                }
            }）;
    }
 

请在这里找到完整的解决方案：使用jQuery 绑定的GridView

i have two gridview. on click of one row of one grid i have to populate another gridview. so onClientclick javascript function i called ajax which returns datatable for populating another grid. Now i am stuck how to bind grid view using javascript.

here is code

<asp:gridview id="gridview1"> .....</asp:gridview>
<asp:gridview id="gridview2"> .....</asp:gridview>

codebehind

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
             LinkButton db = (LinkButton)e.Row.Cells[0].Controls[0];

        db.OnClientClick = "FunPopulateSecondGrid(" + CType(CType(e.Row.DataItem, System.Data.DataRowView).Row, Label).text + ");"
            }
}

javascript

function FunPopulateSecondGrid(productid)
{
   $.ajax({
            url : '...',
            data : { getExEmpList: true, SelectedShop : selectedShop, ajaxCall : true },
            method : 'GET',
            dataType : 'json',
            contentType: "application/json; charset=utf-8",
            success : function(data) {
// i am stuck here how to bind it
//gridview2.datasource= data
//gridview2.databind()              
            },
            error : function(xhr, status) {
                alert('Sorry, there was a problem while placing your ajax request. Contact Admin!');
            }
        });
}

解决方案

You need to append the data to gridview in success section like this

If you have gridview with Id "gridview2"

function FunPopulateSecondGrid(productid)
    {
       $.ajax({
                url : '...',
                data : { getExEmpList: true, SelectedShop : selectedShop, ajaxCall : true },
                method : 'GET',
                dataType : 'json',
                contentType: "application/json; charset=utf-8",
                 success: function (data) { //you need to append the data to gridview
             for (var i = 0; i < data.d.length; i++) {
                    $("#gridview2").append("<tr><td>" + data.d[i].ProductName + 
                                                "</td><td>" + data.d[i].Price + "</td></tr>");
                 },
                error : function(xhr, status) {
                    alert('Sorry, there was a problem while placing your ajax request. Contact Admin!');
                }
            });
    }

Please find complete solution here :Bind GridView with Jquery

这篇关于填充的GridView使用Ajax的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！