Question

我想使用webservice来填充下拉列表并希望使用ajax将所选值传递给控制器我该怎么做呢请帮助这里是我到目前为止所尝试的。这里是我的webservice中的内容是json格式。假设这是我的网络服务https://www.abc.com/webservices/radius.php?json

{
    "results" : [{
            "zip" : "12345",
            "city" : "delhi",
            "distance" : "0.0"
        }, {
            "zip" : "123456",
            "city" : "noida",
            "distance" : "3.1"
        }, {
            "zip" : "123457",
            "city" : "faridabad",
            "distance" : "9.1"
        }, ]
}

我在尝试什么

$.getJSON('https://www.abc.com/webservices/radius.php?json',function(results){ 
for (var i = 0; i <= s.results.length - 1; i++) {
      var x = new Option();
      x.text = s.results[i].city;
      x.value = s.results[i].zip;
      console.log(x);
      document.getElementById('dd').appendChild(x);
    }
}) 

<select id='dd'>
</select>

控制器

[HttpPost]
public ActionResult Search(string distance)
{
    //stuffs 
}

请帮助如何调用该Web服务并填写该下拉菜单以及如何将其传递给控制器

Answer 1

创建一个下拉列表：

<select name="MySelect" id="MySelect">

</select>

现在在javascript中，也使用jquery：

var Options = "";
$.getJSON('https://www.abc.com/webservices/radius.php?json', function (response) {
    for (var i = 0; i < response.results.length; i++) {
        Options += "<option value '" + response.results[i].zip + "'>" + response.results[i].city + "</option>";

    }
});

$("#MySelect").append(Options); // appending all options here

使用$.ajax：

var Options = "";
$.ajax({
         url: "https://www.abc.com/webservices/radius.php?json",
         type: "get",
         success: function (response) {
               for (var i = 0; i < response.results.length; i++) {
                     Options += "<option value '" + response.results[i].zip + "'>" + response.results[i].city + "</option>";
                             }

            },
         error: function () {
              alert("failure");

            }
       });

Here是DEMO FIDDLE，用于使用javascript填充选项。

现在你可以通过这种方式获得它的价值：

[HttpPost]
public ActionResult Search(FormCollection form)
{
   string ddlValue  = form["MySelect"].ToString();
}

使用mvc中的webservice填充下拉列表

1 个答案: