在ASP.NET中异步更新DataGrid中的行

Question

我是ASP.NET WebForms应用程序的新手。 我有一个使用DataGrid的应用程序，该应用程序具有到对象列表的DataBinding。 页面完全加载后，我想向DataGrid中的每一行添加更多信息。

确定每行附加信息的过程必须在服务器端运行，并且每行大约需要2秒钟（网络访问等）。 因此，我希望在处理完每一行后刷新DataGrid。

这意味着，我想要一种异步机制，在用户完全可以访问网页的同时加载数据，并在服务器端处理完一行后立即更新UI。

从技术上讲，这意味着我需要在将每一行处理到客户端之后发送HTTP响应。 然后，客户端将读取HTTP响应并更新UI。

根据本文，我已经尝试过将UpdatePanel与ScriptManager一起使用。

该解决方案的问题在于，UI已在处理最后一行时更新。 为时已晚。 我们需要在每一行之后更新UI。

我曾经使用过WPF桌面应用程序。 在WPF桌面应用程序中，我只会使用后台工作程序。 在ProgressReported-EventHandler中，我将使用新信息更新Grid并调用IPropertyChanged通知。

如何在ASP.NET（.NET 4.0）中实现？ 任何帮助和网络资源都将受到高度赞赏。

Answer 1

您需要使用Ajax查询和WebService

将导入内容放入您的头部标签

<script src="...../js/jquery.ajaxq-0.0.1.js" type="text/javascript"></script>

并将脚本区域放在apsx页面的末尾

<script type="text/javascript">

    $(document).ready(function () {
        $('#<ID_GRID_NAME> tr').each(function () {
            //Get customerId Key
            var customerId = $(this).find("td:first").html();
            if (customerId) {
                $.ajaxq("interventionQ", {
                    type: 'GET',
                    dataType: 'json',
                    url: '<WEB_SERVICE_URL>' + customerId,
                    success: function (griddata) {
                       $(this).find("td:last").html('<span class="badge badge-important"></span>');
                    }
                });
            }
        })
    });
 </script>

Answer 2

摆脱ScriptManager并使用jQuery。 创建一个gridview，然后您可以使用AJAX成功方法获取它，并将其追加到HTML表中。 您可以在客户端创建一个空表（并将其隐藏），然后通过AJAX获取表行并将其附加到表中。

$.get( "Default.aspx/MethodName", obj, function ( response )
        {
            var content = $( $.parseHTML( response ) ).find("#divWhereYourGridviewIs");

            if ( $( "#div table" ).html() == null ) {
                $( "#divOnClient" ).html( content ); //this will be the first call to get the table

            }
            else {
                var newRow = $( content ).find( "#grd tr" )[1]; //this will be for each additional row, the [1] skips the header and gets the first row. 
                $( "#htmlTable" ).append( newRow );
            }

   } );

Answer 3

如果您可以在WebForms和MVC之间进行选择，那么值得研究一下MVC。 此CoderProject页面是系列文章的一部分，该系列文章提供了有用的信息，可帮助您完成所有想做的事情以及更多。 该页面具有一些WebForms内容的链接。

长话短说， jQuery和jQueryUI有很多类似的东西以及如何实现它们的示例。