Question

方案

我在页面上有下拉列表，   现在关于它的变化事件我会   喜欢从数据库中提取一些数据   然后显示它。

我可以用回发来做，我   尝试使用Ajax.Beginform（）但它   还在回帖。

<script src="../../Scripts/MicrosoftAjax.js" type="text/javascript"></script>
<script src="../../Scripts/MicrosoftMvcAjax.js" type="text/javascript"></script>

    <%using (Ajax.BeginForm("UpdatePanel", new AjaxOptions { UpdateTargetId = "divDetails" }))
          {%>
        <%=Html.DropDownList("Dinner", (SelectList)ViewData["Dinner"], new { onchange = "this.form.submit();" })%>
        <div id="divDetails">
            <fieldset>
                <legend>Details</legend>
                <% if (Model != null)
                   {%>
                <p>
                    ID:
                    <%= Html.Encode(Model.ID)%>
                </p>
                <p>
                    Title:
                    <%= Html.Encode(Model.Title)%>
                </p>
                 <%} %>
            </fieldset>
            <%} %>

任何帮助表示感谢。

Answer 1

我相信您使用BeginForm的问题是MVC总是会进行整页回发 - 至少在我的经验中。如果您想要“部分”回发，则需要使用javascript和webservices。

我正在使用GeoIP做到这一点。这是我的页面的样子：

<p>
<label for="country">Country</label>
<%= Html.DropDownList("country", new SelectList(Model.Countries, "CountryId", "Name", Model.DefaultCountry.CountryId))%>
<%= Html.ValidationMessage("country")%>
</p>

<p>
<label for="subdivision">Subregion</label>
<%= Html.DropDownList("subdivision", new SelectList(Model.Subdivisions, "SubdivisionId", "Name", Model.DefaultSubdivision.SubdivisionId)) %>
<%= Html.ValidationMessage("subdivision")%>
</p>

<script type="text/javascript">

    $('#country').change(function() {

        $('#subdivision').children().remove();

        var countryId = $("#country > option:selected").val();

        Sys.Net.WebServiceProxy.invoke   
            (   
                '/WebServices/Regions.asmx',
                "GetSubdivisions",   
                false,
                { countryId: countryId },
                addressControl_bindOptionResults   
            );
    });

    function addressControl_bindOptionResults(data)   
    {   
        for (var x = 0; x < data.length; x++) {
            $("#subdivision").append($('<option></option>').val(data[x].Id).html(data[x].Name));  
        }   
    }

</script>

我的网络服务看起来像这样。添加新的Web服务时，请确保取消注释类声明上方的属性：

[System.Web.Script.Services.ScriptService]

请记住，您返回的对象必须是可序列化的。

[WebMethod]
        public Subdivision[] GetSubdivisions(int countryId)
        {
            if (this.repository == null)
            {
                Resolve();
            }

            List<Subdivision> subdivisions = new List<Subdivision>(repository.GetActiveSubdivisionsDto(countryId));

            return subdivisions.ToArray();
        }

忽略我的网络服务的一些内部工作原理。我在我的数据层使用unity，Nfluent和NHibernate，但基础是相同的。调用数据库，获取对象，并返回可序列化数据传输对象的列表（我的只是名称和ID）。

Answer 2

你考虑过使用jQuery吗？我使用jQuery.post作为我的解决方案。这是一个适合我的例子：

jQuery(document).ready(function() {

  // Dropdown or select list
  jQuery('#countryListBox').change(function(){ populateCityListBox(); });

  function populateCityListBox()
  {
    //Get ID for selected country
    var ctryID = jQuery("select#countryListBox").val();

    jQuery.post("inclyde/jquery_get_data.php", { instance: 'getCitiesByCountry', countryID: ctryID },
      function(data)
      {
          //Process data and store it in var newContent.
          // Then bind data to the div you wish to present the content
          jQuery("div.myNewText").html(newContent);

      }, "json");
  }
});

我很难让.NET Ajax工作。在我发现jQuery之后，事情非常甜蜜：）

Answer 3

问题是onchange =“this.form.submit（）;”。当您通过form.submit（）提交表单时，Ajax - MS的脚本不会启动。通过放置

进行检查

<input type="submit" value="submit" />

以删除form.submit（）的形式。然后，控制器中的请求将是Request.IsAjaxRequest = true。

我不知道如何以一种很好的方式摆脱提交按钮 - 我让它变得不可见并通过Javascript点击它。

这是我第一次在MVC的ajax拍摄。然后我用了jquery，很高兴。

Answer 4

老话题，但我遇到了同样的问题并最终弄明白了：

变化：

onchange = "this.form.submit();"

为：

onchange = "$(this.form).submit();"

在mvc中以ajaxian方式更新下拉更改事件的数据

4 个答案: