MVC3 中的部分视图与 Json答案

【问题标题】：Partial View vs Json In MVC3MVC3 中的部分视图与 Json
【发布时间】：2013-07-17 13:32:28
【问题描述】：

我正在使用 MVC3 Razor 我是新手我被困在点以下。

在我的代码中，我通过使用 Jquery Json 传递所选列表的数组来进行 Ajax 调用

按钮点击控制器端并在那里执行一些操作并尝试

调用“局部视图”我在页面上看不到局部视图的内容（没有渲染）。

谁能帮忙解决这个问题。

jQuery 代码：

        $(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) {

            }
          });
         }

控制器代码：

        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);

    }

局部视图：

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

@if (模型 != 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>

提前感谢您的帮助

【问题讨论】：

请提供相关代码。我们没有足够的信息来帮助您。
您在成功回调中什么也不做。为什么你期望它应该在某处呈现响应？
因为我是新手，请告诉我如何展示我的部分视图内容。

标签： json asp.net-mvc-3 jquery

【解决方案1】：

在成功回调中，您需要处理响应并将收到的 html 插入到页面中。

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

并更改请求的类型。

dataType: "html",

回答评论。首先，您需要检查从服务器返回的响应。使用 Fiddler 或 Firebug 或其他东西。

如果一切正常并且部分视图在客户端成功返回，您只需要编辑您的 jQuery 代码。

 $(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
            }
          });
         }

【讨论】：

您好，感谢您的快速回复。能否请您详细说明 Controller 和 Jquery Json 代码。这将非常有帮助。
再次感谢您的回复能否请您从 Controller 告诉我究竟需要返回什么 b'c 目前我正在将模型恢复为部分视图现在我尝试使用您编辑的代码，但我仍然可以t 查看部分视图内容。
希望您将我代码中的 id_of_element_to_paste_response 更改为您的有效 id？=)。如果是，请检查您对 firebug 的响应。可能是你有服务器错误。
是的，我已经检查了 Firebug 中的响应，但 html 响应对于所有值都是完全正确的，但仍然无法在页面上看到部分视图内容。如果我需要在我的实际视图中做任何更改，请告诉我？目前我将部分视图声明为@html.partialView("ViewName",Model)
你想添加接收到的 html 的元素的 id 是什么？