如何用jquery ajax请求替换部分asp.net页面？

比方说，我在页面上有一个Listview控件。 每个Listview项目都有2个下拉列表和1个文本框。 当第一个下拉列表中的选定值发生更改时，第二个下拉列表应使用city填充，具体取决于第一个下拉列表。 最后，当为第二个下拉列表选择一个值时，成本应显示在文本框中。

  
 
 
Country
 
City
 
Cost
 
 
 
 
                  

现在，当用户为下拉列表选择不同的值时，我想使用ajax

 $('select').change(function () { $.ajax({ type: "POST", url: "Default.aspx/DropDownList1_SelectedIndexChanged", data: "{}", success: function(msg) { // Replace the div's content with the page method's return. // } }); 

我想只替换整个tr元素。 这是我的问题：

1. 我应该在数据中发送什么？ 下拉列表的价值？

2. 如何仅替换包含触发ajax调用的下拉列表的行 ？

编辑

所有方法都有以下签名

 protected void ddlCountry_SelectedIndexChanged(object sender, EventArgs e) 

这是一个非常漫长而复杂的页面。

谢谢你的帮助

Answer 1

首先，查看您发布的示例代码以及计划如何进行Ajax调用，您需要在页面中启用PageMethods 。 请参阅本教程 ，了解如何执行该部分。

使用jQuery的实际ajax调用可以像这样简单：

 $('select').change(function () { $.post('Default.aspx/MethodName',{selectedVal:$(this).val()}, function(data){ //as far as placing the result in the input text field, I think this will do: $(this).parents('tr').find('input:text').val(data); }); }); 

现在，您的MethodName方法必须如下所示：

  [WebMethod] public static string MethodName(string selectedVal) { return "something"; } 

jsfiddle（减去ajax调用）。

更新

对不起，我误解了这个问题，OP想要替换整个行。 这样就可以了：

  $(this).parents('tr').replaceWith('
'+data+'
'); 

完整背景：

 $('select').change(function () { $.post('Default.aspx/MethodName',{selectedVal:$(this).val()}, function(data){ //as far as replacing the row, this will do: $(this).parents('tr').replaceWith('
'+$(this).val()+'
'); }); });