在ASP.NET页面中的PostBack之后,AngularJS ng-grid不起作用

时间:2014-06-05 08:40:15

标签: c# asp.net angularjs postback ng-grid

我有一个ng-grid对象,可以将JSON字符串中的数据加载到ASP.NET页面中。 用户可以选择一行或多行而不是单击“确认”按钮。

当单击“确认”按钮时,我在代码隐藏中检查选择了多少行。 如果没有选择任何行,我会向用户显示一个消息框,否则我会保存数据。

问题是如果没有选择行,按“确认”按钮会使得从网格中获取任何数据变得不可能,所以我需要手动重新加载页面。

似乎PostBack是部分的,并不会更新所有页面。

这里有一些来自aspx页面的代码                             

        var app = angular.module('myApp', ['ngGrid']);

        app.controller('MyCtrl', function ($scope) {

            $scope.multiSelect = false;

            $(".gridStyle").keydown(function (e) {
                if ((e.keyCode == 16 || e.keyCode == 17) && !$scope.multiSelect) {
                    $scope.multiSelect = true;
                }
            });
            $(".gridStyle").keyup(function (e) {
                if ((e.keyCode == 16 || e.keyCode == 17)) {

                    $scope.multiSelect = false;
                }
            });

            $scope.mySelections = [];
            $scope.myData = myJsonData;
            $scope.myColDef = myColumnDef;
            $scope.enableRowSelection = myEnableRowSelection;
            $scope.checkboxHeaderTemplate = myCheckboxHeaderTemplate;
            $scope.gridOptions = {
                data: 'myData',
                columnDefs: $scope.myColDef,
                selectedItems: $scope.mySelections,
                checkboxHeaderTemplate: $scope.checkboxHeaderTemplate,
                showSelectionCheckbox: $scope.enableRowSelection,
                selectWithCheckboxOnly: false,
                enableRowSelection: $scope.enableRowSelection,
                beforeSelectionChange: function (rowItem, event) {
                    if (!$scope.multiSelect) {
                        angular.forEach($scope.myData, function (data, index) {
                            $scope.gridOptions.selectRow(index, false);
                        });
                    }
                    return true;
                }
            }
        });
    </script>
</head>
<body>
<form id="form1" runat="server">
    <div id="msgboxpanel" runat="server"></div>
    <div class="gridStyle" ng-grid="gridOptions"></div>
    <input type="text" runat="server" name="selectedItems" id="selectedItems" value="{{gridOptions.selectedItems}}" />
    <asp:Button runat="server" Width="200px" OnClick="Button1_Click" ID="okButton" CssClass="submit" Text="Submit" meta:resourcekey="b_Submit" />
    </div>
</form>
</body>

此处代码背后:

protected void Button1_Click(object sender, EventArgs e)
{
    bool LoadErr = false;
    var jarray = JsonConvert.DeserializeObject<List<DummyTomTom>>(selectedTomTom.Value.ToString());

    if (jarray.Count > 0)
    {
        LoadErr = false;
        foreach (var item in jarray)
        {
            addTomTomToUser((DummyTomTom)item, (bool)checkAutomaticallyCreate.Checked);
        }
    }
    else
    {
        LoadErr = true;
        MessageBox msgbox = new MessageBox("msgbox\\msgbox.tpl", "../");
        msgbox.SetTitle(GetLocalResourceObject("t_noItemsSelectedMessage").ToString());
        msgbox.SetIcon("../msgbox/uyari.gif");
        msgbox.SetMessage(GetLocalResourceObject("l_noItemsSelectedMessage").ToString());
        msgbox.SetOKButton();
        msgboxpanel.InnerHtml = msgbox.ReturnObject();
        msgboxpanel.Visible = true;
        showMsg = true;
    }

}

有什么想法吗?

非常感谢!

1 个答案:

答案 0 :(得分:0)

我很惭愧......几个小时后我找到了答案......:

问题是selectedItems字段,在回发后 在代码隐藏中,在"else"中,我添加了这个简单的行:

selectedItems.Value="{{gridOptions.selectedItems}}";
谢谢你!