使用jquery无法正常工作的表单提交

Question

In form submission i am giving action using jquery

Here is my HTML code

<form name="frmSearchTops" id="frmSearchTops" method="post" onsubmit="searchitem();">
        <select  name="cboCityNameRes" id="cboCityNameRes">
          <option value=''>City</option>
             {foreach from= $arritemCities item=foo}                      
               {if $smarty.post.hdnCityName eq $foo}                                
                  <option value="{$foo}" selected="selected">{$foo}</option>          
               {else}    
                <option value="{$foo}" {if $foo eq 'City'} selected="selected"{/if}>
                     {$foo}
                </option>
               {/if}    
             {/foreach}    
        </select>
    <select name="cboMaterial" id="cboMaterial">
      <option value="">Material</option>
      <option value="CT">Cotton</option>
      <option value="SL">Silk</option>
    </select>
     <input name="btnSearch" type="button" value="Search" id="btnSearch"/>       
 </form> 

Jquery Code

<script type="text/javascript">
 function searchitem()
 {
    var strCity = $('#cboCityNameRes').val();
    $("#frmSearchTops").attr("action", "/womens-tops-" + strCity + ".php");
    $("#frmSearchTops").submit();
 }
 </script>

Here i am giving action to a dummy link womens-tops-chennai.php. In controller it will redirect to actual page.But for me its not working.Can i submit like this

Answer 1

You are trying to submit form using button type which cannot submit the form, so instead call the function with the onclick event and your script has code to submit the form

<input name="btnSearch" type="button" value="Search" id="btnSearch" onclick='searchitem();'/>

working demo