0

I have tried some method from web about changing the jQuery dialog title but I haven't succeed. Would someone help me how to do it. Thanks in advance

I have many existed popup page that using window.showModalDialog method to open. Now I need to change jQuery dialog box. I wanted to change the dialog box title depend on the popup page title. Now the popup page is in iframe and the iframe is inside the jQuery dialog. I add the function to change the title in popup page.

Here is my aspx page:

<div id="dialog">
   <iframe id="myIframe" src=""></iframe>
 </div>
 <button id="dialogBtn">Open Dialog</button>

The javascript to handle the dialog:

$("#dialog").dialog({
    autoOpen: false,
    modal: true,
    height: 600,
    open: function(ev, ui) {
    $('#myIframe').attr('src','http:Order/orderForm.aspx');
  }
});

$('#dialogBtn').click(function() {
    $('#dialog').dialog('open');
});

There is the function to change the title on popup page onload method:

 function changeDialogTitle() {
        var dialog = $('#dialog', parent.document);
        alert(dialog.length);
         $('#dialog', parent.document).dialog({ title: "New Dialog Title" });
}

I also tried this to reopen the dialog box but failed:

 $('#dialog', parent.document).dialog("option", "title", "New Title").dialog('open');
marc_s
  • 732,580
  • 175
  • 1,330
  • 1,459
user819774
  • 1,456
  • 1
  • 19
  • 48
  • The question actually is. how to pass message to parent from iframe. here is one answer https://stackoverflow.com/questions/8822907/html5-cross-browser-iframe-postmessage-child-to-parent#answer-8849807 `eventer(messageEvent,function(e) { var key = e.message ? "message" : "data"; var data = e[key]; //run function// },false);` you need to (write code) to change title instead of `//return function`. and here is docs https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage – Sami Jun 14 '19 at 13:34

1 Answers1

0

Instead of

$('#dialog', parent.document).dialog({ title: "New Dialog Title" });

you can just run it in the parent, like:

function changeDialogTitle() {
    parent.window.$("#dialog").dialog({title: "New Dialog Title"});
}
gaetanoM
  • 41,594
  • 6
  • 42
  • 61