turash
turash

Reputation: 35

Get Values in Iframe based UI Dialog from parent form having Master Page in ASP.NET using Jquery

I have a Master Page based User entry form in asp.net. When user Clicks on a button it opens Jquery ui dialog popup in iframe . I have to access the values of text boxes of the parent entry form and pre-fill those in the popup.

Button Click on Entry form

 $(function () {
 $("input[id$='btnTccDetails']").click(function (e) {
                e.preventDefault();
                var $this = $(this);
                var horizontalPadding = 30;
                var verticalPadding = 30;
                $('<iframe id="externalSite" class="externalSite" src="' + 'tccDetails.aspx?action=ADD' + '" />').dialog({
                    title: ($this.attr('title')) ? $this.attr('title') : 'TCC Details',
                    autoOpen: true,
                    width: 1200,
                    height: 600,
                    modal: true,
                    resizable: true,
                    autoResize: true,
                    overlay: {
                        opacity: 0.5,
                        background: "black"
                    },
                    open: function (type, data) { $(this).parent().appendTo("form"); }
                }).width(1200 - horizontalPadding).height(600 - verticalPadding);

            }); 


        });   //end of function()

// Popup Javascript

I was able to use the regular javascript . var tag = window.parent.document.forms[0].ctl00_MainContentHolder_txtTag.value;

I need to do this in Jquery. I have tried this

   var tag = window.parent.jQuery('#txtTag').val();

This does not work.

I have tried searching all the related post on here without much luck.

**Solution:

var tag = $("input[id$='txtTag']", window.parent.document).val();**

Upvotes: 1

Views: 2717

Answers (1)

jdavies
jdavies

Reputation: 12894

To achieve this you will need to specify the context of the selector like so:

$('#txtTag', window.parent.document).val();

(From the JQuery documentation)

By default, selectors perform their searches within the DOM starting at the document root. However, an alternate context can be given for the search by using the optional second parameter to the $() function.

Using this second parameter you can pass in the parent document in which JQuery will search for the input element.

Hope this helps.

Upvotes: 1

Related Questions