Question

我在ASP.NET中遇到javascript问题我修改了一个listBox，使用javascript添加和删除命令现在我必须在后面的代码中使用列表的数据。如何将此数据传递给服务器？我可以使用json吗？

这是代码。由于删除，我无法使用hiddenField。

<asp:listbox ID="SubCat" runat="server" ></asp:listbox>
<input type=button onClick="addOption(SubCat)"; value='Add'> 
<input type=button onClick="removeOptions(SubCat)"; value='Remove Selected'>
<input type=button onClick="removeAllOptions(SubCat)"; value='Remove All'>


<script type="text/javascript">


 function removeAllOptions(selectbox) {
    var i;
    for (i = selectbox.options.length - 1; i >= 0; i--) {
        selectbox.remove(i);
    }
 } 

 function removeOptions(selectbox) {
    var i;
    for (i = selectbox.options.length - 1; i >= 0; i--) {
        if (selectbox.options[i].selected)
           selectbox.remove(i);
    }
 }

 function addOption(selectbox) {
    var txtBox1 = document.getElementById('txForn')
    var optn = document.createElement("OPTION");
    var t = txtBox1.value;
    optn.text = t;
    optn.value = t;
    selectbox.options.add(optn);
 }

</ script>

Answer 1

为什么你不能使用隐藏？您可以轻松存储从列表框中添加或删除的项目记录的ID，并更新服务器。您的其他选项是Web服务，或者将数据流式传输到处理程序。

任一选项，任何客户端更改都不会保留，因此在每次回发时，您都必须使用更新的数据重新加载ListBox控件。

Answer 2

您可以简单地创建一个Web服务并添加一个方法，例如DeleteSelectedOptions并更改removeOptions函数，如下所示：

function removeOptions(selectbox) {
   $.ajax({
       type: 'POST',
       url: 'yourservice.asmx/DeleteSelectedOptions',
       data: "{ids: '" + yourIds + "'}", // yourIds like : "1,6,9,34" 
       contentType: "application/json; charset=utf-8",
       dataType: 'json',
       success: function (result) {
          //if success, remove option on page
          var i;
          for (i = selectbox.options.length - 1; i >= 0; i--) {
            if (selectbox.options[i].selected)
               selectbox.remove(i);
          }
       },
       failure: function(errMsg) {
        alert(errMsg);
       }
    });  
  }

示例WebService Remove.asmx

 [WebMethod]
 public string DeleteSelectedOptions(string ids)
 {
     string[] idsArray = ids.Split(',')
     // your delete codes 
     return result;
 }

Answer 3

标记您需要向服务器发出AJAX请求。请参阅下面的示例。

它利用POST，您可以在其中将表单中的字段发送到服务器方法。 POST也提供了一个成功函数，例如，如果你的方法返回一个值，你需要在页面上显示它，所以在这个成功函数中你可以处理它。

假设您在服务器端代码behidn文件中有以下方法：

 public static bool AddNewItem(string name, string surname, int age)
    {


      return true;      
    }

buttons:
{
    "Add": function () {
        var name = $("#<%= txtName.ClientID  %>").val();
        var surname = $("#<%= txtSurname.ClientID %>").val();
        var age = $("#<%= txtAge.ClientID %>").val();

        $.ajax({
            type: 'POST',
            url: 'MyWebPage.aspx/AddNewItem',
            data: '{"name":"' + name + '", "surname":"' + surname + '", "age":' + age + '}',
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (msg) {
                if (msg.d) {
                    alert("Successfully added new item");                                    
                }
            },
            error: function () {
                alert("Error! Try again...");
            }
        });
    },
    "Cancel": function () {
        $(this).dialog("close");
    }
}

将字符串列表从Javascript传递到asp.net代码隐藏

3 个答案: