Question

在一段时间内，我意识到通过使用AJAX Control Toolkit，您最终可以做的不仅仅是使用jquery。所以我开始使用jquery ajax而不是updatepanels等控件，它看起来更快，更简单。

我遇到的一个问题是，我在updatepanel内部有一个gridview with paging，并且有一个referh按钮，它从DB中取出行并再次绑定gridview。现在我想使用webmethod。

有没有办法从webmethod返回这个？还有很多其他情况可以说我在updatepanel里面有一个.ascx控件。有什么方法可以返回这样的控件吗？感谢任何示例链接

由于

Answer 1

您不应该从WebMethods返回GridViews。您应该使用jQuery返回数据并在客户端绑定它。

如果您希望完全替换GridView，我建议您使用某种jQuery插件以表格方式显示数据。您可以查看jQGrid或datatables（我最喜欢的）。您的Web方法只能返回Json格式的数据。类似的东西：

[WebMethod]
public List<CustomObject> GetData(string param1, string param2)
{
    //return data here
}

在数据表的特定情况下，您必须遵守an interface。在我的C＃版本上它看起来像这样：

public class ResponseData 
{
    #region properties
    public int iTotalRecords { get; set; } //used by datatables to build the pager
    public int iTotalDisplayRecords { get; set; } //used by datatables to build the pager
    public string sEcho { get; set; }
    public string sColumns { get;set; } //optional
    public List<CustomObject> aaData { get; set; } //your actual business objects
    #endregion        
}

因此，如果您选择使用数据表，您的Web方法应返回ResponseData

[WebMethod]
public ResponseData GetData(string param1, string param2)
{
    //return ResponseData
}

您可以在客户端绑定数据喜欢这个：

 $(document).ready(function() {
            var oTableSummary = $("#tbl").dataTable({
                "bJQueryUI": true,
                "bPaginate": false,
                "sPaginationType": "full_numbers",
                "bServerSide": true,
                "bProcessing": true,
                "iDisplayLength": 50,
                "bFilter": false,
                "bSortClasses": false,
                "bDeferRender": false,
                "oLanguage": { "sSearch": "Search all columns:" },
                "aLengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]],
                "sAjaxSource": "WebService.asmx/GetData",
                "fnServerData": function(sSource, aoData, fnCallback) {
                    $.ajax({
                        "type": "POST",
                        "dataType": 'json',
                        "contentType": "application/json; charset=utf-8",
                        "url": sSource,
                        "data": "{'param1': 'param1" , 'param2': 'param2' }",
                        "success": function(result) {
                            fnCallback(result); // draw the table
                        }
                    });
                }
            });
        });

PS：你需要花很多时间学习这些东西，但是如果你掌握了它，你就不想再回到使用服务器控件了。：d

Answer 2

您可以使用返回字符串的Web方法。该字符串将包含您的控件在this或this方法的帮助下呈现的所有html。在客户端，您只需用新内容替换表的持有者（这就是基本更新面板的作用）。

但更好的方法是只传输数据，而不是所有的html。也许有些jquery grid plugins会有所帮助。

Answer 3

我不会尝试从Web方法返回服务器控件。它似乎最初会减少代码量，但从长远来看，我认为它会产生更多的代码和更多的麻烦。例如，您如何计划访问控件，绑定到它们的数据或它们在代码隐藏中的事件？减少标记量是很好的，但不能以代码隐藏为代价。

有时作为开发人员，当我们学习如何使用它们时，我们倾向于采用一些新的技术，我认为这是其中一种情况。

从AJAX WebMethod返回Gridview

3 个答案: