Question

我正在开发一个项目，它正在ASP.NET MVC2中开发

目前我使用Ajax加载一些数据。它在firefox和chrome上运行得很好但是我有IE的问题。

我的控制器：

    public ActionResult UpdateSearchResults(FormCollection formValues)
    {
        var equipmentsResults = EquipmentQueries.GetEquipments(Request.Form["Voltage"],
                                                               Request.Form["EquipmentType"],
                                                               Request.Form["Word"]);
        return PartialView("SearchResults", equipmentsResults);
    }

我的观点：

<% using (Ajax.BeginForm("UpdateSearchResults", 
       new AjaxOptions {UpdateTargetId = "loadingData", 
                        LoadingElementId = "loadingImage", 
                        HttpMethod = "POST"}))
   { %>
    <fieldset>
        <legend>Filters</legend>
        <label>Voltage: </label>
        <%=Html.DropDownList("Voltage", (SelectList)ViewData["Voltage"], "Select Voltage", new { onchange = "this.form.submit();" })%>
        <br />

        <label>Equipment Type: </label>
        <%=Html.DropDownList("EquipmentType", (SelectList)ViewData["Equipment"], "Select Equipment Type")%>
        <br />

        <label>Station Keyword Search: </label>
        <%=Html.TextBox("Word")%>
        <br />

        <input id="btnSubmit" type="submit" value="Submit" name="submit" />
        <br />
    </fieldset>

    <img id="loadingImage" src="../../Images/ajax-loader.gif" alt="loading"/>
    <div id="loadingData"></div>
<% }%>

我已添加以下脚本

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

我在调试过程中发现，在chrome和firefox中，所有DropDownList都填充了Request.Form（Request.Form（“Voltage”）实际显示用户在DropDownList上选择的内容），但在IE中这个Request.Form根本没有填充，它只是一个空字符串......

感谢大家的帮助

Answer 1

虽然我不知道为什么你的代码不适用于IE我有一些关于改进它的建议。像往常一样，我们首先定义一个视图模型，它将代表我们在视图上处理的数据：

型号：

public class ProductViewModel
{
    public string SelectedVoltage { get; set; }
    public IEnumerable<SelectListItem> Voltages 
    {
        get
        {
            return new SelectList(new[] {
                new SelectListItem { Value = "110", Text = "110V" },
                new SelectListItem { Value = "220", Text = "220V" },
            }, "Value", "Text");
        }
    }

    public string SelectedEquipementType { get; set; }
    public IEnumerable<SelectListItem> EquipementTypes
    {
        get
        {
            return new SelectList(new[] 
            {
                new SelectListItem { Value = "t1", Text = "Equipement type 1" },
                new SelectListItem { Value = "t2", Text = "Equipement type 2" },
            }, "Value", "Text");
        }
    }

    public string Word { get; set; }
}

控制器：

public class HomeController : Controller
{
    public ActionResult Index()
    {
        return View(new ProductViewModel());
    }

    [HttpPost]
    public ActionResult Search(ProductViewModel product)
    {
        var equipmentsResults = EquipmentQueries.GetEquipments(product);
        return View(equipmentsResults);
    }
}

查看：

<%@ Page Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<AppName.Models.ProductViewModel>" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
    Home Page
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script type="text/javascript" src="http://github.com/malsup/form/raw/master/jquery.form.js"></script>
<!-- TODO: Put this in an external javascript file -->
<!-- I've left it here just to illustrate -->
<script type="text/javascript">
    $(function () {
        var options = {
            success: function (result) {
                $('#loadingData').html(result);
            }
        };
        $('form').ajaxForm(options);
        $('#SelectedVoltage').change(function () {
            $('form').ajaxSubmit(options);
        });
    });
</script>

<% using (Html.BeginForm("search", "home")) { %>
    <fieldset>
        <legend>Filters</legend>
        <label for="SelectedVoltage">Voltage: </label>
        <%= Html.DropDownListFor(x => x.SelectedVoltage, Model.Voltages, "Select Voltage")%>
        <br />

        <label for="SelectedEquipementType">Equipment Type: </label>
        <%= Html.DropDownListFor(x => x.SelectedEquipementType, Model.EquipementTypes, "Select Equipment Type")%>
        <br />

        <label for="Word">Station Keyword Search: </label>
        <%= Html.TextBoxFor(x => x.Word)%>
        <br />

        <input id="btnSubmit" type="submit" value="Submit" name="submit" />
    </fieldset>
<% } %>
<br />
<div id="loadingData"></div>

</asp:Content>

现在您可以安全地转储所有MSAjax*脚本以及所有Ajax.*帮助程序。以正确的方式做到：不引人注意，jquery方式。

Answer 2

生成的html如何与select元素一样？检查select是否包含'name'属性。

，例如

Ajax.BeginForm，加载局部视图帮助

2 个答案: