Can a JQuery Dialog open another Jquery Dialog?

2019-02-20 09:35发布

I want to open a partial view as a JQuery dialog that when I click a link to open another Jquery dialog over the one that is already open.

Can I do that? If it is possible, how can I achieve that?

Edit 1:

First view

@model AuctionWebProject.Areas.Admin.Models.CategoryModel  
@{  
    ViewBag.Title = "Edit Category";  
    Layout = "~/Views/Shared/_Layout.cshtml";  
}  
<!DOCTYPE html>  
<html>  
<head>  
    <title>EditCategory</title>  
</head>  
<body>  
    <script src="@Url.Content("~/Scripts/jquery-1.6.2.min.js")" type="text/javascript"></script>  
    <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 src="@Url.Content("~/Scripts/modernizr-1.7.min.js")" type="text/javascript"></script>  
    <script src="@Url.Content("~/Scripts/jquery-ui-1.8.16.min.js")" type="text/javascript"></script>  
    <script type="text/javascript">  
        function ShowXsdEditor() {  
            $("#xsdEditor").dialog("open");  
        }  
    </script>  
    @using (Html.BeginForm())  
    {  
        @Html.ValidationSummary(true)  
        <fieldset>  
            <legend>CategoryModel</legend>  
            @Html.HiddenFor(model => model.Id)  
            <div class="editor-label">  
                @Html.LabelFor(model => model.Name)  
            </div>  
            <div class="editor-field">  
                @Html.EditorFor(model => model.Name)  
                @Html.ValidationMessageFor(model => model.Name)  
            </div>  
            <div class="editor-label">  
                @Html.LabelFor(model => model.Date)  
            </div>  
            <div class="editor-field">  
                @Html.EditorFor(model => model.Date)  
                @Html.ValidationMessageFor(model => model.Date)  
            </div>  
            <div class="editor-label">  
                @Html.LabelFor(model => model.Xsd)  
            </div>  
            <div class="editor-field">  
                @Html.TextAreaFor(model => model.Xsd, new { disabled = "disabled" })  
                @Html.ValidationMessageFor(model => model.Xsd)  
                <a href="javascript:void(0)" onclick="ShowXsdEditor();">Xsd Editor</a>  
            </div>  
            <p>  
                <input type="submit" value="Save" />  
            </p>  
        </fieldset>  
    }  
    <div>  
        @Html.ActionLink("Back to List", "Index")  
    </div>  
    @Html.Partial("XsdEditor", Model)  
</body>  
</html> 

Second view

    <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>  
<div id="xsdEditor" style="display: none;">  
     <a href="javascript:void(0)" onclick="ShowDialog();">Add new element</a>  
     <div id="elementList">  
     </div>  
</div>  
@Html.Partial("AddXSElement", new AuctionWebProject.Areas.Admin.Models.XSElementModel())  
<script type="text/javascript">  
    $(document).ready(function () {  
        $("#xsdEditor").dialog({  
            autoOpen: false, width: 400, height: 330, modal: true, title:'XSD Editor'  
        });  
    });  

    function ShowDialog() {  
        debugger;  
        $("#addXSElement").dialog("open");  
    }  
</script>

I use JQuery v 1.6.2 and Jquery Ui 1.8.12

2条回答
够拽才男人
2楼-- · 2019-02-20 09:51

Found the problem, it seems that the JQuery function that was in the document ready didn't work as it should. After reordering the dialogs java script, the problem disappeared.

查看更多
神经病院院长
3楼-- · 2019-02-20 10:08

According to the fiddle I have created, it will show up with no problem.

查看更多
登录 后发表回答