Search code examples
c#jqueryajaxasp.net-mvcviewbag

It is possible to refresh ViewBag value in the view?


I'm trying to do a dynamic dropdownlist : I get the options of the dropdownlist from a database and put them in an objects list. In accordance with a checkbox value i remove objects from the list and set this list as a ViewBag value.

public ActionResult ThematicManagement(string Id, string IsAdult, string flagAdult)
             {
                .....
                ViewBag.DDL = null;      

                var response = VodCatalogBUS.GetParentThematics(); 
                List<oboThematic> list = new List<oboThematic>();
                list = response.Data;
                if (IsAdult == null || IsAdult == "false")            
                    list.RemoveAll(x => x.IsAdult == true && x.Id != 1007);           
                else 
                    list.RemoveAll(x => x.IsAdult == false && x.Id != 1007);                

                ViewBag.DDL = new SelectList(list, "Id", "Name");
                ....   

Then in my view i fill the dropdownlist like that :

 @Html.DropDownList("ParentThematic", (SelectList)ViewBag.DDL, new { @class="dropdown" })    

<label><input type="checkbox" value="" id="ChkIsAdult" name="ChkIsAdult">Adulte</label>

There is no problems here, i obtain the dropdown list with 4 options after the RemoveAll in the controller. Then if i click the checkbox, i must obtain 3 other options.

So I use an ajax call to return into the controller in the aim to update Viewbag's value :

 $('#ChkIsAdult').change(function () {                 
                var IsAdult = $('#ChkIsAdult').is(':checked');
                var url = dev + "/Legacy/ThematicManagement";
                $.ajax({
                    url: url,
                    cache: false,
                    type: 'POST',
                    data: {                        
                        IsAdult: IsAdult,
                        flagAdult : 'true',
                    },
                    success: function () {
                        alert('test');
                    }
                });               
            })

It works i return into the controller, but i think that the view isn't refresh so i retreive the old values (the 4 options) of the dropdownlist after clicking the checkbox.

I also try with ViewData and TempData to replace ViewBag but i've always the same proprem !

According to you, it is the good solution ? Can it works ?


Solution

  • Here is the response :

    Controller

     var response = VodCatalogBUS.GetParentThematics(); 
            List<oboThematic> list = new List<oboThematic>();
    
            list = response.Data;
    
                list.RemoveAll(x => x.IsAdult == true && x.Id != 1007);
    
                var responseAdult = VodCatalogBUS.GetParentThematics(); 
                List<oboThematic> listAdult = new List<oboThematic>();
                listAdult = responseAdult.Data;
                listAdult.RemoveAll(y => y.IsAdult == false && y.Id != 1007);                
    
            ViewBag.DDL = new SelectList(list, "Id", "Name");
            ViewBag.DDLAdult = new SelectList(listAdult, "Id", "Name");
    

    View :

      @Html.DropDownList("ParentThematic", (SelectList)ViewBag.DDL, new { @class="dropdown" })
    @Html.DropDownList("ParentThematicAdult", (SelectList)ViewBag.DDLAdult, new { @class="dropdown" , @style="display:none"})
    

    JS :

    $('#ChkIsAdult').change(function () {                 
                    if ($('#ChkIsAdult').is(':checked')) {
                        $('#ParentThematic').hide();
                        $('#ParentThematicAdult').show();
                        var value = $('#ParentThematicAdult').val();
                        var IsAdult = $('#ChkIsAdult').is(':checked');
                        var url = dev + "/Legacy/ThematicManagement";
                        $.ajax({
                            url: url,
                            cache: false,
                            type: 'POST',
                            data: {
                                Id: value,
                                IsAdult: IsAdult
                            },
                            success: function (data) {
                                $('#result').empty().append($(data).find('table'))
                            }
                        });
    
                    }
                    else
                    {
                        $('#ParentThematic').show();
                        $('#ParentThematicAdult').hide();
                        var value = $('#ParentThematic').val();
                        var IsAdult = $('#ChkIsAdult').is(':checked');
                        var url = dev + "/Legacy/ThematicManagement";
                        $.ajax({
                            url: url,
                            cache: false,
                            type: 'POST',
                            data: {
                                Id: value,
                                IsAdult: IsAdult
                            },
                            success: function (data) {
                                $('#result').empty().append($(data).find('table'))
                            }
                        });
                    }                            
                })