Question

我正在尝试在按钮单击事件期间打开一个对话框模式窗口，当我打开此窗口时，我希望能够调用一个获取最新信息的视图，并使用正确的信息更新模态对话框负载。但它始终抓住第一个记录并显示出来。查看代码时，它会打开对话框，然后运行并运行操作结果的代码，但View永远不会使用正确的记录进行更新。

所以我有一份送货地址的下拉列表。我想得到所选记录的ID，我得到了，将其传递给我已经完成的ActionResult方法，获取我需要的数据并打开一个对话框并传递我想要显示的信息，但它不是更新我传递的内容，因为模式已经弹出了原始模态值，我猜测列表中的第一个地址，而不是我当前选择的那个，如果有意义的话。

控制器：

  public ActionResult PublicInfo(string widgetZone)
    {
        var address = _workContext.CurrentCustomer.Addresses
            .FirstOrDefault(a => a.Id == _workContext.CurrentCustomer.ShippingAddress.Id);

        PublicInfoModel model = new PublicInfoModel();

        model.FirstName = address.FirstName;
        model.LastName = address.LastName;
        model.Address1 = address.Address1;
        model.Address2 = address.Address2;
        model.City = address.City;
        model.StateProvinceId = 1;
        model.StateProvinceName = address.StateProvince.Name;
        model.CountryId = 1;
        model.CountryName = address.Country.TwoLetterIsoCode;
        model.PostalCode = address.ZipPostalCode;

        return View("Nop.Plugin.Widgets.AddressVerification.Views.WidgetsAddressVerification.PublicInfo", model);
    }

    [HttpPost]
    public ActionResult PublicInfo(int id)
    {
        ViewBag.selectedShippingId = id;

        var address = _workContext.CurrentCustomer.Addresses
            .FirstOrDefault(a => a.Id == id);

        PublicInfoModel model = new PublicInfoModel();

        model.FirstName = address.FirstName;
        model.LastName = address.LastName;
        model.Address1 = address.Address1;
        model.Address2 = address.Address2;
        model.City = address.City;
        model.StateProvinceId = 1;
        model.StateProvinceName = address.StateProvince.Name;
        model.CountryId = 1;
        model.CountryName = address.Country.TwoLetterIsoCode;
        model.PostalCode = address.ZipPostalCode;

        return View("Nop.Plugin.Widgets.AddressVerification.Views.WidgetsAddressVerification.PublicInfo", model);
    }

型号：

@model Nop.Plugin.Widgets.AddressVerification.Models.PublicInfoModel

<div id="dialog-modal" style="display:none;">
    @Html.Partial("Nop.Plugin.Widgets.AddressVerification.Views.Shared._Address", Model)
</div>

<script type="text/javascript">
  $(document).ready(function () {
        $("#shipping-buttons-container .new-address-next-step-button")[0].onclick = null;
        $("#shipping-buttons-container .new-address-next-step-button").click(function () {
            newContent();
            if (e.preventDefault) {
                // For modern browsers
                e.preventDefault();
            }
            else {
                // For older IE browsers
                e.returnValue = false;
            }


            //Shipping.save();
        });

        function newContent() {
            $(function () {
                var selectedShippingAddressId = $('#shipping-address-select').val();
                //alert(selectedShippingAddressId);
                if (selectedShippingAddressId != null) {
                    $('#dialog-modal').dialog({
                        autoOpen: true,
                        width: 500,
                        resizable: false,
                        title: 'An updated address has been determined, would you like to use this one?',
                        modal: true,
                        open: function (event, ui) {
                            var url = '@Url.Action("PublicInfo", "WidgetsAddressVerification")';
                            $.post(url, { id: selectedShippingAddressId });

                        },
                        buttons: {
                            "Close": function () {
                                $(this).dialog("close");
                            }
                        }
                    });
                }

            });
        }
    });
</script>

任何帮助将不胜感激。只是为了在模态中弹出当前选择的信息。

Answer 1

我不完全确定你想要它如何流动，但是为了更新你的模态的内容，你只需要更新你的对话模式div，从ajax调用的部分视图中为js调用这些内容

$("#shipping-buttons-container .new-address-next-step-button").click(function() {
        $.ajax({
            type: 'post',
            url: "@Url.Action("PublicInfo", "WidgetsAddressVerification")",
            success: function(data) {
                $("#dialog-modal").html(data);
                $('#dialog-modal').modal('show'); 
            }
        });
    });

使用控制器在部分视图中传回html，因此它不包含_Layout模板，只是原始html。

public PartialViewResult PublicInfo(string widgetZone)
    {
        var address = _workContext.CurrentCustomer.Addresses
        .FirstOrDefault(a => a.Id == _workContext.CurrentCustomer.ShippingAddress.Id);

        PublicInfoModel model = new PublicInfoModel();

        model.FirstName = address.FirstName;
        model.LastName = address.LastName;
        model.Address1 = address.Address1;
        model.Address2 = address.Address2;
        model.City = address.City;
        model.StateProvinceId = 1;
        model.StateProvinceName = address.StateProvince.Name;
        model.CountryId = 1;
        model.CountryName = address.Country.TwoLetterIsoCode;
        model.PostalCode = address.ZipPostalCode;

        return PartialView("Nop.Plugin.Widgets.AddressVerification.Views.WidgetsAddressVerification.PublicInfo", model);
    }

Answer 2

默认情况下，Jquery在异步模式下工作。

在使用

进行发布时

$.post(url, { id: selectedShippingAddressId });

你可以使用

$.ajax({
    url: url,
    data: { id: selectedShippingAddressId },
    success: success,
    type: 'POST',
    async:false
});

现在，当代码经过处理时，pop将始终加载。

在MVC更新部分视图之前打开JQuery对话框

2 个答案: