How to Call Patial View In Tab

See more:

MVC4

Hello,

I have Index page which contain JavaScript Tab and inside the Tab I have a Partial View.

once user click on tab it will call partial view so this partial view has some searching criteria so once user select criteria and search resutl I want to call another partial view inside the PartialView I had tred but it will render as next page what is goes wrong I dont know.

My Index page is here..

@{
    ViewBag.Title = "Home Page";
}
    <section class="featured">
            <div id="tabs">
                <ul>
                    <li><a href="/Home/GetResidentialTab">Residential</a></li>
                    <li><a href="#tabs-2">New Project</a></li>
                    <li><a href="#tabs-3">Commercial</a></li>
                </ul>

                <div id="tabs-2">
                    Content for Tab 2 goes here.<br />
                    Lorem ipsum dolor sit amet, consectetuer adipiscing elit,
                    sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
                </div>

                <div id="tabs-3">
                    Content for Tab 3 goes here.<br />
                    Lorem ipsum dolor sit amet, consectetuer adipiscing elit,
                    sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
                </div>
            </div>
    </section>

<script type="text/javascript">
    $(function () {
        $("#tabs").tabs();
    });
</script>

now Once user click on residential the GetResidentialTab partial view will render and it is here..

@model BuldertTrackerWeb.Models.ResidentialSearchModels

<script src="~/Scripts/jquery-1.8.2.min.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>

@*@using (Html.BeginForm("GetSelectedRadioButton", "Home"))*@

@using (Ajax.BeginForm("GetSelectedRadioButton",
            new AjaxOptions{
                HttpMethod="get",
                InsertionMode= InsertionMode.Replace,
                UpdateTargetId = "SearchListMatching"
            }))
{
    @Html.AntiForgeryToken()
    @Html.ValidationSummary(true)
      
    foreach (BuldertTrackerWeb.ViewModels.RadioButtonItem item in Model.RadioButtonView.RadioButtonList)
    {
        @Html.DisplayFor(i => item.Name)
        @Html.RadioButton("ResidentialSearchModels.RadioButtonViewModel.SelectedRadioButton", item.Name, item.Selected, new { @style = "width: 40px;" })    
    }
    
    <fieldset>
        
        <legend>ResidentialSearchModels</legend>

        <div class="editor-field">
            @Html.DropDownListFor(model => model.PropertyType, new SelectList(Model.PropertyTypes, "ID", "Name"), "-Select PropertyType-", new { @style = "width: 200px;height:30px" })
            @Html.DropDownListFor(model => model.City, new SelectList(Model.Cities, "ID", "Name"), "-Select City-", new { @style = "width: 200px;height:30px" })
            @Html.TextBoxFor(model => model.SearchTag,new { placeholder = "Project, Builder, Locality..." })
        </div>

        <div class="editor-field">
            @Html.DropDownListFor(model => model.MinPrice, new SelectList(Model.MinPrices, "ID", "Name"), "-Select MinValue-", new { @style = "width: 180px;height:30px" })
            @Html.DropDownListFor(model => model.MaxPrice, new SelectList(Model.MaxPrices, "ID", "Name"), "-Select MaxValue-", new { @style = "width: 180px;height:30px" })
            @Html.DropDownListFor(model => model.Bedroom, new SelectList(Model.Bedrooms, "ID", "Name"), "-Select Bedroom-", new { @style = "width: 180px;height:30px" })
            @Html.DropDownListFor(model => model.PostedBy, new SelectList(Model.PostedBys, "ID", "Name"), "-Select PostedBy-", new { @style = "width: 180px;height:30px" })
        </div>

        <p>
            <input type="submit" value="Search" />
        </p>
    </fieldset>
}

now user click on Search button it will get some result and this result I want to render as partial view into "GetResidentialTab" partial view how I can render this..

even my _ListView is partilview here...

@model BuldertTrackerWeb.Models.ResidentialSearchModels
<div id="SearchListMatching">
@using (Html.BeginForm())
{
    if (Model.residentialListView != null)
    {
    <ul>
            @foreach (var item in Model.residentialListView)
            {
                <li>
                    <a href="@Url.Action("Details", new { id = item.Id })">
                        <img alt="@item.Title" src="@item.Url" />
                        <span>@item.Detail</span>
                    </a>
                </li>
            }
    </ul>
    }
}
</div>

I have no Idea how to call I am calling it inside the Controll like

public ActionResult GetSelectedRadioButton(ResidentialSearchModels model)
       {
           //var SelectedRadioButton = model.RadioButtonView.SelectedRadioButton;

           //Do something according to the selected value
           model.residentialListView = new List<ResidentialListViewModels>()
               {
                    new ResidentialListViewModels(){Id =1, Url="", Detail="Sample 1", Title="Title 1"},
                    new ResidentialListViewModels(){Id =2, Url="", Detail="Sample 2", Title="Title 2"},
                    new ResidentialListViewModels(){Id =3, Url="", Detail="Sample 3", Title="Title 3"},
                    new ResidentialListViewModels(){Id =4, Url="", Detail="Sample 4", Title="Title 4"},
                    new ResidentialListViewModels(){Id =5, Url="", Detail="Sample 5", Title="Title 5"},
               };
           return PartialView("~/Views/Shared/_ListView.cshtml", model);
       }

but it will not working...??