Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Add onsubmit event to call JS function in MVC3

I have a problem with calling JS method from form in MVC3 project: I have a "search"page without forms with two buttons - Search and Cancel. Click on search runs JS function runSearch in ProductDefinition.

<div id="productSearch-dialog" class="modal fade" style="width: 1000px; display: none">
<div class="modal-header">
    <button class="close" aria-hidden="true" data-dismiss="modal" type="button">×</button>
    <h3>Search Results</h3>
</div>
<div class="modal-body" style="height: 650px;">
    <div>
        <input id="inputname" type="text" /><font class="red-font" id="lblrequired" style="display: none">*</font>
    </div>
    <div id="searchresultcontain" class="grid">
    </div>
    <div id="Pagination" class="pagination">
    </div>
</div>
<div class="modal-footer">
    <button class="btn btn-primary" onclick="productDefinition.runSearch();">Search</button>
    <button class="btn btn-primary" data-dismiss="modal">Cancel</button>
</div>

How can I run this JS method (runSearch) when I press ? As far as I understand, this will be onsubmit event which is form event, so I am need to add form element with onsubmit property. I tried surrounding input field with BeginForm helper method:

@using (Html.BeginForm(new { onsubmit = "productDefinition.runSearch();" }))
{
    <input id="inputname" type="text" /><font class="red-font" id="lblrequired" style="display: none">*</font>
    <input type="submit" value="Submit" style="visibility: hidden" />
}

but it does not seem to be working - when I press enter I for some reason get source of the page and arrive at localhost/?onsubmit=productDefinition.runSearch() URL.
What can be the source of the problem and how can I get the same behaviour for onsubmit as for onclick?

like image 953
Sergei G Avatar asked Feb 13 '13 11:02

Sergei G


1 Answers

 @using (Html.BeginForm(new { onsubmit = "return runSearch();" }))



<script type="text/javascript">
    function runSearch() {
           // your logic to perform the search.
           return true;
    }
</script>
like image 98
Darren Avatar answered Oct 12 '22 23:10

Darren