Click here to Skip to main content
15,074,181 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
Hi,

I want to display three different partial views on a aspx webpage based on the buttons selected. That part is working fine.
But then each of the partial views would read separate sections from the xml file and would provide data the view as well.

I have tried to pass the data as Arraylist to the view but the partial view does not show up now. Without passing the data, the partial views were working.

Please note I am using aspx instead of razor.

Any ideas as to how to make this work so that upon clicking any of the 3 buttons, a different partial view is displayed with the xml data as well.

Thanks in advance.

RenderVOIP.aspx

XML
$(function() {
        $('#InfoButton').on("click", function() {
            $.get('<%= Url.Action("InfoAction", "HardwareRequisition")%>', function (data) {
                $( "#myContentView" ).html( data );
            });
            $('#NotesButton').on("click", function() {
                $.get('<%= Url.Action("NotesAction", "HardwareRequisition")%>', function (data) {
                    $( "#myContentView" ).html( data );
                });
                $('#OrdersButton').on("click", function() {
                    $.get('<%= Url.Action("OrdersAction", "HardwareRequisition")%>', function (data) {
                        $( "#myContentView" ).html( data );
                    });
                });
            });
        });
    });

<input type="text" id="box" style="width: 100px;" />
      <div class="row">
                    <div class="col-lg-12" id="account-subnavigation">
                        <div class="btn-group" style=" margin-bottom:10px; margin-left:10px;">
                            <button class="btn btn-info" style="width:120px" id="InfoButton">Info</button>
                            <button class="btn btn-info" style="width:120px" id="NotesButton">Notes</button>
                            <button class="btn btn-info" style="width:120px" id="ordersButton">Orders</button>
                        </div>
                    </div>
                </div>

               <div class="row" id="myContentView">

                </div>

_voipSubform1.ascx

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<Products>" %>

<h2>VoIP Subform 1</h2>
 test
<fieldset id="voipdetails" class="section2">

    <table class="table table-bordered">
<tr>
<th>Id</th>
<th>Product Name</th>
<th>Product Cost</th>
</tr>
<% foreach (var product in ((IEnumerable<Products>)ViewData["data"]))

{ %>
<tr>
<td>
    <%: product.ProductId%>
</td>
<td>
<%= product.ProductName%>
</td>
<td>
<%= product.ProductCost%>
</td>
</tr>
<% } %>
</table>

HardwareRequisitionController.cs

public ActionResult InfoAction()
            {
                //return View("VoIPSubform1", _repository.GetForm(8));
      //          return PartialView("_MySecondPartialView");
      //          return View("RenderVOIPForm", _repository.GetForm(8));

                var filename = AppDomain.CurrentDomain.BaseDirectory + "App_Data\\" + "log\\" + "logErrors.txt";
          
               // return View(data.ToList());
                XMLReader readXML2 = new XMLReader();
                var data2 = readXML2.ReturnListOfProducts();

       

                return PartialView("_VoIPSubform1", data2);

           //     return View("_VoIPSubform1", data.ToList());
            }
Posted

1 solution

Firstly please change in javasript code:
JavaScript
$(function() {
        $('#InfoButton').on("click", function() {
            $.get('<%= Url.Action("InfoAction", "HardwareRequisition")%>', function (data) {
                $( "#myContentView" ).html( data );
            });
	});
        $('#NotesButton').on("click", function() {
            $.get('<%= Url.Action("NotesAction", "HardwareRequisition")%>', function (data) {
                $( "#myContentView" ).html( data );
            });
 	});
        $('#OrdersButton').on("click", function() {
            $.get('<%= Url.Action("OrdersAction", "HardwareRequisition")%>', function (data) {
                $( "#myContentView" ).html( data );
            });
        });
});

Secondly please go through below link that might help you:
Sending PartialView Through jQuery Ajax Request In ASP.NET MVC[^]
   

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)




CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900