Chrome 37 Has Stopped Showmodaldialog Support.what Is Use Instead Of That?

My web application is crashed after launched of Chromenew version(37 and above),since chrome has stopped the support of showmodaldialog.However i need to implement same functional

Solution 1:

Chrome started to support <dialog> element. Check this out. http://demo.agektmr.com/dialog/

Polyfill is available as well. https://github.com/GoogleChrome/dialog-polyfill

Solution 2:

After doing lots of googling , i have find out the solution of that issue.I am using Jquery dialog present in jquery-1.9.1 version.The implementation of given below:

Add jquery library on head tag of the parent page

<linktype="text/css"rel="stylesheet"href="https://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css" /><scripttype="text/javascript"src="https://code.jquery.com/jquery-1.9.1.js"></script><scripttype="text/javascript"src="https://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>

Write the popup opening function,where i am creating a div and inside the div take iframe like this

<scripttype="text/javascript"language="javascript">functionOpen() {

        var href = "../../PopUps/FindEmployee.aspx?Page=EC";
        var obj = $('<div id="divClose"></div>');

        obj.html('<iframe id="popUpFrame" style="border: 0px; " src="' + href + '" width="100%" height="99%"></iframe>');
        obj.dialog({
            autoOpen: false,
            resizable: false,
            height: 500,
            width: 650,
            modal: true,
            title: "Find Employee",
            dialogClass: 'infoDialogHeader infoDialogTitle'
        });
        obj.dialog('open');
        returnfalse;
    }
 functioncloseIframe() {
        $('#divClose').dialog('destroy');
    }


</script>

Now I am working on child page which is FindEmployee.aspx like ths:

<scripttype="text/javascript"language="javascript">

    $(document).ready(function () {

        $("[id^=BtnReturnParentPage]").click(function (e) {
            var movedElement;

            if ($("#hdnInformationType").val() == "EC") { // condition for Employee Code                   
                movedElement = window.parent.$("[id*='txtECode']");
                // cleaning textbox
                movedElement.val('');
                movedElement.val($(this).parent().parent().find("[id^=gvEmployeeDetails_gvlblEmployeeCode]").text()); // assing relating information
            }

   window.parent.closeIframe();

        });

</script>

In above child page code , i have take value of $("[id*='txtECode']")textbox which is exist on parent page , and assign child page employee code value to parent page textbox.

So we need to create an element of textbox with name of txtECode on parent page so that assign the value of child page.

Hope it helps all the people who is struggling with window.showmodeldialog

Solution 3:

A simpler solution is this: instead of window.showmodaldialog, you can use window.open next to window.opener.client_function.

In this article by Peter A. Bromberg, it is very well explained: ASP.NET Popup Windows With Return Values Redux

"Less code, same operation"