Partial View vs Json In MVC3

Question

I am using MVC3 Razor I am new to this I am stuck Below Point.

In My code I am giving Ajax call by using Jquery Json Passing Array of Selected List On

Button Click on Controller Side and Performing some Opration there and Trying to

Call "Partial View" I can not see the contents of Partial View on the Page(Not got Render).

Can anyone help on this.

Jquery Code:

        $(function () {

        $('#btnAdd').click(function () {
                var selectedList = [];
     $("#ddlSupplementalCalculationList option:selected").each(function (i, selected) {
           var $this = $(this);
           selectedList.push({ Id: $this.val(), Value: $this.text() });
       });

     getCalculationListGrid(selectedList)

       });
     });

          function getCalculationListGrid(selectedList) {
         $.ajax(
          {
         url: "AddSelectedList/SupplementalPricing",
           type: "POST",
           dataType: "json",
            traditional: true,    
           data: {selectedList: JSON.stringify(selectedList)},
           success: function (response) {

            }
          });
         }

Controller Code:

        public ActionResult AddSelectedList(string selectedList)
          {
        var js = new JavaScriptSerializer();
        var deserializedSelectedList = (object[])js.DeserializeObject(selectedList);
        var selectedCalculationList = new List<SelectedCalculationListModel>();

        if (deserializedSelectedList != null)
        {
            foreach (Dictionary<string, object> calcList in deserializedSelectedList)
            {
             selectedCalculationList.Add(new SelectedCalculationListModel(calcList));
            }
        }

        List<AssignCalculationsSourceDataModel> lstAssignCalculationsSourceDataModel =

          new List<AssignCalculationsSourceDataModel>();
        AssignCalculationsSourceDataModel assignCalculationsSourceDataModel = new 

        AssignCalculationsSourceDataModel();

          assignCalculationsSourceDataModel.SelectedCalculationNamesCollection = 

         selectedCalculationList;

        lstAssignCalculationsSourceDataModel.Add(assignCalculationsSourceDataModel);



        return PartialView("PartialAssignCalculationGrid", 
                                      lstAssignCalculationsSourceDataModel);

    }

Partial View:

    @model IList<Bnym.Equinox.Accounting.Web.Portal.Models.Pricing.AssignCalculationsSourceDataModel>

@if (Model != null) {

  <div id="dvGrid">
    <table id="grid" style="table-layout: fixed;">

            <tr class="gridHeaders">
                <td colspan="13" align="center">
                    Assigned Calculations
                </td>
            </tr>
            <tr class="gridHeaders">
                <td colspan="4" style="width:212px">
                    Assigned Calculations Usage
                </td>
                <td colspan="9" style="width:190px">
                    Hirarchical Pricing
                </td>
            </tr>

        <tr class="gridHeaders">
            <td class="CheckBox" style="width:20px">
                <input type="checkbox" name="SelectAll" id="SelectAll" 
            onclick="CheckAll(this);"
                    title="Select All" />
            </td>
            <td style="width:220px">
                Calculation Name
            </td>
            <td class ="lblCalculationPurpose">
                Calculation Purpose
            </td>
            <td class ="ddlRoundingRules">
                Pricing Calculation Level
            </td>
            <td  class ="ddlRoundingRules">
                Rounding Rule
            </td>
            <td class ="ddlRoundingRules">
                Rounding Type
            </td>
            <td  class = "ddlRoundingPrecision">
                Precision
            </td>
            <td class = "txtAssignCalculation">
                InvestOne Security Identifier
            </td>
            <td class = "txtAssignCalculation">
                HP Rate Source Current
            </td>
            <td class = "txtAssignCalculation">
                HP Rate Source Forward
            </td>
            <td class = "ddlUserBank">
                UserBank
            </td>
            <td class = "txtAssignCalculation">
                HP Rate Time
            </td>
            <td class = "txtAssignCalculation">
                HP Rate Type
            </td>
        </tr>
         <tbody id="dvBody">
            @for (var items = 0; items < Model.Count; items++)
            {
                for (var item = 0; item < Model 
               [items].SelectedCalculationNamesCollection.Count; item++)
                {
                    for (var index = 0; index < 3; index++)
                    {
                        var CalculationPurpose = string.Empty;

                        <tr>
                        <td style="width: 20px">
                        @Html.CheckBox("check", new { @id = "1", @class = "sel", 
                      @onclick = "uncheckHeaderCB(this);" })
                        </td>
                        <td style="width: 220px">
                        @Model[items].SelectedCalculationNamesCollection[item].Value
                    </td>
                        <td class="lblCalculationPurpose">
                        @if (Model[items].SelectedCalculationPurpose.ToLower().Equals
                      ("hp"))
                        {
                            if (index == 0)
                            {
                                CalculationPurpose = "HP – Trading NAV";
                                @Html.Label(CalculationPurpose) 
                            }
                            else if (index == 1)
                            {
                                CalculationPurpose = "HP - Performance NAV";
                                @Html.Label(CalculationPurpose) 
                            }
                        }
                        else if (Model[items].SelectedCalculationPurpose.ToLower
                   ().Equals("dissemination"))
                        {
                            CalculationPurpose = "Dissemination";
                            @Model[items].SelectedCalculationPurpose
                        }
                        else if (Model[items].SelectedCalculationPurpose.ToLower
                     ().Equals("both"))
                        {
                            if (index == 0)
                            {
                                CalculationPurpose = "HP – Trading NAV";
                                @Html.Label(CalculationPurpose) 
                            }
                            else if (index == 1)
                            {
                                CalculationPurpose = "HP - Performance NAV";
                                @Html.Label(CalculationPurpose) 
                            }
                            else if (index == 2)
                            {
                                CalculationPurpose = "Dissemination";
                                @Html.Label(CalculationPurpose) 
                            }
                        }
                    </td>
                        <td class="ddlRoundingRules">
                        @if ((Model[items].SelectedCalculationPurpose.ToLower().Equals
                             ("both") && CalculationPurpose.ToLower().Equals
                     ("dissemination")) || Model
                 [items].SelectedCalculationPurpose.ToLower().Equals("dissemination"))
                        {
                            if (Model[items].PricingCalculationLevelsCollection != 
                         null)
                            {
                                @Html.DropDownList("ddlCalculationLevel", new 
                  SelectList((System.Collections.IEnumerable)Model
                    [items].PricingCalculationLevelsCollection, "id", "value"), new { 
                       @class 
                      = "ddlRoundingRules" })
                            }
                        }
                        </td>
                    @if ((Model[items].SelectedCalculationPurpose.ToLower().Equals
               ("both") && !CalculationPurpose.ToLower().Equals("dissemination")) || 
               Model[items].SelectedCalculationPurpose.ToLower().Equals("hp"))
                    {
                        <td class="ddlRoundingRules">
                        @if (Model[items].RoundingRulesCollection != null)
                        {
                            @Html.DropDownList("ddlRoundingRule", new SelectList
            ((System.Collections.IEnumerable)Model
             [items].RoundingRulesCollection, "id", "value"), new { @class 
            = "ddlRoundingRules" })
                        }
                       </td>
                    }
                    else
                    {
                        <td class="tdBackground"></td>
                    }

                    @if ((Model[items].SelectedCalculationPurpose.ToLower().Equals
              ("both") && !CalculationPurpose.ToLower().Equals("dissemination")) ||
               Model[items].SelectedCalculationPurpose.ToLower().Equals("hp"))
                    {
                        <td class="ddlRoundingRules">
                        @if (Model[items].RoundingTypesCollection != null)
                        {
                            @Html.DropDownList("ddlRoundingTypes", new SelectList
                ((System.Collections.IEnumerable)Model
         [items].RoundingTypesCollection, "id", "value"), new { @class 
        = "ddlRoundingRules" })
                        }
                        </td>
                    }
                    else
                    {
                        <td class="tdBackground"></td>
                    }

                    @if ((Model[items].SelectedCalculationPurpose.ToLower().Equals
         ("both") && !CalculationPurpose.ToLower().Equals("dissemination")) || Model
        [items].SelectedCalculationPurpose.ToLower().Equals("hp"))
                    {
                        <td class="ddlRoundingPrecision">
                        @if (Model[items].RoundingPrecisionsCollection != null)
                        {

                            @Html.DropDownList("ddlRoundingPrecision", new SelectList
           ((System.Collections.IEnumerable)Model
           [items].RoundingPrecisionsCollection, "id", "value"), new { @class 
           = "ddlRoundingPrecision" })
                        }
                        </td>
                    }
                    else
                    {
                        <td class="tdBackground"></td>
                    }

                    @if ((Model[items].SelectedCalculationPurpose.ToLower().Equals
             ("both") && !CalculationPurpose.ToLower().Equals("dissemination")) || 
             Model[items].SelectedCalculationPurpose.ToLower().Equals("hp"))
                    {
                        <td class="txtAssignCalculation">
                        @Html.TextBox("txtInvestOneSecurityIdentifier", "", new { 
                  @Class = "txtAssignCalculation" })
                        </td>
                    }
                    else
                    {
                        <td class="tdBackground"></td>
                    }

                    @if ((Model[items].SelectedCalculationPurpose.ToLower().Equals
               ("both") && !CalculationPurpose.ToLower().Equals("dissemination")) || 
               Model[items].SelectedCalculationPurpose.ToLower().Equals("hp"))
                    {
                        <td class="txtAssignCalculation">
                        @Html.TextBox("txtHPRateSourceCurrent", "", new { @Class 
                   = "txtAssignCalculation" })
                        </td>
                    }
                    else
                    {
                        <td class="tdBackground"></td>
                    }
                    @if (Model[items].SelectedCalculationPurpose.ToLower().Equals
                   ("hp"))
                    {
                        <td class="txtAssignCalculation">
                        @Html.TextBox("txtHPRateSourceForward", "", new { @Class 
                = "txtAssignCalculation" })
                        </td>
                    }
                    else
                    {
                        <td class="tdBackground"></td>
                    }


                    @if ((Model[items].SelectedCalculationPurpose.ToLower().Equals
                 ("both") && !CalculationPurpose.ToLower().Equals("dissemination")) ||
               Model[items].SelectedCalculationPurpose.ToLower().Equals("hp"))
                    {
                        <td class="ddlUserBank">
                        @if (Model[items].UserBanksCollection != null)
                        {
                            @Html.DropDownList("ddlUserBank", new SelectList
                ((System.Collections.IEnumerable)Model
              [items].UserBanksCollection, "id", "value"), new { 
                  @class = "ddlUserBank" })
                        }
                        </td>
                    }
                    else
                    {
                        <td class="tdBackground"></td>
                    }

                    @if ((Model[items].SelectedCalculationPurpose.ToLower().Equals
                ("both") || Model[items].SelectedCalculationPurpose.ToLower().Equals
                ("hp")) && CalculationPurpose.Equals("HP - Performance NAV"))
                    {
                        <td class="ddlUserBank">
                        @if (Model[items].HpRateTimeCollection != null)
                        {
                            @Html.DropDownList("ddlHPRateTime", new SelectList
                  ((System.Collections.IEnumerable)Model
                 [items].HpRateTimeCollection, "id", "value"), new { @class 
                  = "ddlUserBank" })
                        }
                        </td>
                    }
                    else
                    {
                        <td class="tdBackground"></td>
                    }


                                           }
                }
            }
                </tbody>
             </table>
               </div>

Thanks in advance for help

Please provide the relevant code. We don't have enough information to help you. — Jesse Smith
– Jesse Smith, Commented Jul 17, 2013 at 13:33
You do nothing in your success callback. Why do you expect it should render the response somewhere? — Peter Porfy
– Peter Porfy, Commented Jul 17, 2013 at 13:47
As I am new to this Could you please tell me how I can show my show my Partial view Contents. — Vaibhav Deshmukh
– Vaibhav Deshmukh, Commented Jul 17, 2013 at 13:51

maxs87 · Accepted Answer · 2013-07-17 14:11:48Z

1

In you success callback you need to handle the response and insert the recieved html into the page.

success: function (response) {
    $("#id_of_element_to_paste_response").html(response)
}

and change the type of request.

dataType: "html",

answer on comment. First you need check that the response returned from server. Use Fiddler or Firebug or something else.

If all work fine and partial view returns on client successfuly, you just need to edit your jQuery code.

 $(function () {

        $('#btnAdd').click(function () {
                var selectedList = [];
     $("#ddlSupplementalCalculationList option:selected").each(function (i, selected) {
           var $this = $(this);
           selectedList.push({ Id: $this.val(), Value: $this.text() });
       });

     getCalculationListGrid(selectedList)

       });
     });

          function getCalculationListGrid(selectedList) {
         $.ajax(
          {
         url: "AddSelectedList/SupplementalPricing",
           type: "POST",
           dataType: "html", //here edited
            traditional: true,    
           data: {selectedList: JSON.stringify(selectedList)},
           success: function (response) {
$("#id_of_element_to_paste_response").html(response);//here edited
            }
          });
         }

edited Jul 17, 2013 at 14:11

answered Jul 17, 2013 at 13:57

maxs87

2,2242 gold badges19 silver badges25 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

Vaibhav Deshmukh Over a year ago

Hi,Thanks for quick reply. Coould you please elaborate with Controller and Jquery Json code. it will be very much helpful.

Vaibhav Deshmukh Over a year ago

Thanks once again for reply Could you please tell me from Controller what exactly I need to return b'c currently I am returing Model to Partial view Now I tried with above your edited code but still I can't see the Partial view contents.

maxs87 Over a year ago

I hope you change the id_of_element_to_paste_response in my code to your valid id?=). If yes check you response with firebug. May be you have server error.

Vaibhav Deshmukh Over a year ago

Yes I have checked Response in Firebug but html responce is totally correct with all values but still not able to see the Partial View contents on the page. Please let me know if any changes I need to do in my actual View ? Currently I am declaring partial view as @html.partialView("ViewName",Model)

maxs87 Over a year ago

what is the id of element where you wan to append recived html?

|

Collectives™ on Stack Overflow

Partial View vs Json In MVC3

1 Answer 1

7 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

7 Comments

Your Answer

Sign up or log in

Post as a guest

Related