Passing jQgrid rowid from an iFrame to the dialog box of the main .html

Question

i need some help here. I have a dialog box that contains an iFrame with my html file of a jqgrid. What i want to do is that when I double click a data from the jqrid inside that dialog box, the dialog box will automatically close and will post the id of the row that was click in the first dialog box.

Here's my javascript code:

EDIT:(Note: this code is from subAccount.js)

$( "#mainGrid" ).click(function() { //note: mainGrid is inside of another dialog box where i should post the row id
   $( "#dialogMainAccount" ).dialog( "open" );  //this is the dialog box that contains my .html with jqgrid in it.
   $( "#dialogMainAccount" ).append(
      '<p>Please choose code to add in Sub Account Group.</p>'+
      '<iframe src="mainAccountGroup.html" width="100%" height="800">' +  // i use an iFrame to open my .html file
        '<p>Your browser does not support iframes.</p>' +
      '</iframe>');     
});

Edit: This is my code for closing the dialog box inside the mainAccountGroup.js

$("#tblData1").jqGrid({
    .//some code here
    .
    .
    caption: "Main Account Group",
    ondblClickRow: function(rowid) {
       parent.$("#dialogMainAccount" ).dialog("close");
    ....
});

I already include the mainAccountGroup.js inside my subAccount.html. NOTE, first question solve in how to close the dialog box after double clicking a row in jqgrid.

Another question is, how to pass the rowid that was click from that jqgrid in the iFrame, to the text box of the first dialog box? Passing values from a .html in a iframe to a dialog box in the main html.

this article will helps you : http://stackoverflow.com/questions/3283539/jqgrid-cell-editing-double-click-to-edit — xkeshav, May 23 '11 at 08:05
Hey, thanks. But it didn't work. Maybe because my jqgrid is from the other .html file. — jayAnn, May 23 '11 at 08:14
see the link i paste in my answer, you need to apply your own logic with help of both links :) — xkeshav, May 23 '11 at 08:16

Oleg · Answer 1 · 2011-05-24T08:05:42.460

1

If I understand you correct you can just call $("#dialogMainAccount").dialog("close") or $("#dialogMainAccount").dialog("destroy") inside of your ondblClickRow event handler of the jqGrid to close the dialog.

UPDATE: if you from the code running in the iframe want access variable myVar define as global (on the top level) you should use inside of iframe the parent.document prefix: parent.document.myVar.

If you need access HTML elements defined in the main frain from the iframe you should use parent.document as the context parameter of the jQuery. For example $('#mainAccount',parent.document).

edited May 24 '11 at 08:05

answered May 23 '11 at 10:32

Oleg

220,925
34
403
798

I already tried the close yesterday but it didn't work. I tried the destroy just now, just after i read your answer, but still don't work. Could it be because my dialogMainAccount is from another .html file, not inside the mainAccountGroup.html? – jayAnn May 24 '11 at 01:57
problem solved. I just have to add parent or just type like this 'parent.$("#dialogMainAccount" ).dialog("close");'. And in posting the rowid, i just to add this code 'parent.$('#mainAccount').val(rowid);' – jayAnn May 24 '11 at 06:21
1

@jayAnn: It seems you should just use `parent.document` as the context (second parameter) of the `jQuery`. If you for example define the global variable `myVar` in main frame you can access it from the iframe as `parent.document.myVar`. If you use jQuery you should use `$('#mainAccount',parent.document)` instead of `parent.$('#mainAccount')`. In the way you cen read or write any data in the main (parent) control. – Oleg May 24 '11 at 07:53

score 0 · Accepted Answer · answered May 24 '11 at 06:29

answer of my very first question on how to close the dialog box ondblclick event in jqgrid:

$("#tblData1").jqGrid({
    .//some code here
    .
    .
    caption: "Main Account Group",
    ondblClickRow: function(rowid) {
       parent.$("#dialogMainAccount" ).dialog("close"); //use parent since the dialog box is from the parent html
    ....
});

answer for my second question on how to pass value from an iFrame to the parent html:

parent.$('#mainAccount').val(rowid);   // the $('#mainAccount') in from the parent html.

hope this could help somebody

score 0 · Answer 3 · edited Dec 20 '11 at 19:33

0

$('jqgridId').parents('#dialogId').remove();

$('jqgridId').parents('#dialogId').dialogr('close');

edited Dec 20 '11 at 19:33

cdeszaq

30,869
25
117
173

answered Sep 01 '11 at 11:29

Chinthaka Rupasinghe

56
4

Passing jQgrid rowid from an iFrame to the dialog box of the main .html

3 Answers3