.NET same parent container and the sub-page communication scheme container

Main interface:

The key main page Code:

    <div id="EditDiv">
        <iframe src="javascript:void(0)" id="editFrame" width="100%" height="100%" frameborder="0"></iframe>
    </div>

--------------- The following js script (key codes) -----------
        // Bind modify hyperlinks
        function bindEditLinkClickEvent() {
            $(".editLink").click(function () {
                var newsId = $(this).attr("newsId");                
                // getNews2EditForm (newsId); // data from the background and loading the data into the text box up modifications
                // before the dialog box, the tag iframe src attribute is set to modify the page address
                . $ ( "# editFrame") attr ( "src", "? EditNews.aspx the above mentioned id =" + newsid); 
                showEditDialog (); // pop edit div
            });
        };

        // pop edit div
        function showEditDialog() {
            $("#EditDiv").css("display", "block");
            $("#EditDiv").dialog({
                title: "Modify dialog"
                width: 500,
                height: 500,
                modal: true,
                collapsible: true,
                minimizable: true,
                maximizable: true,
                resizable: true,
                buttons: [{
                    text: "Edit"
                    iconCls: "icon-add",
                    handler: submitChildEditFrm
                }, {
                    text: "closed"
                    iconCls: "icon-cancel",
                    handler: function () {
                        $("#EditDiv").dialog("close");
                    }
                }]
            });
        }

        // asynchronous sub-page form is submitted
        function submitChildEditFrm() {
            // get the first child container objects windows and call the child container js function
            var domFrame = $("#editFrame")[0];
            domFrame.contentWindow.submitFrm();
        };

 Child container Code:

    <form id="form1" runat="server">
    <div>
        <input type="hidden" name="id" value="<%=News.id %>" id="id" />
        <table>
            <tr>
                <td>新闻标题</td>
                <td><input type="text" name="title" id="txtTitle" value="<%=News.title %>" /></td>                    
            </tr>
            <tr>
                <td>新闻内容</td>
                <td><input type="text" name="contents" id="txtContent" value="<%=News.contents %>" /></td>
            </tr>
        </table>
    </div>
    </form>

The following JS script // ----- -------
    < Script src = "../ Script / jQuery-3.4.1.js" > </ Script > 
    < Script of the type = "text / JavaScript" > 
        function submitFrm () {
             // let the whole asynchronous form submission background. 
            var postData = $ ( " # Form1 " ) .serializeArray ();
            $.ajax({
                url: "EditNews.aspx",
                type: "post",
                dataType: "json",
                data: postData,
                success: function (data) {
                    if (data.success == "ok") {
                        Alert ( " modified successfully! " );
                         // close the dialog box's parent container, refresh the parent container table 
                        window.parent.window.afterEditSuccess ();
                    } else {
                        Alert ( " modification failed! " )
                    }
                },
                error: function (err)
                {
                    alert(err);
                }
            });
        }
    </script>

Get ~~

Guess you like

Origin www.cnblogs.com/chenyanbin/p/11166294.html