.NET MVC Ajax Form - How do you hide it?

Posted by Tommy on Stack Overflow See other posts from Stack Overflow or by Tommy
Published on 2010-03-28T01:40:04Z Indexed on 2010/03/28 1:43 UTC
Read the original article Hit count: 475

Filed under:
|
|

Ok, everything is 'functionally' working with what I am attempting to accomplish and once again, I am sure this is something dumb, but I cannot figure out how to do this one thing.

I have an edit form for an entity, lets say a car. This 'car' can have 0 - many passengers. So on my edit form, I have all the fields for the car, then a list view showing each passenger (partial). I also have a 'add new passenger' button that will render a new partial view that allows you to enter a passenger. This has a cancel link and an add button to submit an Ajax form. When you add a passenger, the passenger is automatically added to the list, but I need the enter passenger form to go away. I have tried using the onSuccess and onComplete functions to hide the div that the form is in, but both render just the partial view HTML elements (white screen, text) and not the partialView in the context of the entire page.

Sources: 1) Main Edit View

    <script type="text/javascript">
    Function hideForm(){
        document.getElementById('newPassenger').style.display = 'none';
    }

</script>
<h2>Edit</h2>

<%-- The following line works around an ASP.NET compiler warning --%>
<%= ""%>

<%Html.RenderPartial("EditCar", Model)%>
<h2>Passengers for this car</h2>
<%=Ajax.ActionLink("Add New Passenger", "AddPassenger", New With {.ID = Model.carID}, New AjaxOptions With {.UpdateTargetId = "newPassenger", .InsertionMode = InsertionMode.Replace})%>
<div id="newPassenger"></div>
<div id="passengerList">
    <%Html.RenderPartial("passengerList", Model.Passengers)%>
</div>
<div>
    <%= Html.ActionLink("Back to List", "Index") %>
</div>

2) AddPassenger View. The cancel link below is an action that returns nothing, thus removing the information in the div.

<%  Using Ajax.BeginForm("AddPassengerToCar", New With {.id = ViewData("carID")}, New AjaxOptions With {.UpdateTargetId = "passengerList", .InsertionMode = InsertionMode.Replace})%>   
    <%=Html.DropDownList("Passengers")%> 
    <input type="submit" value="Add" />
    <%=Ajax.ActionLink("Cancel", "CancelAddControl", _
                                            New AjaxOptions With {.UpdateTargetId = "newPassenger", .InsertionMode = InsertionMode.Replace})%><% end using %>

© Stack Overflow or respective owner

Related posts about asp.net-mvc

Related posts about AJAX