使用AJAX时如何调用下拉列表的子onchange？

Question

因此，我知道如何使用ajax在按钮的onclick上调用方法，但是当用户在下拉列表中选择新内容时，我想做同样的事情。 我将在下面显示我尝试过的代码：

<asp:UpdatePanel ID="pnlHelloWorld" runat="server">

      <ContentTemplate>

        <div style="height: auto; overflow: auto; max-height:750px; width:100%;">
          <asp:DropDownList ID="mydropdownlist" runat="server" Enabled="true" OnChange="changeMyTable"></asp:DropDownList>   
          <asp:Table ID="mytable" runat="server"></asp:Table>
        </div>

      </ContentTemplate>

</asp:UpdatePanel>

在页面的aspx.vb中：

Private Sub changeMyTable()
'Add rows to table
end sub

问题是，当我更改下拉列表时，“ changeMyTable”未定义。

我怎样才能做到这一点？

Answer 1

您正在使用OnChange事件从javascript调用方法背后的代码。 要访问方法背后的代码，您需要将该方法转换为WebMethod 。 为此，您可以尝试以下操作（仅作为示例）

     <asp:TextBox ID="txtName" runat="server"></asp:TextBox>
     <asp:TextBox ID="txtLastName" runat="server"></asp:TextBox>
     <asp:TextBox ID="txtMsg" runat="server"></asp:TextBox>

JavaScript代码-

   <script type="text/javascript">
    function greet(txtN, txtLastN, txtMsg){
     var ctrlN = document.getElementById(txtN);
     var ctrlLastN = document.getElementById(txtLastN);
     var fullName = ctrlN.value + '  ' + ctrlLastN.value;
     PageMethods.greetUser(fullName, greetSuccess, greetFailed, txtMsg);
   }
  function greetSuccess(res, txtMsg) {
    var ctrlTxtMsg = document.getElementById(txtMsg);
    ctrlTxtMsg.value = res;
   }
  function greetFailed(res, dst) {
    alert(res.get_message());
   }
 </script>

方法背后的代码-

   <System.Web.Services.WebMethod()> _
      Public Shared Function greetUser(ByVal fullName As String) As String
         Return "Welcome " & fullName & "!"
     End Function

现在，您可以从任意位置调用javascript函数greet ，它将触发方法greetUser后面的代码。 有关更多信息， 请参见此处 。