如何將值從telerik mvc ajax網格傳遞到控制器

Question

我有2個telerik mvc ajax網格，需要根據第一個網格上的選定行進行填充。

下面

是我的代碼：

@(Html.Telerik().Grid<PurchaseRequest>() 
    .Name("grdPurchaseRequest") 
    .DataBinding(binding => binding.Ajax() 
    .Select("GetPurchaseRequests", "PurchaseOrder")) 
    .DataKeys(keys => keys 
    .Add(o => o.PurchaseRequestID)) 
    .Columns(cols => 
    { 
    cols.Bound(c => c.PurchaseRequestID).ReadOnly().Hidden(); 
    cols.ForeignKey(c => c.ProjectID,(System.Collections.IEnumerable)ViewData["prProjects"], 
       "ProjectID", "ProjectName"); 
    cols.Bound(c => c.FullName); 
    cols.Bound(c => c.RequestDate).Format("{0:MM/dd/yyyy}"); 
    cols.Bound(c => c.Remarks); 
    cols.Bound(c => c.CheckedBy); 
    cols.Bound(c => c.ApprovedBy); 
    }) 
    .ClientEvents(clientEvents => clientEvents.OnRowSelect("onRowSelected")) 
    .RowAction(row => 
    { 
    row.Selected = row.DataItem.PurchaseRequestID.Equals(ViewData["id"]); 
    }) 
    .Pageable() 
    .Sortable() 
    .Filterable() 
    .Selectable() 

）

====第二個網格=====

這是該會根據所選擇的記錄填充第二網格在第一格

@(Html.Telerik().Grid<PurchaseRequestDetail>().HtmlAttributes(new { style = "width: 50%" }) 
.Name("grdDetails")  
.DataKeys(keys => keys 
    .Add(o => o.PurchaseRequestDetailID) 
    .RouteKey("PurchaseRequestDetailID")) 
.Columns(cols => 
{ 
    cols.ForeignKey(c => c.ItemID, (System.Collections.IEnumerable)ViewData["prItems"], 
        "ItemID", "ItemName").Width(200).Title("Description"); 
    cols.Bound(d => d.ItemQuantity).Width(100).Title("Quantity"); 
    cols.Bound(d => d.ItemValue).Width(100).Title("Value per quantity").Format("Php {0:###,###.00}"); 
    cols.Bound(d => d.TotalPrice).Width(500).Format("Php {0:###,###.00}") 
     .Aggregate(aggs => aggs.Sum()) 
     .ClientFooterTemplate("Php <#= $.telerik.formatString('{0:n}', Sum) #>"); 
})  
.DataBinding(binding => binding.Ajax() 
    .Select("GetPurchaseRequestDetails", "PurchaseOrder", new { purchaseRequestID = "<#= PurchaseRequestID #>" })) 
.ClientEvents(clientEvents => clientEvents.OnDataBinding("onDataBinding")) 
.Pageable() 
.Sortable() 

）

腳本代碼

<script type="text/javascript"> 
    var purchaseRequestID; 
    var purchaseRequestName; 
    function onRowSelected(e) { 
    var detailsGrid = $('#grdDetails').data('tGrid'); 
    purchaseRequestID = e.row.cells[0].innerHTML; 
    purchaseRequestName = e.row.cells[1].innerHTML; 
    // update ui text 
    $('#purchaseRequestName').text(purchaseRequestName); 
    // rebind the related grid 
    //alert(purchaseRequestID); 
    //location.href = "/PurchaseOrder/Index/" + purchaseRequestID; 
    detailsGrid.rebind(); 
} 
function onDataBinding(e) { 
    e.data = $.extend(e.data, { purchaseRequestID: purchaseRequestID }); 
} 

下面

是在控制器中的代碼：我用

[HttpPost] 
public ActionResult Create(PurchaseOrder purchaseorder) 
    { 
     if (ModelState.IsValid) 
     { 
      HERE, I WANT TO BE ABLE TO GET AND SAVE THE SELECTED ROW IN THE VIEW 
      //purchaseorder.PurchaseRequestID = ViewBag.SelectedID; 
      db.PurchaseOrders.Add(purchaseorder); 
      db.SaveChanges(); 
      return RedirectToAction("Index"); 
     } 

     ViewBag.SupplierID = new SelectList(db.Suppliers, "SupplierID", "Name", purchaseorder.SupplierID); 
     ViewBag.OfficeID = new SelectList(db.Offices, "OfficeID", "OfficeName", purchaseorder.OfficeID); 
     return View(purchaseorder); 
    } 

感謝

Answer 1

如果你們當中有些人可能會遇到同樣的問題， HiddenFor解決這個問題。請建議您是否有比這更好的方法。

@Html.HiddenFor(model => model.PurchaseRequestID) 

and then i updated the script 

<script type="text/javascript"> 
var purchaseRequestID; 
var purchaseRequestName; 
function onRowSelected(e) { 
    var detailsGrid = $('#grdDetails').data('tGrid'); 
    purchaseRequestID = e.row.cells[0].innerHTML; 
    purchaseRequestName = e.row.cells[1].innerHTML; 
    // update ui text 
    $('#purchaseRequestName').text(purchaseRequestName); 
    $('#PurchaseRequestID').val(purchaseRequestID); 
    detailsGrid.rebind(); 
} 
function onDataBinding(e) { 
    e.data = $.extend(e.data, { purchaseRequestID: purchaseRequestID }); 
}