1

寻求帮助...我正在使用 ASP MVC3 和 jQuery Mobile。我已经建立了一组级联下拉选择列表,当您第一次打开页面时可以正常工作。但是,提交表单后,它会返回到此页面,以便用户可以在需要时输入更多信息。问题是在您返回页面后级联下拉菜单不再起作用。

在 Firebug 中调试时,我在控制台中看不到任何错误。我必须进行 Control + F5 刷新才能让他们重新开始工作。如果我关闭 jQuery mobile ajaxEnabled 设置,那么它工作正常,所以这与 jQuery 移动框架和加载我认为的页面有关......

有人有想法么?

谢谢

编辑:以下是此页面的视图。基本上正在发生的是 $('#GasStation').change 事件似乎在用户被带回此页面后从未触发。如果我禁用 jQuery 移动 ajax 功能,它工作正常。

@model CPMobile.Models.FuelUsageModels.CreateModel
@{
    Layout = "~/Views/Shared/M/_Layout.cshtml";
}
<h2>@ViewBag.Title</h2>
<div data-theme="b">
    @Html.ValidationSummary(true, "Fuel usage recording failed. Please correct the errors and try again.")
    <div data-role="fieldcontain">
        @using (Html.BeginForm())
        {
            <div data-role="fieldcontain">
                @Html.LabelFor(m => m.GasStation)
                @Html.DropDownListFor(m => m.GasStation, Model.GasStationList, "Select Gas Station...")<br />
                @Html.ValidationMessageFor(m => m.GasStation)
            </div>
            <div data-role="fieldcontain">
                @Html.LabelFor(m => m.FuelType)
                @Html.DropDownListFor(m => m.FuelType, Enumerable.Empty<SelectListItem>(), "Select Fuel Type...")<br />
                @Html.ValidationMessageFor(m => m.FuelType)
            </div>            
            <div data-role="fieldcontain">
                @Html.LabelFor(m => m.EquipmentNumber)
                @Html.TextBoxFor(m => m.EquipmentNumber, new { @required = "required" })<br />
                @Html.ValidationMessageFor(m => m.EquipmentNumber)
            </div>
            <div data-role="fieldcontain">
                @Html.LabelFor(m => m.MeasurementValue)
                @Html.TextBoxFor(m => m.MeasurementValue, new { @required = "required", @type = "number" })<br />
                @Html.ValidationMessageFor(m => m.MeasurementValue)
            </div>           
            <div data-role="fieldcontain">
                @Html.LabelFor(m => m.MeasurementDatetime)
                @Html.EditorFor(m => m.MeasurementDatetime, new { @required = "required", @type = "date" })<br />
                @Html.ValidationMessageFor(m => m.MeasurementDatetime)
            </div>            


            <div data-role="fieldcontain">
                <input type="submit" value="Submit" data-theme="b" />
            </div>

        }
    </div>
</div>
@section scripts
{
    <script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
    <script type="text/javascript">        
        $('#GasStation').change(function () {
            var selectedGasStation = $(this).val();
            if (selectedGasStation != null && selectedGasStation != '') {
                $.getJSON(
                    '@Url.Action("FuelType")',
                    { gasStation: selectedGasStation },
                    function (fuelTypes) {
                        var fuelTypesSelect = $('#FuelType');
                        fuelTypesSelect.empty();

                        $.each(fuelTypes, function (fuelType, fuelTypeName) {
                            fuelTypesSelect.append($('<option/>', {
                                value: fuelType.value,
                                text: fuelTypeName.text
                            }));
                        });
                        fuelTypesSelect.selectmenu('refresh', true);
                    });
                }
            });
    </script>
}
4

0 回答 0