1

这是我第一次使用 ASP.NET MVC 并且我被卡住了。

在我的代码中，我使用 JQuery/json 进行 Ajax 调用，将按钮单击时选定的选项数组传递到控制器端并在那里执行一些操作。

然后我返回一个Partial View包含一个表格的表格，这样我就可以在页面上看到部分视图（即网格）的内容。

现在我想通过网格，但是当我尝试检查它时，我意识到在浏览器的View Source.

我在这里错过任何基本的东西吗？有人可以帮忙吗？

控制器 - View 的主要操作方法：

public ActionResult AssignCalculationToSC()
{
   //Some Oprations performed
   return View();  
}

从 Ajax 调用以返回 Partial View 的操作方法：

public ActionResult AddSelectedList(string selectedList, string calculationPurpose)
{  
    List<AssignCalculationsSourceDataModel> lstAssignCalculationsSourceDataModel = new List<AssignCalculationsSourceDataModel>();
    AssignCalculationsSourceDataModel assignCalculationsSourceDataModel = new AssignCalculationsSourceDataModel();
    return PartialView("AssignCalculationToSC", lstAssignCalculationsSourceDataModel);
}

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, calculationPurpose);
    });

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

主视图：

@{
    ViewBag.Title = "Assign Price Values";
}

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

@{Html.RenderPartial("PartialAssignCalculationGrid", Model);}

部分视图：

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

@if (Model != null)
{
    <div id="dvGrid">
    <table id="grid" style="table-layout: fixed;">
    </table>
    </div>
}
4

1 回答 1

2

Q1) 现在我想通过网格，但是当我尝试检查它时，我意识到在浏览器的查看源代码中没有创建任何 HTML 代码。

部分视图中的 HTML 将永远不会出现在页面的源代码中，因为它不存在于初始 HTTP GET 中。浏览器中的View Source命令显示在执行任何 javascript 之前收到的 HTML。

下载并安装 fiddler并检查 Ajax 调用以查看从控制器返回的 HTML。

Q2（隐式）为什么局部视图从不显示在屏幕上？

您的主视图需要一个 div#dvgrid 并且您的部分视图需要承载网格的内容，如下所示：

主视图：

@{
    ViewBag.Title = "Assign Price Values";
}

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

<div id="dvGrid">
</div>

部分视图：

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

@if (Model != null)
{
    <table id="grid" style="table-layout: fixed;">
        @foreach(var item in Model){
            <tr>
                <td>
                    DATA <!-- render data here -->
                </td>
                <!-- ... -->
            </tr>
        }
    </table>
}

编辑

您需要使用控制器中的属性来装饰您的AddSelectedList操作：[HttpPost]

[HttpPost]
public ActionResult AddSelectedList(string selectedList, string calculationPurpose)
{  
    List<AssignCalculationsSourceDataModel> lstAssignCalculationsSourceDataModel = new List<AssignCalculationsSourceDataModel>();
    AssignCalculationsSourceDataModel assignCalculationsSourceDataModel = new AssignCalculationsSourceDataModel();
    return PartialView("AssignCalculationToSC", lstAssignCalculationsSourceDataModel);
}

你需要修复你的ajax调用。请注意，该JSON.stringify()方法必须包装您的整个 javascript 对象。

$.ajax(
        {
            url: "@Url.Action("GetData")",
            type: "POST",
            dataType: "json",
            traditional: true,
            data: JSON.stringify({ selectedList: selectedList, calculationPurpose:  calculationPurpose }),
            success: function (response) 
            {
                $("#dvGrid").html(response);
            }
        });
于 2013-07-18T16:50:28.447 回答