jquery - MVC AJAX returns only partial view -

trying ajax form update tbody of table browser submits controller returning partial view. think javascript files mentioned in other posts referenced correctly. following code test application can forwarded if needed.

this form should change data in table 8 rows instead of 4 when checkbox checked, doesn't update table , returns contents of partial view 8 rows.

main view (index.cshtml):

@{ ajaxoptions options = new ajaxoptions {     updatetargetid = "notestablebody",     insertionmode = insertionmode.replace }; }  @using (ajax.beginform("notespartial", options)) {     <h3 class="csgorange ib" style="margin-top:-20px;">notes |</h3> <span class="f14">@html.checkbox("showmorenotes") show more notes</span>     <input type="hidden" id="num" name="num" value="8" /> }  <table class="table table-striped tableautowidth">     <tr>         <th>noteid</th>         <th>title</th>         <th>text</th>     </tr>     <tbody id="notestablebody">         @html.action("notespartial", new { num = 4 })     </tbody>  </table>  @section scripts {  <script type="text/javascript">      $(document).ready(function () {         $('#showmorenotes').click(function () {             this.form.submit();         });      });  </script> 

}

partial view (notespartial.cshtml):

@model ienumerable<testajax.models.noteviewmodel> @foreach (testajax.models.noteviewmodel note in model) {     <tr>         <td>@html.displayfor(modelitem => note.noteid)</td>         <td>@html.displayfor(modelitem => note.title)</td>         <td>@html.displayfor(modelitem => note.text)</td>     </tr> } 

controller table contents:

 public partialviewresult notespartial(int num)     {         ilist<noteviewmodel> notelist = new list<noteviewmodel>();          (int i=0; i<num; i++)         {             notelist.add(new noteviewmodel { noteid = i, title = "title " + i, text = "note text " + });         }          return partialview(notelist);     } 

the javascript file references handled in layout. here's after they're rendered.

<script src="/scripts/jquery-1.10.2.js"></script> <script src="/scripts/jquery.unobtrusive-ajax.js"></script> <script src="/scripts/jquery.validate.js"></script> <script src="/scripts/jquery.validate.unobtrusive.js"></script>  <script src="/scripts/bootstrap.js"></script> <script src="/scripts/respond.js"></script> 

figured out. has way form submitted. had give ajax form id:

@using (ajax.beginform("notespartial", "home", options, new { id = "notesform" })) 

then able submit form way:

$(document).ready(function () {         $('#showmorenotes').click(function () {             //this.form.submit();             $('#notesform').submit();         });      }); 

perhaps using this.form.submit() won't submit form ajax form.