Access Child iframe elements from parent page with jquery?

Question

How can i access the elements of a child div within a Jquery UI Dialog from a parent page? I Was using the following code.. though accessing the iframe with its id ( #adduserframe ) and then .contents() will do the work.. but it is not working.. my jquery concepts are not good enough. Can anyone suggest what shall bring me my desired results? Can you plz tell why i am being unable to get the elements?

            $(document).ready(function(){
            var first_name = '';
            var middle_name = ''; 
            var last_name = '';
            var paginate_url='';
            $('#first_name,#middle_name,#last_name').bind( "change" ,function(){
                first_name = $.trim($('#first_name').val());
                middle_name = $.trim($('#middle_name').val()); 
                last_name = $.trim($('#last_name').val());
                paginate_url='autosuggestUsers.php?first_name=' + first_name + '&middle_name=' + middle_name + '&last_name=' + last_name;
                if( first_name!='' && middle_name!='' && last_name!='' ){

                    $('<div><iframe id="adduserframe" src="'+ paginate_url + '" height="300" width="478" frameborder="0" scrolling="no"></iframe></div>').dialog({
                        title: '<b>User(s) with a similar name</b>',
                        modal: true,
                        autoOpen: true,
                        height: 'auto',
                        width: 500,
                        resizable: false,
                        buttons: {
                            "Close": function(){                    
                                $(this).dialog('close');
                                return false;
                            }
                        }
                    });

                }else{
                    return false;
                }
            }); 

            $("#adduserframe").contents().find("img.addSweis").live("click",function(){
                alert('hey');
                var u_data = $(this).attr('rel');
                var rawParts = u_data.split("~~^^~~");
                $($("#adduserframe").contents().find("input#relative_id")).val(rawParts[0]);
                $($("#adduserframe").contents().find("input#first_name")).val(rawParts[1]);

                $(".ui-dialog-content").dialog('close');
            });

        });

score 1 · Accepted Answer · edited May 23 '17 at 12:27

1

See : Access child iFrame DOM from parent page

But it will only work if all the scripts and iframe are on the same domain.

edited May 23 '17 at 12:27

Community

1
1

answered Jan 08 '13 at 05:13

keeg

3,990
8
49
97

They are on same domain.. Thank you! – Smoking Sheriff Jan 08 '13 at 05:17
so you can access it using `$("#adduserframe").contents()`, is it returning an object at all? – keeg Jan 08 '13 at 05:19
I don't know. What can i use to see if it is returning one or not? However the simple alert is not working.. so i don't think it is working at all.. – Smoking Sheriff Jan 08 '13 at 05:23
just do `alert('$("#adduserframe").contents()');` if it returns null then I think your iframe doesn't exist in the dom yet and you are trying to access it – keeg Jan 08 '13 at 05:26
is there any HTML that goes with this? – keeg Jan 08 '13 at 05:27
It is a php page and html contents are being generated by using the parameters in the query string. autosuggestUsers.php?first_name=' + first_name + '&middle_name=' + middle_name + '&last_name=' + last_name – Smoking Sheriff Jan 08 '13 at 05:31

Access Child iframe elements from parent page with jquery?

1 Answers1