PLEASE NOTE: These forums are no longer utilized and are provided as an archive for informational purposes only. All support issues will be handled via email using our support ticket system. For more detailed information on this change, please see this blog post.

Cannot Change Form Target Attribute

Gravity Support Forums » Plugin Support » Gravity Forms

  1. BillFishkin
    Member

    I am trying to open a form in a modal. Yes, I have read this post:
    http://www.gravityhelp.com/creating-a-modal-form-with-gravity-forms-and-fancybox/

    It does not help with my particular scenario though.

    When a page with a form is opened in an iFrame, and you submit it, your results appear in the iFrame. There is no way to edit the forms 'target' attribute, which IMHO should be a basic feature.

    My workaround was to hack gravity forms for the time being, as I have no other option. Please add the capability to change a gravity form's target attribute. It is a basic necessity. Thank you.

    Posted 14 years ago on Wednesday May 26, 2010 | Permalink

  2. Kevin Flahaut
    Administrator

    There's no need to hack the core files. You can easily set the target attribute with some simple jQuery added to your page template. 

    <script type="text/javascript">
	jQuery(document).ready(function() {
 		jQuery("#gform_XX").attr("target", "_blank");
	});
 </script>
    Copy

    where "gform_XX" is the actual ID of your form.

    This isn't a flaw, nor do I personally agree that it's a basic necessity. The target attribute has been deprecated for the form tag, so I'm not sure if we'll add this as an admin option or not in the future (though your can still do this via a hook). We'll definitely consider it though.

    Posted 14 years ago on Wednesday May 26, 2010 | Permalink

  3. Samantha
    Member

    @Kevin

    I'm using a form in a modal via a text widget showing an ad image..works great.

    I would like to use the ad image in a billboard plugin from iThemes. There is a field to add the url but there is not a way to enter the class. Using your code above in the plainpage.php file:

    <script type="text/javascript">
	jQuery(document).ready(function() {
 		jQuery("#gform_1").attr("class", "iframeFancybox1");
	});
 </script>
    Copy

    Doesn't seem to be working. Any help is appreciated. Thank you.

    Posted 14 years ago on Saturday June 12, 2010 | Permalink

  4. Kevin Flahaut
    Administrator

    Samantha, I'm having a hard time visualizing this.. maybe it's just me today. Can you share a URL to the page you're referring to so I can get a look?

    Posted 14 years ago on Saturday June 12, 2010 | Permalink

  5. Samantha
    Member

    OK. http://tinyurl.com/275pcqn
    It's still under construction but I've disabled the maintenance mode temporarily for you to look at.

    The first 300x250 banner is a text widget -modal works
    The 300x250 below it in blue is the Billboard plugin widget - goes to the actual page, no modal. Don't know how to add the class attribute.

    Hope this helps..

    Posted 14 years ago on Saturday June 12, 2010 | Permalink

  6. Kevin Flahaut
    Administrator

    Okay, guess I didn't get back to this soon enough, I just see the maintenance mode notice but I think I get it better now. It sounds like you want to use jQuery to add the class attribute to the ad image hyperlink and not the form itself.

    I'd have to see how the markup is to tell you for sure, but it would be more like this.. assuming the image was in a div called "billboard_widget"..

    <script type="text/javascript">
	jQuery(document).ready(function() {
 		jQuery("#billboard_widget a").attr("class", "iframeFancybox1");
	});
 </script>
    Copy

    Does that make sense? I hope I understood correctly.

    Posted 14 years ago on Sunday June 13, 2010 | Permalink

  7. Samantha
    Member

    Hi Kevin,
    It didn't work. I put the code in plainpage.php. I sent you login info via support form. Thank you.

    Posted 14 years ago on Sunday June 13, 2010 | Permalink

  8. Kevin Flahaut
    Administrator

    Samantha.

    It should be working now. It's working in my tests.

    Here's what I did. We needed to target the "a" href for the link on that image. The script needed to be in the page with the image/link and not the page with the form.

    So, I went to your header.php file and updated the jQuery snippet at the top to add the new class attribute and also remove the unnecessary target attribute. Now the snippet looks like this..

    <script type="text/javascript">
  $(document).ready(function() {

        $(".ithemes-billboard-1wtrial a").attr("class", "iframeFancybox1");
        $(".ithemes-billboard-1wtrial a").removeAttr("target");

	$("a.iframeFancybox1").fancybox({
		'width'		      :	650,
		'height'		      :	725,
		'overlayOpacity'	 :	'0.4',
		'overlayColor'		 :	'#000',
		'hideOnContentClick' :   false,
		'autoScale'     	 :   false,
   		'transitionIn'		 :   'elastic',
		'transitionOut'	 :   'elastic',
		'type'			 :   'iframe'
	});

  });
</script>
    Copy

    You'll see that this only adds the attribute to the link in the unique class name you defined for the billboard. If you want to use it for other class names, just copy those two lines, change the class name and place those directly below the first ones in the code.

    Hope that helps.

    Posted 14 years ago on Sunday June 13, 2010 | Permalink

  9. Samantha
    Member

    Nice!!! It looks even better on the Billboard widget because there is a title underneath the modal window. Superb support! Thank you!

    Posted 14 years ago on Sunday June 13, 2010 | Permalink

This topic has been resolved and has been closed to new replies.