troubleshooting Question

binding event to form in window.open

Avatar of mmoore
mmooreFlag for United States of America asked on
JavaScript
9 Comments2 Solutions415 ViewsLast Modified:
I am trying to open a pop-up window which has a form. Eventually the user will close the window, but before that I want to send a form value back to the parent window using localStorage. If I use dev-tools to execute my javascript commands I am successful. So I don't think it's a problem  there. I suspect the problem is I am not able to bind the localStorage.setItem to the form on the pop-up.
Here are the relevant bits of code from the parent window.
        // onload
        j$(document).ready(function() {
            // disable ajax request caching for security best practice
            j$.ajaxSetup({ cache: false });

            // open modal and query available record types when page loads
            openModal();
            
            //
            j$(".modalSubmit").click(function(event) {
                validateRecordTypeSelected();
            });

           window.addEventListener('storage',function(event) {
               console.log(event);
           });

        });

and
        function openModal2() {
           console.log('running openModal2');
           var popup = window.open("/apex/wrapwiz", "myWindow", "width=600, height=400, toolbar=no, menubar=no");
           j$('popup, #j_id0\\:j_id1\\:i\\:f').bind('submit', function( event ) {
              alert( "Handler for .submit() called." );
             localStorage.setItem(document.getElementById('j_id0:j_id1:i:f:pb:d:Company.input').value);
                                                          
              });
         }

openModal2 is being called by a button on the screen and I know that works because the pop-up opens when the button is clicked.

Here are what I believe are the relevant parts of the pop-up window
<form id="j_id0:j_id1:i:f" name="j_id0:j_id1:i:f" method="post" action="https://c.cs14.visual.force.com/apex/wrapwiz" enctype="application/x-www-form-urlencoded" onkeypress="return FlowLoadingScreen.noenter(event);" onsubmit="FlowLoadingScreen.showLoadingScreen(this)">

and

<td class="labelCol requiredInput"><label class="FlowText" for="j_id0:j_id1:i:f:pb:d:Company.input" id="j_id0:j_id1:i:f:pb:d:Company.prompt"><span class="assistiveText">*</span>Account Name</label></td><td class="dataCol col02"><div class="requiredInput"><div class="requiredBlock"></div>

<input  id="j_id0:j_id1:i:f:pb:d:Company.input" maxlength="255" name="j_id0:j_id1:i:f:pb:d:element___input____Company" size="20" type="text" value="" /></div></td><td class="labelCol last empty">&nbsp;</td><td class="dataCol last empty">&nbsp;</td></tr>

If there is a better way to accomplish my objective, I'm open to scrapping this.

Thanks,
Mike
ASKER CERTIFIED SOLUTION
Join our community to see this answer!
Unlock 2 Answers and 9 Comments.
Start Free Trial
Learn from the best

Network and collaborate with thousands of CTOs, CISOs, and IT Pros rooting for you and your success.

Andrew Hancock - VMware vExpert
See if this solution works for you by signing up for a 7 day free trial.
Unlock 2 Answers and 9 Comments.
Try for 7 days

”The time we save is the biggest benefit of E-E to our team. What could take multiple guys 2 hours or more each to find is accessed in around 15 minutes on Experts Exchange.

-Mike Kapnisakis, Warner Bros