ajax.beginform - POST an Ajax form from a Kendo UI window -

to edit record, i'm opening modal kendo ui window populated partial view containing ajax enabled form:

@model mvc_acme_hardware.models.basemodel  <script type="text/javascript">     $(function () {         $("form").kendovalidator();     }); </script>  @using (ajax.beginform("editproduct", new ajaxoptions { updatetargetid = "productdiv", onsuccess = "somemethod" })) {     @html.validationsummary(true)      <fieldset>         <legend>employeefte</legend>          @html.hiddenfor(model => model.products.product_id)          <div class="editor-label">             @html.labelfor(model => model.products.product_name)         </div>         <div class="editor-field">             @html.editorfor(model => model.products.product_name)             @html.validationmessagefor(model => model.products.product_name)         </div>          <input type="submit" value="save" class="mybutton" />     </fieldset> } 

when run form , click 'save' on popup, form posts post not done via ajax , 'somemethod' onsuccess method not being called. i've tried adding...

<script src="@url.content("~/scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script> 

...on partial view did not help. how can form submit using ajax? i'm missing obvious. thanks!

try (attention input type):

<input type="button" value="save" class="mybutton" id="btnsave" /> 

and in $(document).ready() :

var validator = $(document.forms[0]).kendovalidator().data("kendovalidator");     $("#btnsave").click(function(e) {                    if (validator.validate()) {                     var formcontent = $(document.forms[0]).serialize();                     var url = $(document.forms[0]).action;                     $.post(url, formcontent).done(function(data) {                           $(document.body).append("<div class='savedrecordmessage'>success</div>");                     });                }         });