Solved

Override form target with jquery etc

Posted on 2013-01-13
14
537 Views
Last Modified: 2013-01-23
Hi, am using a wordpress plugin User Meta Pro to show a login and register form - in a Fancybox iframe. So the problem is when the user clicks submit in either form it opens up the target url in the iframe...is it possible to override the default target for the form and set it to parent?

Below is code I have tried - this method worked in the past when I knew the form had no target defined by default. This time I am dealing with a plugin - the coders are not getting back to me on this - and I cannot find where the form code is generated so want to just override the target part - is it possible somehow? Is there a way to intercept the default action before it executes (I presume the problem)? Thanks.

$("#insert_user").click(function(){        // The button to submit form
$(".um_user_form").attr('target', '_parent');     // The form attribute
});
0
Comment
Question by:alexmaestro100
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 8
  • 6
14 Comments
 
LVL 82

Expert Comment

by:leakim971
ID: 38776481
no need to wait for the click, put the target on DOM ready :

$(document).ready(function() {
       var form = $(".um_user_form");
       if(form.length==0) alert("FORM NOT FOUND!!!"); // REMOVE THIS IF IT WORK
       form.attr('target', '_parent'); // THAT WORK ONLY IF PARENT AND CHILDREN ARE IN THE SAME DOMAIN
});

Open in new window


if that don't work please provide a link to your wordpress site : http://goo.gl
0
 

Author Comment

by:alexmaestro100
ID: 38777452
Sorry that's basically what I've already tried. I am working locally so cannot give website link, thanks anyway.
0
 
LVL 82

Expert Comment

by:leakim971
ID: 38777880
A local wordpress site? OK....
I added an alert what it say?
0
Why You Need a DevOps Toolchain

IT needs to deliver services with more agility and velocity. IT must roll out application features and innovations faster to keep up with customer demands, which is where a DevOps toolchain steps in. View the infographic to see why you need a DevOps toolchain.

 

Author Comment

by:alexmaestro100
ID: 38778388
Your alert comes up - and also I noticed the form target is loaded as parent in the browser with the rest of your code. But it does not target parent when submitting form.

In the form code there is this line: onsubmit="umInsertUser(this); return false;

which I presume may be the problem, but don't know how to override it's target value! Thanks for suggestions.
0
 
LVL 82

Expert Comment

by:leakim971
ID: 38778433
if the alert comes up that mean you did not have the form when the script run...
0
 

Author Comment

by:alexmaestro100
ID: 38778499
OK how can I fix this? Thanks.
0
 
LVL 82

Expert Comment

by:leakim971
ID: 38778516
please confirm :
- you put the code to the page in the iframe not in the parent
- both page are on the same domain
0
 

Author Comment

by:alexmaestro100
ID: 38779145
Both yes - and I can see the code for the form target is affected, it just doesn't work when submitted. The alert does not come up (unless I take the 'if' out).

I am trying a workaround by putting "parent.$.fancybox.close()" on the submit button and redirecting manually - this works but ruins the form validation - is there a way with jquery to only do the code if the form is sent (filled out correctly)? All the validation is in place, just needs something on the button code.

I would obviously prefer your solution! Thanks.
0
 
LVL 82

Expert Comment

by:leakim971
ID: 38779222
In the form code there is this line: onsubmit="umInsertUser(this); return false;

try this :
$(document).ready(function() {

$("form:eq(0)").removeAttr("onsubmit").submit(function(evt) {
alert("test ok");
      evt.preventDefault();
      $(".um_user_form").attr('target', '_parent');;
      umInsertUser(this);
});

})

Open in new window

0
 

Author Comment

by:alexmaestro100
ID: 38779256
The alert came up OK but still no target parent!!!! Thanks for the effort!
0
 
LVL 82

Expert Comment

by:leakim971
ID: 38779299
ok, so I can help you more without seeing your page, so if you're gonna to put this wordpress site online, let me know or just wait help of someone else.
0
 

Author Comment

by:alexmaestro100
ID: 38779309
Thanks anyway.
0
 

Accepted Solution

by:
alexmaestro100 earned 0 total points
ID: 38794295
It's me again! I just loaded the content into fancybox with a div, no need for iframe! Thanks for help anyway.
0
 

Author Closing Comment

by:alexmaestro100
ID: 38809149
I solved it myself.
0

Featured Post

Salesforce Has Never Been Easier

Improve and reinforce salesforce training & adoption using WalkMe's digital adoption platform. Start saving on costly employee training by creating fast intuitive Walk-Thrus for Salesforce. Claim your Free Account Now

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction Chart.js, used properly, can visually add a difference to your charting applications. It engages your visitors and allows them to interact with data they otherwise wouldn't be able to without expensive and complicated systems. For this…
I annotated my article on ransomware somewhat extensively, but I keep adding new references and wanted to put a link to the reference library.  Despite all the reference tools I have on hand, it was not easy to find a way to do this easily. I finall…
This video teaches users how to migrate an existing Wordpress website to a new domain.
The is a quite short video tutorial. In this video, I'm going to show you how to create self-host WordPress blog with free hosting service.

734 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question