ASP.NET MVC 1 .. Ajax.BeginForm within Html.BeginForm. How to post without stopping and starting Html form?

Question

For example..

<% using (Html.BeginForm()) { %>
<%= html.textBox(Model.IwantThisField)%>

<%using (Ajax.BeginForm("ActionName", new AjaxOptions { fancy ajax options })) %>
   <%{%>
     <label for="stringVar">This is sent to Action</label>
     <input type ="submit" id="button" />
   <%}%>

<%= html.textBox(Model.IalsoWantThisField) %>
<input type="submit" id="mainBtn"/> 
<% } %

>

Any more information needed I will provide. This has had me stumped on a Fridat afternoon which is not at all fun. Any help much appreciated!

Answer 1

You can't nest a form within a form. What are you trying to accomplish? You could remove your Ajax.BeginForm, change the input from type submit to button, then capture the button click with JQuery and make your ajax request with $.post.

<% using (Html.BeginForm()) { %>
<%= html.textBox(Model.IwantThisField)%>

     <label for="stringVar">This is sent to Action</label>
     <input type ="buttom" id="button" />


<%= html.textBox(Model.IalsoWantThisField) %>
<input type="submit" id="mainBtn"/> 
<% } %

<script type="text/javascript">
$(function()
{
    $('#button').click(function(){
        var value = $('#stringVar').val();
        var data = {stringVar: value};
        $.post('Your action URL',data,function(data){
             //On complete Ajax request javascript.
        });
        return false;
    });
});
</script>