JqueryUI Dialog. Unable to trigger from html form

Question

Works fine with a text link to fire dialog - but lasts for about .5 second if triggered from an html form submit button. Sounds crazy! Yep, just cannot get it to work. Help!

  $(document).ready(function() {
    $('#rating-0').click(function() { $('#dialog').dialog('open'); }); $('#dialog').dialog({ autoOpen: false, height: 280, modal: true, resizable: false, buttons: { Continue: function() {
      $(this).dialog('close'); // Submit Rating 
    }, 'Change Rating': function() {
      $(this).dialog('close'); // Update Rating
    } }
    });
  });

<form action="https://www.etc" id="rating-0"> 
  <input type="hidden" name="cmd" value="_s-xclick" />
  <input name="submit" type="image" src="https://www.paypal.com/en_GB/i/btn/btn_cart_LG.gif" /> 
</form> 
<div id="dialog" title="Are you sure?"> 
  <p>You've assigned the current celebrity a rating of 0…</p> <p>Perhaps you are just judging them on the terrible last movie…</p>
</div>

Could you please post some markup? It makes it hard to help if we can't see what you've done. — Brandon
– Brandon, Commented Oct 25, 2010 at 18:03
$(document).ready(function(){ $('#rating-0').click(function() { $('#dialog').dialog('open'); }); $('#dialog').dialog({ autoOpen: false, height: 280, modal: true, resizable: false, buttons: { Continue: function() { $(this).dialog('close'); // Submit Rating }, 'Change Rating': function() { $(this).dialog('close'); // Update Rating } } }); }); — Rosy
– Rosy, Commented Oct 25, 2010 at 18:17
<form action="etc" id="rating-0"> <input type="hidden" name="cmd" value="_s-xclick" /> <input name="submit" type="image" src="paypal.com/en_GB/i/btn/btn_cart_LG.gif" /> </form> <div id="dialog" title="Are you sure?"> <p>You've assigned the current celebrity a rating of 0…</p> <p>Perhaps you are just judging them on the terrible last movie…</p> </div> — Rosy
– Rosy, Commented Oct 25, 2010 at 18:20

SLaks · Accepted Answer · 2010-10-25 20:51:53Z

1

Add return false; to your submit or click handler to prevent the browser from submitting the form and reloading the page.

EDIT:

  $(document).ready(function() {
    $('#rating-0').submit(function() { 
         $('#dialog').dialog('open'); 
         return false;
     }); 
     ...
  });

edited Oct 25, 2010 at 20:51

answered Oct 25, 2010 at 18:06

SLaks

891k182 gold badges1.9k silver badges2k bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Rosy Over a year ago

Thanks Slaks. I need a bit more help please! I am not too ofay with jquery .. where exactly should i insert 'return false' .. see scripts above. Thanks

SLaks Over a year ago

@Rosy: You should accept this answer by clicking the hollow check.

Fareed Alnamrouti Over a year ago

i think also he didn't use the submit event as you mention he used the click event for the form witch is wrong

Collectives™ on Stack Overflow

JqueryUI Dialog. Unable to trigger from html form

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related