Question

I have a little problem with javascript form submit issue, here is the script

function search(val1, val2)
{
    var f=document.search_form;
    $("#val1").val(val1);
    $("#val2").val(val2);
    f.submit();
}

and here is the form

<form name="search_form" action="val/search/" method="get">
    <input type="hidden" id="search_val1" name="search[val1]" value="">
    <input type="hidden" id="search_val2" name="search[val2]" value="">
......
    <input name="" type="button" value="Click" onclick="search({$smarty.const.VAL1}, {$smarty.const.VAL2});">
</form>

What I know after posting the form is “The form is submitted”, I don’t know what else is being used and processed after the button click. Could someone tell me something more about this ?

Answer 1

Use jQuery to bind the whole form submit event instead of onclick, that way you don’t have to worry about users pressing enter on text field and submitting your form

function search(val1, val2)
{
    var f=document.search_form;
    $("#val1").val(val1);
    $("#val2").val(val2);
    f.submit();
}

$('form[name=search_form]').submit(function(e) {
   search("{$smarty.const.VAL1}", "{$smarty.const.VAL2}");
});

After the above is run, the browser will invoke a normal submit to val/search/ since you don’t tell it to stop the default event (via e.preventDefault())