使用 AJAX 时如何调用下拉列表的 sub onchange？答案

【问题标题】：How to call sub onchange of a dropdownlist while using AJAX?使用 AJAX 时如何调用下拉列表的 sub onchange？
【发布时间】：2015-04-08 19:55:51
【问题描述】：

所以，我知道如何使用 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”未定义。

我该怎么做？

【问题讨论】：

你确定有 OnChange 下拉列表的服务器事件吗？
我用它来调用一些JS代码，所以我很确定。现在我只是在尝试使用 AJAX。
这就是我所说的，如果你想从 javascript 调用服务器端方法，那么你应该将该方法设为静态。并发布你的 js 代码。
我明白你现在在说什么了；必须有一个 OnChange 事件才能这样做。这满足了我的问题，所以请随时发布答案。我也不确定如何通过 JS 调用静态服务器端方法，您介意提供一个简单的示例吗？

标签： asp.net vb.net asp.net-ajax ajax.net

【解决方案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后面的代码。更多关于这个is available here。

【讨论】：

很棒的答案，教给我的东西比我希望的要多。
很高兴它有帮助。编码愉快！