Form submission with jQuery not working

Question

I'm having trouble getting my form submission working. I'm using a preventDefault in order to dynamically change the action attribute of the form, but when I click the button it does not do anything at all, and I'm running out of ideas why this might be. can anyone please have a look and point me to where I went wrong ?

Here's the code:

JS:

           $j('select[id=subtype]').live('change',function(){                 
           var stype = $j(this).val();  
    var styp_pos = $j.inArray(stype, styp_id_arr);
    var styp_url = styp_url_arr[styp_pos];
    $j('input[id=styp_url]').val(styp_url);
       });


            $j('button[id=frm_submit]').click(function(event){
    event.preventDefault();
    var full_url  = typ_url + '-' + styp_url + '.html';
    alert(full_url);
    $j('form[id=type_sel_form]').attr("action", full_url);
    $j('form[id=type_sel_form]').submit();

});

HTML:

<form id="type_sel_form" name="type_sel" class="stsel_form" action="subtype.php" method="post">
...
<button id="frm_submit" type="submit" class="st_button">View</button>
</form>

EDIT: After having corrected a typo in the first version, and when running the code through Firebug, I get an error message saying that typ_url is not defined. I have defined it during an action (first part of the JS code) which is executed before the submit. Can that be the reason that nothing happens when clicking the button ?

Thanks very much in advance

Dmitry Samuylov · Accepted Answer · 2011-09-14 15:05:22Z

2

I'm assuming you've aliased $ to $j. Remove the . after $j in these two lines

$j('#type_sel_form').attr("action", full_url);
$j('#type_sel_form').submit();

Also just providing the id with $('#id') is enough.

Complete example:

$j('#frm_submit').click(function(event){
    event.preventDefault();
    var full_url  = typ_url + '-' + styp_url + '.html';
    alert(full_url);
    $j('#type_sel_form').attr("action", full_url);
    $j('#type_sel_form').submit();
});

edited Sep 14, 2011 at 15:05

Dmitry Samuylov

1,5622 gold badges14 silver badges38 bronze badges

answered Sep 14, 2011 at 13:37

Sahil Muthoo

12.6k2 gold badges32 silver badges39 bronze badges

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

3 Comments

Argoron Over a year ago

Thanks for spotting the typo. I've corrected it and edited the question accordingly.

Sahil Muthoo Over a year ago

variables defined inside the first function will not be visible in the second. Share an example of what you're trying to do on jsfiddle.net. Otherwise you can just make the variables global by moving them above the first function. But this might be a code smell.

Argoron Over a year ago

I found the solution by looking through other posts with variable definition issues: I declared the variable outside the "document ready" as " = null", then declared it again as above, and now it works. Thanks for putting me on the right track !

jeffreydev · Accepted Answer · 2011-09-14 13:37:05Z

0

Change:

$j.('form[id=type_sel_form]').attr("action", full_url);
$j.('form[id=type_sel_form]').submit();

Into:

$j('form[id=type_sel_form]').attr("action", full_url);
$j('form[id=type_sel_form]').submit();

There are extra dots.

answered Sep 14, 2011 at 13:37

jeffreydev

1,7221 gold badge13 silver badges31 bronze badges

Collectives™ on Stack Overflow

Form submission with jQuery not working

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related