如何在ASP.net MVC中的Webgrid usig PartialView中绑定数据

debugcn 发表于 Dev

Praveen S

Iam是.Net MVC的新手。我需要使用将数据绑定到webgrid返回中PartialView()，或者，如果可以使用返回JSON，现在我的代码将在Dropdown更改时执行，但不会绑定Web网格中的值。

JavaScript，模型，控制器代码如下所示：

脚本

<script type="text/javascript">
        $(document).ready(function () {
            $("#Cust_Id").change(function () {
                firstDDLValue = $("#Cust_Id").val();
                $.post('@Url.Action("SelectCustomerByID", "Admin")', {secondValue:firstDDLValue        }, function (ReceiptList) {
                    alert(firstDDLValue);
                    $('#divgrid').html(ReceiptLists);
                  });
            });

        });
    </script>

看法：

<div id="divgrid" style="margin-top: 15px;">
 @{
 var grid = new WebGrid(Model, canPage: true, rowsPerPage: 5, selectionFieldName: "selectedRow", ajaxUpdateContainerId: "gridContent");
grid.Pager(WebGridPagerModes.NextPrevious);}
 <div id="gridContent">
            @grid.GetHtml(
                tableStyle: "webgrid-table",
                headerStyle: "webgrid-header",
                footerStyle: "webgrid-footer",
                alternatingRowStyle: "webgrid-alternating-row",
                selectedRowStyle: "webgrid-selected-row",
                rowStyle: "webgrid-row-style",
                columns: grid.Columns(
                grid.Column("Id", "ID", style: "id"),
                grid.Column("Cust_Name", "Cust Name", style: "PName"),
                grid.Column("Pay_Amount", "Pay_Amount", style: "ICode"),
                grid.Column("Pay_Mode", "Pay_Mode", style: "IName"),
                grid.Column("Bank_Name", "Bank_Name", style: "Weight"),
                grid.Column("Bank_Address", " Bank_Address", style: "MakingCharge"),
                grid.Column("ChequeNo", "ChequeNo", style: "Certification"),
                grid.Column("Cheque_Date", " Cheque_Date", style: "Price"),
                grid.Column("Date", "Date", style: "Price"),
                grid.Column("Edit", "", @<a href='../Admin/[email protected]' ><img src="~/Images/edit.png" alt='Edit' /></a>, style: "width:10%"),
                grid.Column(header: "Delete", format: @<text><a href="@Url.Action("DeleteReceipt", "Admin", new { Id = item.ID })" onclick="javascript:return confirm('Are you sure you'd like to delete this product?');"><img src="../Images/delete.png" alt='Delete' /></a></text>) ))
 @if (grid.HasSelection)
        {
             Receipt = (JewellaryWeb.Models.Receipt)grid.Rows[grid.SelectedIndex].Value;
                                <b>Id</b> @Receipt.Id<br />
                                <b>Name</b> @Receipt.Cust_Name<br />
                                <b>Amount</b> @Receipt.Pay_Amount<br />
                                <b>PayMode</b> @Receipt.Pay_Mode<br />
                                <b>BankName</b> @Receipt.Bank_Name<br />
                                <b>BankAddress</b> @Receipt.Bank_Address<br />
                                <b>ChequeNumber</b> @Receipt.ChequeNo<br />
                                <b>ChequeDate</b> @Receipt.Cheque_Date<br />
        }
</div>

Controller:

public ActionResult SelectCustomerByID(Receipt model,string secondValue)
        {
          int CustID = 0;
          if (secondValue != "")
          CustID = Convert.ToInt32(secondValue);
          ObservableCollection<Receipt> ReceiptList = new ObservableCollection<Receipt>();
          Receipt Receipt = new Models.Receipt();
          model.ReceiptList = Receipt.GetReceiptListByCustID(CustID);
          return PartialView(model.ReceiptList);
        }

Praveen S

我找到了答案，我刚刚修改了脚本并使用ParitalView绑定了网格中的数据。我的解决方案代码是：

Script

<script type="text/javascript">
     $(document).ready(function () {
     $("#Cust_Id").change(function () {
     firstDDLValue = $("#Cust_Id").val();
     $.get('@Url.Action("SelectCustomerByID", "Admin")', { secondValue: firstDDLValue },      function (ReceiptList) {
      $('#gridContent').html(ReceiptList);
        });
      });
     });
</script>

我创建新的_Recepitgrid.cshtml作为PartialView，并以与在主视图中相同的方式编写Webgrid的代码。

Controller

public ActionResult SelectCustomerByID(Receipt model, string secondValue)
{
 int CustID = 0;
 if (secondValue != "")
 CustID = Convert.ToInt32(secondValue);
 ObservableCollection<Receipt> ReceiptList = new ObservableCollection<Receipt>();
 Receipt Receipt = new Models.Receipt();
 ReceiptList = Receipt.GetReceiptListByCustID(CustID);
 return PartialView("_Recepitgrid", ReceiptList);
}

现在它将正常工作..

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。