Question

我有一个ASP.NET MVC 3 Web，它打开一个带有局部视图内容的jquery对话框。

  div.load(baseUrl + 'Home/AssignWarehouse?warehouseId=' + warehouseId + '&countryId=' + countryId).dialog(
        {
            width: 400,
            height: 250,
            modal: true,
            close: function (even, ui) {
                refreshMatrix(warehouseId, countryId);
            }
        }
    );

加载的视图是一个简单的复选框列表和一个刚刚添加到表单中的“保存”按钮。

局部视图。我还没有添加任何脚本。

@model AjaxConcept2.Controllers.AssignWarehouseModel

<div style="width:49%; display: inline-block">

    <h3>Country</h3>
    @Html.DisplayFor(model => model.CountryText)

</div>

<div style="width:49%; display: inline-block;">


    <h3>Warehouse</h3>
    @Html.DisplayFor(model => model.WarehouseText)

</div>

<div style="margin-top: 20px;">

    <input type="checkbox"/> Option A<br/>
    <input type="checkbox"/> Option B<br/>
    <input type="checkbox"/> Option C

</div>

<input type="button" value="Save">

我的问题是，我可以通过简单的方式从该保存按钮关闭对话框吗？我想运行在局部视图中定义的脚本，然后关闭对话框。我不太熟悉jquery和jquery.ui。：）

“保存”按钮位于局部视图中，动态加载，点击它就是触发器。

编辑：

我是否需要保持所有javascripts全局并跟踪具有唯一ID或类的输入字段？我希望的是从局部视图中运行脚本。

// Johan

Answer 1

调用close方法关闭任何对话框。

// If your div is still known or available
div.dialog('close');

// Any element which is a dialog
$('.element').dialog('close');

另请参阅jQuery UI API documentation。

您可以将保存按钮的事件委托给document。假设您的保存按钮具有类btn-save。您可以执行以下操作：

$(document).on('click', '.btn-save', function () {
    $('.my-dialog').dialog('close');
});

有关事件委派的更多信息，请check this page in the jQuery documentation。

关闭动态加载的jQuery对话框

1 个答案: