0

I am new in MVC. I have an action called Index which populates a selectlist and passes it to the view. Then I have an httpost function GetBaseline() as RedirectToRouteResult to get the value from the Index.vbhtml and pass it to StatusList() to display a table.

This is my StatusAreaController:

Function Index() As ActionResult            
        Dim l_SubmitBaselineSelectLists As New FCSWebMVC.Models.SubmitBaselineSelectLists
        With l_SubmitBaselineSelectLists
            .m_SelectListBaseline = m_BaselineRepository.BaselineSelectList()  'Pass the baselines obtained from the model to the view
        End With
        Return View(l_SubmitBaselineSelectLists)
    End Function


'This handles the POST resulting from the Submit button click
    <HttpPost()> _
    Public Function GetBaseline() As RedirectToRouteResult
        Dim l_iBaseline As Integer = Request.Form("cmbBaselineType")
        System.Web.HttpContext.Current.Cache("baselineId") = l_iBaseline
        Dim l_sBaselineName As String = m_BaselineRepository.GetBaselineName(l_iBaseline)
        System.Web.HttpContext.Current.Cache("baselineName") = l_sBaselineName
        Return RedirectToAction("StatusList", New With {.Bid = l_iBaseline})
    End Function

'action to display current features based on baseline
    Public Function StatusList(ByVal search As String, ByVal Bid As Integer) As ActionResult
        Return View(m_StatusRepository.GetStatusList(Bid, search))
    End Function

Index.vbhtml:

@ModelType FCSWebMVC.Models.SubmitBaselineSelectLists
@Code
ViewData("Title") = "Status Area"
End Code
<h4>@ViewData("Title")</h4>
<br />
<div>
@Using (Html.BeginForm("GetBaseline", "StatusArea"))
    @Html.Label("Select Baseline:")
    @Html.DropDownList("cmbBaselineType", Model.m_SelectListBaseline)@<br />@<br />

    @<input type="submit" value="Select!" />

End Using

StatusList.vbhtml:

@ModelType IEnumerable(Of FCSWebMVC.Status)

<link href="@Url.Content("~/Content/Tables.css")"
  rel="stylesheet" type="text/css" />

<br />
<div>

@Using (Html.BeginForm("GetSearchParameters", "StatusArea"))

    @<b>Search for Satus ID:</b>@<br />
    @Html.TextBox("search", String.Empty, New With {.size = "200"}) @<input type="submit" value="Find Status ID" />

End Using
</div>
<br />
<h4>Current Statuses:</h4>
<br />
@If (Model.Count > 0) Then
@<div class="table_div_status">
@Using (Html.BeginForm("StatusList", "StatusArea"))

    Dim grid = New WebGrid(canPage:=False, source:=Model)
    @grid.GetHtml(tableStyle:="webgrid-table", headerStyle:="webgrid-header", rowStyle:="webgrid-row-style", htmlAttributes:=New With {.id = "table1"}, columns:=grid.Columns(
        grid.Column("Status ID", format:=Function(str) Html.ActionLink(CType(str, System.Web.Helpers.WebGridRow).Value.Status_ID,
                                                                    "StatusData",
                                                                    New With {.BaselineID = CType(str, System.Web.Helpers.WebGridRow).Value.BaselineID,
                                                                              .StatusID = CType(str, System.Web.Helpers.WebGridRow).Value.Status_ID})),
        grid.Column("Level", format:=Function(str) Html.ActionLink(CType(str, System.Web.Helpers.WebGridRow).Value.Level,
                                                                    "StatusData",
                                                                    New With {.BaselineID = CType(str, System.Web.Helpers.WebGridRow).Value.BaselineID,
                                                                              .StatusID = CType(str, System.Web.Helpers.WebGridRow).Value.Status_ID})),
        grid.Column(columnName:="Approved_Short_String", header:="Approved Short String"),
        grid.Column(columnName:="Long_String", header:="Long String")))

End Using
</div>
Else
@<center><h3>No data found</h3></center>
End If

I want to be able to show the StatusList view in the same page as the Index view just below the selectlist once the user clicks on the submit button. How can I achieve this?

HJL
  • 21
  • 4

2 Answers2

0

Assuming you know how to use basic JavaScript, you will need to do this with AJAX. I have an answer here which addresses something relatively similar to your issue. There is a slightly updated way from my answer of performing AJAX requests with jQuery if you plan on using that, jQuery.get, otherwise you'll need to look into XHR requests with vanilla JS.

What you want to do specifically is send your information via AJAX to the controller and return a PartialResult, or alternatively just return a PartialView.

Community
  • 1
  • 1
Inspector Squirrel
  • 2,548
  • 2
  • 27
  • 38
  • I have never used JavaScript either. I am kind of lost now. – HJL Jul 08 '15 at 15:06
  • Time to learn! :D in my other answer, the serializeObject part is just for turning the form into a proper JSON object. The AJAX part starts a background request to the web server so that the browser can send a request and receive a response without reloading the page. You can use Javascript to add the response to your page without reloading it. – Inspector Squirrel Jul 08 '15 at 15:08
0

You could use partial views.

  1. Create your second view as a partial view
  2. Make an AJAX call from the current view to an action method in a controller
  3. Return the partial view from the action method
  4. Append the result to a div

Hope the below link helps http://www.c-sharpcorner.com/UploadFile/d551d3/how-to-load-partial-views-in-Asp-Net-mvc-using-jquery-ajax/

gvk
  • 597
  • 7
  • 27
  • Should I put the script in the index.vbhtml? – HJL Jul 08 '15 at 17:05
  • How do I get the value from the dropdownlist and pass it to the function StatusList? – HJL Jul 08 '15 at 17:13
  • Yes, you should put the script in index.vbhtml. Also, do an AJAX POST and append the partial view on the success event of the AJAX call – gvk Jul 09 '15 at 02:16