1

How can a partial view on the create view that has to come in empty be refreshed with new data when a user selects a value from a list a values drop down?

I have a tried a bunch of stuff listed on the message board as well as others and it just drills down to more errors. I just can't believe something so easy in webforms is this hard to do in MVC.

I tried this both in Chrome and IE and get errors so I'm lost. I have something like this for a partial view in the shared folder:

<table cellpadding="1" border="1">
    .... // table header
    @foreach (SYSTEMX.Models.VUE_ISSUE_LIST item in ViewBag.IssuesList)
    {
        <tr>
           <td>@item.Issue</td>
       </tr>
    }
</table>

The Create cshtml file has this:

<div class="col-sm-6">
    <div class="form-horizontal" style="display:none" id="PV_IssueList">
        @{ Html.RenderAction("UpdateIssuesList"); }
    </div>
</div>

In the Controller there is code similar to this

[HttpGet]
public ActionResult UpdateIssuesList(int? VID)
{
    ViewBag.IssuesList = GetIssuesList(VID);
    return PartialView("UpdateIssuesList");
}

The GetIssuesList(VID) looks very similar to this and it is in the controller of the mvc application 

private List<VUE_ISSUE_LIST> GetIssuesList(int? VID)
{
    return db.VUE_ISSUE_LIST_.Where(i => i.ID == VID).ToList();
}

I get this error. I'm clueless to what is going on here.

The partial view 'UpdateIssuesList' was not found or no view engine supports the searched locations. The following locations were searched: ~/Views/CONTROLLERX/UpdateIssuesList.aspx
~/Views/CONTROLLERX/UpdateIssuesList.ascx
~/Views/Shared/UpdateIssuesList.aspx
~/Views/Shared/UpdateIssuesList.ascx
~/Views/CONTROLLERX/UpdateIssuesList.cshtml
~/Views/CONTROLLERX/UpdateIssuesList.vbhtml
~/Views/Shared/UpdateIssuesList.cshtml
~/Views/Shared/UpdateIssuesList.vbhtml

A forum user posted something like this as a solution and I guess it worked for him as he put a green check mark but it does not work for me at all:

Updating PartialView mvc 4

Also tried this:

refresh a partial view in mvc

Also read over this but it is so very technical that I don't follow it all that well.

https://www.simple-talk.com/dotnet/asp-net/tips-and-tricks-about-razor-partial-views/

Community
  • 1
  • 1
  • 1
    You need to use ajax to dynamically update the view (exactly as both the links you have included show). And the error is obvious - your have not created a view `UpdateIssuesList.cshtml` –  Jan 27 '17 at 22:41
  • Hello SM... what do you mean? Your have not created a view UpdateIssueList.cshtml? What does that view do? Do you have to replace partial views with new views? I don;t understand how this all works. What I would like to have happen is that when user clicks the drop down list the the ID from the dropdown list past into viewbag that is built from a list and the ID acts as filter from query. That data gets updated in partial view. I really don't follow what they are doing in the links. I was hoping the original asker would see this question and tell me how he made it work. –  Jan 30 '17 at 15:47
  • hi @Stephen Muecke it is not obvious as I don't know what UpdateIssuesList.cshtml is representing. I have a partial view called _IssuesListPartial.cshtml. Is the I thought based on the forum thread the person has a controller action called UpdateIssuesList, yes? I think the goal that I am trying to do is something that mvc cannot do since this thing is something that was pretty standard in web forms because it was just a control that you can make visible. I guess with mvc not having controls it only can populate the list one time and not update it since it can't be refreshed. Thanks anyway. –  Jan 30 '17 at 16:04
  • 1
    If your view is named `_IssuesListPartial.cshtml`, then it needs to be `return View("_IssuesListPartial");` –  Jan 30 '17 at 21:13
  • Ahh I ok it was not clear in the example answer as he did not have the underscore... yeah I have added it and it still does not work. I guess this is something that can't really be done in the mvc framwork. It's very easy to do this is classic asp and in asp.net webforms. Thank you for the help –  Jan 30 '17 at 21:21
  • 1
    Of course it can be done! The error means you have not created a view with the name `UpdateIssuesList.cshtml` –  Jan 30 '17 at 21:27
  • Im not creating a view I am creating a partial view and that has been built I just did not show the html in the question. Do you know of a clear example that shows this from start to finish? I think the answers listed on the forum are not complete.. or maybe they are doing something else as I am trying to pass an id from a dropdown list to the list maker and then have that update when the the dropdown is changed which should also change the partial view list. I have not seen a tutorial like that. If this is something you know how to to can you share some more insight into how this can be done? –  Jan 30 '17 at 21:53
  • 2
    A partial view is a view (it just does not have a layout)! And in order to respond to client side events (e.g. selecting an option from a dropdownlist), you need javascript, and to update the DOM, you need ajax to call a server method which returns a partial view –  Jan 30 '17 at 21:57
  • Yeah that sounds REALLY complicated... My users will have to go without this feature because I don't know how to do any of that stuff and I don't know what a DOM or what an ajax call is. I may just ask another question and formulate it better and maybe someone that know how to do it will show how it's done. Or that someone that has done what I am trying to do and show me what they did in detail. or if there is a easier way that is not so complicated and uses things I know. Or as I said they will not have this feature. Thank you so much! –  Jan 30 '17 at 22:13
  • 1
    Hi @007, You should create a dropdown list (DropDownListFor) instead of a table, with the values coming from your IssueList (coming from your controller/name_view. HttpGet). In it onclick event you must to call it wrapped form, controller/name_view (HttpPost). You will return back the model and a control´s ViewBag which will render your partial view or not (with value coming from the model and return back from the controller). This partial must to have another method (controller/name_partialview), which, in function of the model you are passing to it (RenderAction), let you render your partial – Kenzo_Gilead Feb 01 '17 at 10:36

2 Answers2

4

I ended up using some called Ajax in the code behind that reads the click from the dropdown list. get the value of the selected item and passed the values back to

all of the controller code behind to build the list and send it to update the partial view and if there is data there it pass the partial view

with the update list to the create form. 

    $(document).ready(function () {
        $('#RES_VID').change(function ()
        {

            debugger;

            $.ajax(

                {
                    url: '@Url.Action("UpdatePartialViewList")',
                    type: 'GET',
                    data: { VID: $('#RES_VID').val() },

                    success: function (partialView)
                    {
                        $('#PV_WidgetList').html(partialView);
                        $('#PV_WidgetList').show();
                    }
                });
  • 2
    That's the right way to do your actions dinamically. RenderAction only loads new content the first time. Nevertheles, I'd use done() instead of success and take care of failed callback too. $.ajax({ ... //YOUR PAREMETERS EXCEPT SUCCESS }).done(function (partialView) { $('#PV_WidgetList').html(partialView); $('#PV_WidgetList').show(); }).fail(function(xhr, textStatus) { // FAIL CONTROLS }).always(function() { // WHAT YOU ALWAYS WANT TO DO }); – Santiago Porras Aug 08 '17 at 08:27
1

Is that enough?

$("#PV_IssueList").load("/controllerx/UpdateIssuesList?VID=1");

When you need refresh, call this jquery line... or put it inside a function, or any event.. for example onclick='$("#PV_IssueList").load("/controllerx/UpdateIssuesList?VID=1");'

Performer
  • 11
  • 6
  • Hi @Performer, Thanks for the answer. But I don't think the mvc can do what I required sadly and I will just have to abondon this feature as I need list to update with new data based on what is selected in the drop down list. I think I may have confused myself. I do have a question about the VID=1 that you added to the answer. The VID=1 will just keep sending the ID of 1 correct? How will it know that I need it to pass the ID from the dropdown list If it;s hard coded with the value 1? –  Jan 30 '17 at 15:56
  • Also one more question about this to Performer or anyone that knows... in this statement what does the UpdateIssuesList part of this statement represent in context to the statement below, should that be the partial view formated with the underscore?: onclick='$("#PV_IssueList").load("/controllerx/UpdateIssuesList?VID=1"); Thanks –  Jan 30 '17 at 21:49
  • 2
    For the first part, it could be your pages doesnt have the same name that the method in controller. For achieving the part of refreshing partial view in MVC 5, this approach looks correct for me. Try this link as far as is more completed. Let me know: http://stackoverflow.com/questions/38501116/how-can-i-refresh-just-a-partial-view-in-its-view – Kenzo_Gilead Jan 31 '17 at 15:26
  • @GileadKenzo many thanks sir... I will have a look at that link! –  Jan 31 '17 at 16:14
  • 1
    My pleassure @007 :) – Kenzo_Gilead Jan 31 '17 at 17:14