Get Value from iframe form to Parent Form

[juned_seskoad]

I have 2 form, Form A as Parent and Form B as iframe form.
Form A, have 1 field entry (id:receiveentry) and 1 button (class:btnopen) to open dialog iframe form. in Form B have 1 field entry (id:entryfield)

scenario is from parent page (form A) i will click on button to open form B as dialogbox, then entry value on entryfield and after close a dialogbox that value from entryfield inform B will come to receiveentry on form A (parent)

this code that i have on form A (parent)

$(document).ready(function () {
// bind click events to launch dialog windows from button
$(".btnopen").click(function(){showDialog(this); return false;});


// define the dialog box
$("#dialogPanelId").dialog({
autoOpen: false,
modal: true,
height: 600,
width: 600,
// zIndex: 100000,
autoOpen: false,
buttons: {
'OK' : function() {
$(this).dialog('close');
}
}
});
});

function showDialog(panel){
$("#dialogPanelId").html('<iframe>').dialog("open") ;

$("#modalIframeId").attr("src","/ufs/ufsmain?formid=FORMB&P1=");

}

======================

Hope someone will help me, many thanks for you all

Regards

Juned

[Jon]

Juned,

This sounds the same as your previous post. Couldn't you get that to work?

Regards
Jon

[juned_seskoad]

Hello Jon,

Sorry Jon, I'm new on javascript /ebase and it not familiar with me,
Would you help me one more time, from this sample case what code should be, cause i have try your code and not working, maybe my fouls

hope you kindly help me

Regards

Juned

[Jon]

I'm not that surprised that it doesn't work straight away, but I still think it's the right approach. It can be quite difficult to get client-side Javascript with jQuery working, especially the first time that you do it. The usual symptom is that nothing happens, with no indication of what has gone wrong: unfortunately, this is the nature of Javascript in the browser. You need to try and debug it. Here are some debugging techniques - you need a browser with a debugger, I use Firefox/Firebug but you can use any browser that you are comfortable with:

Simple debugging:
1. Check for Javascript errors using the debug console - Javascript fails silently in the browser so the only symptom is that things stop working
2. If you are calling the server, check the execution log that this has occurred - all calls from the client are logged
3. Put some alerts in your Javascript so you can see how far you're getting

Advanced debugging:
4. Set breakpoints in your Javascript code - check it's working as you expect. In particular check that any passed values are correct. If you're using jQuery to find fields and extract and set values, make sure the field is being found correctly. jQuery will not issue any errors - it will just not do anything. You can use the debugger to evaluate a Javascript statement and check it works as you expect.

If you still can't get it working, post all the details here, and maybe someone will be able to spot what's wrong.

Regards
Jon

[Dave]

Hi Juned,

Three things:

1. You need to give your iFrame an ID when you open it, e.g.

Code: Select all

$&#40;"#dialogPanelId"&#41;.html&#40;'<iframe> id="modalIframeId"'&#41;.dialog&#40;"open"&#41; ;

that way the next line:

Code: Select all

$("#modalIframeId").attr("src","/ufs/ufsmain?formid=FORMB&P1=");

will be able to find it.

2. Make sure you have both jQuery and JQueryUI in your list of web resources, e.g. from CDN

Code: Select all

http://code.jquery.com/jquery-latest.min.js
http://code.jquery.com/ui/1.10.2/jquery-ui.js

3. Make sure you have your client script in the web resources list too.

Do these and your form will work fine.

Cheers,
Dave

[juned_seskoad]

Hai Dave,

Thanks for your reply, but I have no problem to open form on iframe/dialog box.

My problem is to get a value entry on iframe form to a parent form. Can you give me a sample code to resolve my sample case before?

hope you can help me and many thanks for response

Regards

Juned

[juned_seskoad]

I have find the answer

x = window.frames["iframe_name"].document.getElementById('inputid_on_iframe_form').value

document.getElementById("inputid_on_parent_form").value = x;

hope this answer useful for new user like me

regards

Juned

[Dave]

Hi Juned,

A few thoughts:

You may find it easier to use jQuery syntax rather than native JavaScript, especially as you have the jQuery library linked in for the Dialog stuff anyway, e.g.

Code: Select all

$('inputid_on_parent_form').val($('inputid_on_iframe_form').val());

etc.

Also, you may wish to trigger processing to happen when your Dialog window is closed by the user. You can pick this up using, e.g.

Code: Select all

$('#dialogPanelId').bind('dialogclose', function(event) {your code});

Last thing, the mechanism that Jon was referring to in earlier post is also worth thinking about, i.e. where you call a Javascript function defined on the parent window, which calls Xi server-side processing via the client API. Particularly useful, for example, if you bind the function to the dialogclose event (see above) - this can give you a lot of control over any processing that you want to do.

Dave

[juned_seskoad]

Thanks Dave

it very useful for mu, and many thanks for Jon also

Regards

Juned