How to submit a form on a link click using jquery?

admin

Administrator
Staff member
I'm working on a web search form which will return images and web results when they click on the link on top of the form.

So I tried to trigger the form on a link click. Example: If they click image then am trying to submit the form with the image as an option. On the link click I am able to create the hidden input, but the submit itself is not triggered.

Without hidden input I also tried the
Code:
jQuery("#web_form").submit();
which is not trigerring.

<strong>HTML &amp; FORM</strong>

Code:
&lt;span class="web"&gt;&lt;a href="#"&gt;Web&lt;/a&gt;&lt;/span&gt;&lt;span class="image"&gt;&lt;a href="#"&gt;Image&lt;/a&gt;&lt;/span&gt;

&lt;form method="post" id="web_form" action="&lt;?php echo $_SERVER['PHP_SELF'];?&gt;"&gt;  

&lt;input type="submit" value="Search" name="submit"/&gt;
 &lt;?php            
            if (isset($_POST['submit'])) 
            {
                $option = $_POST['searchoption'];
                //perfoming statement based on option
            }
               ?&gt;
    &lt;/form&gt;

jQuery

Code:
jQuery(document).ready(function(){

jQuery('.web').click(function () {
  var option  = jQuery("&lt;input type='hidden' name='searchoption'/&gt;");
  option.val(jQuery(this).attr("class"));
  jQuery("#web_form").append(option).submit();  
  return false;
});
});

What is wrong in here?

NOTE: Am trying this in wordpress does that make any sense?

<strong>EDIT</strong> after question posted

Code:
   jQuery(document).ready(function(){    
    jQuery('.web').click(function () {
      var option  = jQuery("&lt;input type='hidden' name='searchoption'/&gt;");
      option.val(jQuery(this).attr("class"));
      jQuery("#web_form").append(option).submit();  
      return false;
    });
     $( "#web_form" ).submit(function( event ) {
          alert( "Handler for .submit() called." );
     });
    });

I tried the above to make sure whether the form is submitted or not, when i click the link i'm getting the
Code:
Handler for .submit() called.
alert message. It seems to work the submit event but it is not submitting to external url in
Code:
action
field as well
Code:
&lt;?php echo $_SERVER['PHP_SELF'];?&gt;
in action.

What is going on here? Any idea would be helpful.