[英]Basic partial view render
In my view, I have a form I want to dynamically render. 在我看来,我有一个要动态呈现的表单。 This form is wrapped around a larger form: 此表单围绕着一个较大的表单:
<form>
//......stuff...
@using (Ajax.BeginForm("FindWorkOrder", new AjaxOptions {
UpdateTargetId = "workOrders" }))
{
<input type="text" name="workOrder" />
<input type="submit" value="Find" />
}
<div id="workOrders">
@{ Html.RenderPartial("DisplayWorkOrder"); }
</div>
</form>
In my controller: 在我的控制器中:
public ActionResult FindWorkOrder()
{
// do query, return a model
return View();
}
I have a partial view named DisplayWorkOrder.cshtml
. 我有一个名为DisplayWorkOrder.cshtml
的局部视图。
Several questions: 几个问题:
FindWorkOrder
controller? 如何使用从FindWorkOrder
控制器收到的数据来呈现此局部视图? My intended functionality is for the ajax form to submit (without the whole form submitting) and populate <div id="workOrders">
with data that I queried. 我想要的功能是让ajax表单提交(不提交整个表单),并用我查询的数据填充<div id="workOrders">
。
Thanks. 谢谢。
To render the partial view , you can do this 要渲染局部视图,您可以执行此操作
@Html.RenderPartial("DisplayWorkOrder")
If you want to pass a model to the Partial view,you can do this 如果要将模型传递到“局部”视图,则可以执行此操作
@Html.RenderPartial("DisplayWorkOrder",Model)
If you want to pass a proprty of the model to the Partial view,you can do this 如果要将模型的属性传递给Partial视图,则可以执行此操作
@Html.RenderPartial("DisplayWorkOrder",Model.MyProperty)
Assiming that you have a model binded to the initial (parent) view from where you want to call the partial view. 假设您有一个要绑定到初始(父)视图的模型,该模型是您要从其中调用部分视图的位置。 You should be returning the Model /View Model in your Action called "FindWorkOrder" .Something like this 您应该在名为“ FindWorkOrder”的操作中返回Model / View Model。类似这样的事情
public ActionResult FindWorkOrder()
{
CustomerViewModel objCustVM=CustomerService.GetCustomerViewModel(); // just to get the customer model.
return View(objCustVM);
}
and in your Main View 并在您的主视图中
@model MyProject.ViewModel.CustomerViewModel
<h2>This will show the content from Partial View</h2>
@{ @Html.RenderPartial("DisplayWorkOrder",Model)}
To Avoid submitting the enitire form, you could do a jquery ajax call from your script with the data you want to send. 为了避免提交enitire表单,您可以从脚本中使用要发送的数据进行jquery ajax调用。 I would keep the (only one) form tag at the outer level and change the submit button to normal button control. 我将在外部仅保留(一个)表单标签,然后将“提交”按钮更改为普通按钮控件。
$("#submitWorkOrder").click(function(){
//Do validation
var id=233; //get customer id from wherever you have it
ajaxUrl="Customer/SaveWorkOrder/"+id+"?workOrderId=$("#workOrder").val();
$.ajax({
url: ajaxUrl,
success: function(data){
//do whatever with the result data.
}
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.