使用Asp的Angular JS：UpdatePanel

Question

<%@ Page Title="" Language="C#" MasterPageFile="~/Admin/AdminMasterpage.master" AutoEventWireup="true" CodeBehind="ExamSet.aspx.cs" Inherits="demo.Admin.ExamSet" %>
<asp:Content ID="Content1" ContentPlaceHolderID="content" runat="server">
<style>
    #body-wrapper {background:none !important;}
     #ctl00_menu_liProduct{background: transparent url(../images/bg-menu-item-green.png) right center no-repeat !important; color:#fff !important;}
     #ctl00_menu_liProduct a{ color:#fff !important;}
     #main-content tbody tr.alt-row{ background:none;}
     .text-input{ width:100%;}
     #main-content table td{ text-align:center}
     #main-content table td span{ text-align:center; font-size:16px; font-weight:bold;}
     #main-content tbody { border:none;}
     #main-content table td, #main-content table th {padding: 8px;line-height: 1.3em;}
     #main-content tbody tr {
    background: none;

}

</style>
<script type="text/javascript" src="http://code.angularjs.org/1.2.13/angular.js"></script>
<script type="text/javascript">
    var app = angular.module('plunker', []);

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

        $scope.total = function () {
            var total = parseFloat($scope.txtAmount1 || 0) + parseFloat($scope.txtAmount2 || 0) +
                    parseFloat($scope.txtAmount3 || 0) + parseFloat($scope.txtAmount4 || 0) +
                    parseFloat($scope.txtAmount5 || 0);
            return total || 0;
        };
    });
</script>
<script language="javascript" type="text/javascript">
    function CheckNumeric(e) {

        if (window.event) // IE 
        {
            if ((e.keyCode < 48 || e.keyCode > 57) & e.keyCode != 8) {
                event.returnValue = false;
                return false;

            }
        }
        else { // Fire Fox
            if ((e.which < 48 || e.which > 57) & e.which != 8) {
                e.preventDefault();
                return false;

            }
        }
    }

    </script>
<div ng-app="plunker">
<div ng-controller="MainCtrl">
<link href="../css/style_ExamSet.css" rel="stylesheet" type="text/css" />
<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">

    <div id="main-content" style=" height:1100px;">
        <div class="content-box" style=" height:100%;">
            <!-- Start Content Box -->
            <div class="content-box-header">
                <h3 title="Add Sub Class">
                    Add Examination Set
                </h3>
                <div class="clear">
                </div>
            </div>
            <!-- End .content-box-header -->
            <div class="content-box-content">
                <asp:ScriptManager ID="ScriptManager1" runat="server">
                </asp:ScriptManager>
            <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
            <div class="su-main">
<div class="full-main">
<table width="100%">
<tr>
<td>
<div class="select">

<div class="lab">
<label>Select Class</label>
</div>
<div class="lab">
<asp:DropDownList class="form-control" ID="ddlClass" runat="server" AutoPostBack="true" onselectedindexchanged="ddlClass_SelectedIndexChanged"></asp:DropDownList>
</div>
</div>
</td>
<td>
<div class="select">
<div class="lab">
<label>Select Class</label>
</div>
<div class="lab">
<asp:DropDownList class="form-control" ID="ddlSection" runat="server">
<asp:ListItem Text="Select Section" Value="0" Selected></asp:ListItem>
</asp:DropDownList>
</div>
</div>
</td>
</tr>

</table>

<table width="100%" class="table-2"> 
<tr>
<th colspan="2">Select Subject</th>
<th width="27%" colspan="2">Select Topic</th>
<th width="33%" colspan="2">Select Concept</th>
</tr>
<tr>
<td colspan="2">
<asp:ListBox ID="SubjectList" runat="server" AutoPostBack="True" Rows="12" 
        Width="224px" onselectedindexchanged="SubjectList_SelectedIndexChanged"></asp:ListBox>
</td>
<td colspan="2">
<asp:ListBox ID="TopicList" runat="server" AutoPostBack="True" Rows="12" 
        Width="224px" SelectionMode="Multiple" 
        onselectedindexchanged="TopicList_SelectedIndexChanged"></asp:ListBox>
</td>
<td colspan="2">
<asp:ListBox ID="ConceptList" runat="server" AutoPostBack="True" Rows="12" 
        Width="224px" SelectionMode="Multiple" 
        onselectedindexchanged="ConceptList_SelectedIndexChanged"></asp:ListBox>
</td>
</tr>
<tr class="text-lavel">
<td>Level 1</td>
<td width="17%">Level 2</td>
<td>Level 3</td>
<td>Level 4</td>
<td>Level 5</td>
<td>Total Available Questions</td>

</tr>
<tr class="text-lavel">
  <td><asp:Label ID="LblL_1" runat="server"></asp:Label></td>
  <td width="17%"><asp:Label ID="LblL_2" runat="server"></asp:Label></td>
  <td><asp:Label ID="LblL_3" runat="server"></asp:Label></td>
  <td><asp:Label ID="LblL_4" runat="server"></asp:Label></td>
  <td><asp:Label ID="LblL_5" runat="server"></asp:Label></td>
  <td><asp:Label ID="LblTotalQuestion" runat="server"></asp:Label></td>
</tr>

<tr class="input-t" >

  <td> <input type="text" placeholder="0" onkeypress="CheckNumeric(event);" xmlns:asp="#unknown" id="txtAmount1" ng-model='txtAmount1' /></td>
  <td> <input type="text" placeholder="0" onkeypress="CheckNumeric(event);" xmlns:asp="#unknown" id="txtAmount2" ng-model='txtAmount2' /></td>
  <td> <input type="text" placeholder="0" onkeypress="CheckNumeric(event);" xmlns:asp="#unknown" id="txtAmount3" ng-model='txtAmount3' /></td>
  <td> <input type="text" placeholder="0" onkeypress="CheckNumeric(event);" xmlns:asp="#unknown" id="txtAmount4" ng-model='txtAmount4' /></td>
  <td> <input type="text" placeholder="0" onkeypress="CheckNumeric(event);" xmlns:asp="#unknown" id="txtAmount5" ng-model='txtAmount5' /></td>
  <td> <input type="text" disabled id="txtTotalFx" ng-value="total()"  /></td>

</tr>

</table>


<table width="100%" class="line-s">
<tr>
<td>Please Enter No of Sets You Want To Create: <asp:TextBox ID="txtNoOfSet" 
        runat="server" onkeypress="CheckNumeric(event);" xmlns:asp="#unknown" 
        AutoPostBack="True" ontextchanged="txtNoOfSet_TextChanged"></asp:TextBox></td>
</tr>

</table>

<table width="100%" class="table-3"> 

<tr>
<th>Set 1</th>
<th width="33%" colspan="2">Set 2</th>
<th width="33%" colspan="2">Set 3</th>
</tr>

<tr>
<td width="33%">
<asp:Repeater ID="Repeater1" runat="server" 
        onitemdatabound="Repeater1_ItemDataBound">
<HeaderTemplate>
            <table cellpadding="2" cellspacing="2">
                <tr>
                    <th scope="col" style="width: 120px">
                        S.no
                    </th>
                    <th scope="col" style="width: 100px">
                        Level Name
                    </th>
                </tr>
        </HeaderTemplate>
<ItemTemplate>
<tr>
     <td>
        <asp:Label ID="lblLevelNo" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "LevelId_ExamSet")%>'></asp:Label>
    </td>
    <td>
        <asp:Label ID="lblLevelName" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "LevelName_ExamSet")%>'></asp:Label>
        <asp:BulletedList ID="LstQuestions" BulletStyle="UpperRoman" runat="server"></asp:BulletedList>
    </td>
</tr>

</ItemTemplate>
<FooterTemplate>
  </table>
</FooterTemplate>
</asp:Repeater>

</td>
<td colspan="2"  width="33%" style="vertical-align:text-top;">
        <asp:Panel ID="PanelSetOption" runat="server" Visible="false">
        <asp:RadioButtonList ID="ShuffelingType_ExamSet" runat="server" AutoPostBack="true" 
                onselectedindexchanged="ShuffelingType_ExamSet_SelectedIndexChanged">
        <asp:ListItem Text="Question Shuffling" Value="1"></asp:ListItem>
        <asp:ListItem Text="Level Shuffling" Value="2"></asp:ListItem>
        <asp:ListItem Text="Both" Value="3"></asp:ListItem>
        </asp:RadioButtonList>
        </asp:Panel>    
        <asp:Panel ID="SetData_1" runat="server" Visible="false">
            <asp:Repeater ID="Repeater2" runat="server" 
                onitemdatabound="Repeater2_ItemDataBound">
                <HeaderTemplate>
                    <table cellpadding="2" cellspacing="2">
                        <tr>
                             <th scope="col" style="width: 120px">
                                S.no
                             </th>
                             <th scope="col" style="width: 100px">
                                Level Name
                             </th>
                       </tr>
                 </HeaderTemplate>
                 <ItemTemplate>
                       <tr>
                            <td>
                                 <asp:Label ID="lblLevelNo" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "LevelId")%>' Visible="false"></asp:Label>
                                  <asp:Label ID="Label1" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "LevelId_ExamSet")%>'></asp:Label>
                           </td>
                            <td>
                                 <asp:Label ID="lblLevelName" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "LevelName")%>'></asp:Label>
                                 <asp:BulletedList ID="LstQuestions" BulletStyle="UpperRoman" runat="server"></asp:BulletedList>
                           </td>
                      </tr>

                </ItemTemplate>
                <FooterTemplate>
                     </table>
                </FooterTemplate>
            </asp:Repeater>

        </asp:Panel>
        <asp:Panel ID="SetData_2" runat="server" Visible="false">
            <asp:Repeater ID="Repeater3" runat="server">
                <HeaderTemplate>
                    <table cellpadding="2" cellspacing="2">
                        <tr>
                             <th scope="col" style="width: 120px">
                                S.no
                             </th>
                             <th scope="col" style="width: 100px">
                                Level Name
                             </th>
                       </tr>
                 </HeaderTemplate>
                 <ItemTemplate>
                       <tr>
                            <td>
                                 <asp:Label ID="lblLevelNo" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "LevelId")%>' Visible="false"></asp:Label>
                                  <asp:Label ID="Label1" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "LevelId_ExamSet")%>'></asp:Label>
                           </td>
                            <td>
                                 <asp:Label ID="lblLevelName" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "LevelName")%>'></asp:Label>
                                 <asp:BulletedList ID="LstQuestions" BulletStyle="UpperRoman" runat="server"></asp:BulletedList>
                           </td>
                      </tr>

                </ItemTemplate>
                <FooterTemplate>
                     </table>
                </FooterTemplate>
            </asp:Repeater>

        </asp:Panel>
        <asp:Panel ID="SetData_3" runat="server" Visible="false">
            <asp:Repeater ID="Repeater4" runat="server" 
                onitemdatabound="Repeater4_ItemDataBound">
                <HeaderTemplate>
                    <table cellpadding="2" cellspacing="2">
                        <tr>
                             <th scope="col" style="width: 120px">
                                S.no
                             </th>
                             <th scope="col" style="width: 100px">
                                Level Name
                             </th>
                       </tr>
                 </HeaderTemplate>
                 <ItemTemplate>
                       <tr>
                            <td>
                                 <asp:Label ID="lblLevelNo" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "LevelId_ExamSet")%>' Visible="false"></asp:Label>
                                  <asp:Label ID="Label1" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "LevelId_ExamSet")%>'></asp:Label>
                           </td>
                            <td>
                                 <asp:Label ID="lblLevelName" runat="server" Text='<%# DataBinder.Eval(Container.DataItem, "LevelName_ExamSet")%>'></asp:Label>
                                 <asp:BulletedList ID="LstQuestions" BulletStyle="UpperRoman" runat="server"></asp:BulletedList>
                           </td>
                      </tr>

                </ItemTemplate>
                <FooterTemplate>
                     </table>
                </FooterTemplate>
            </asp:Repeater>

        </asp:Panel>  
</td>
<td colspan="2"  width="33%"  style="vertical-align:text-top;">
        <asp:Panel ID="PanelSetOption1" runat="server" Visible="false">
        <asp:RadioButtonList ID="ShuffelingType_ExamSet1" runat="server">
        <asp:ListItem Text="Question Shuffling" Value="1"></asp:ListItem>
        <asp:ListItem Text="Level Shuffling" Value="2"></asp:ListItem>
        <asp:ListItem Text="Both" Value="3"></asp:ListItem>
        </asp:RadioButtonList>
        </asp:Panel>    
</td>
</tr>
</table>
<table  width="100%" class="line-s" style="text-align:center;">
<tr>
<td><button class="button-btn">Submit</button></td>
</tr>
</table>
</div>
</div>
</ContentTemplate>
</asp:UpdatePanel>
            </div>
    </div>
    </div>
</div>
</div>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="contentChild" runat="server">
</asp:Content>

这是我的源代码。它准确地第一次工作，但在回发任何功能后它被禁用。

Answer 1

当页面回传时，它会丢弃jquery处理程序。她需要试试这个

<script type="text/javascript">
   function CheckNumeric(e) {

        if (window.event) // IE 
        {
            if ((e.keyCode < 48 || e.keyCode > 57) & e.keyCode != 8) {
                event.returnValue = false;
                return false;

            }
        }
        else { // Fire Fox
            if ((e.which < 48 || e.which > 57) & e.which != 8) {
                e.preventDefault();
                return false;

            }
        }
    }

    //Initial bind
    $(document).ready(function () {
        CheckNumeric();
    });

    //Re-bind for callbacks
    var prm = Sys.WebForms.PageRequestManager.getInstance(); 

    prm.add_endRequest(function() { 
        CheckNumeric();
    }); 

</script>

了解更多信息here is Microsoft documentation