如何在 updatepanel 中刷新 asp gridview 后重新加载 javascript 和 css?

How can I reload javascript and css after asp gridview is refreshed in updatepanel?

我有一个 asp.net Gridview,用户可以在其中插入更新和删除的行。使用下面的代码,用户可以在 gridview 中上下拖动一行并更新位置。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.24/themes/smoothness/jquery-ui.css" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.24/jquery-ui.min.js"></script>
<script type="text/javascript">
$(function myFunction() {

    $("[id*=GridView1]").sortable({
        items: 'tr:not(tr:first-child)',
        cursor: 'pointer',
        axis: 'y',
        dropOnEmpty: false,
        start: function (e, ui) {
            ui.item.addClass("selected");
        },
        stop: function (e, ui) {
            ui.item.removeClass("selected");
        },
        receive: function (e, ui) {
            $(this).find("tbody").append(ui.item);
        }
    });
});
</script>

我的问题是每当用户插入或更新一行时,除非刷新页面,否则他们无法再拖动和重新排序任何行。我该如何解决这个问题?

添加新项目后需要使用refresh()

refresh() Returns: jQuery (plugin only)

Refresh the sortable items. Triggers the reloading of all sortable items, causing new items to be recognized. This method does not accept any arguments.

http://api.jqueryui.com/sortable/#method-refresh

receive: function (e, ui) {
  $(this).find("tbody").append(ui.item);
  $("[id*=GridView1]").sortable("refresh");
}

应该可以

我通过将 myFunction 放在 pageLoad 中解决了这个问题,如下所示:

<script type="text/javascript" language="javascript">
    function pageLoad() {
        $("[id*=GridView1]").sortable({
            items: 'tr:not(tr:first-child)',
            cursor: 'pointer',
            axis: 'y',
            dropOnEmpty: false,
            start: function (e, ui) {
                ui.item.addClass("selected");
            },
            stop: function (e, ui) {
                ui.item.removeClass("selected");
            },
            receive: function (e, ui) {
                $(this).find("tbody").append(ui.item);
            }
        })
    };
</script>