[英]Render a PartialView in a div without postback
I know this question has been asked many times but no matter what i try i just can't get it to work.我知道这个问题已被问过很多次,但无论我尝试什么,我都无法让它发挥作用。 I have an actionResult that accepts three parameters and returns a partial view.
我有一个 actionResult 接受三个参数并返回一个局部视图。 Now what i want to do is take the values of three elements and re-render the view in a div using them.
现在我想做的是获取三个元素的值并使用它们在 div 中重新渲染视图。 I have tried to use the captured data to render the div succesfully but i can't figure out what i'm doing wrong with jquery
我尝试使用捕获的数据成功呈现 div,但我无法弄清楚 jquery 做错了什么
In the script file are included the last things i tried(although in every attempt there was some tweaking before giving up)在脚本文件中包含了我尝试的最后一件事(尽管在每次尝试中,在放弃之前都有一些调整)
Here is the RenderAction in the main view (that works)这是主视图中的 RenderAction(有效)
<div id="tables">
@{ Html.RenderAction("_Tables", new { date = "5/10/2019", time = "13:00", seats = "1" });}
</div>
the action result that returns said Partial返回所述 Partial 的操作结果
public ActionResult _Tables(string date, string time, int seats)
{
return PartialView("_Tables", checkTables(date,time,seats));
}
And finally the script(searchTable is a button near the fields. Their values are captured succesfully but load does not work)最后是脚本(searchTable 是字段附近的一个按钮。它们的值被成功捕获但加载不起作用)
$('#searchTable').click(function () {
var date = document.getElementById("datepicker").value;
var time = document.getElementById("time").value;
var seats = document.getElementById("seats").value;
alert(date);
//var data = JSON.stringify({
// 'date': date,
// 'time': time,
// 'seats': seats
//});
//$.ajax({
// type: "POST",
// url: '/Home/_Table/',
// data: data,
// dataType: "html",
// success: function (result) { success(result); }
//});
//function success(result) {
// alert(result);
// $("#tables").html(result);
// $("#tables").load("#tables")
//};
//$.ajax({
// url: "/Home/_Table",
// type: "GET",
// contentType: "application/json; charset=utf-8",
// data: data,
// success: function (data) {
// $('#target').html(data); // loading partialView into div
// }
//});
//$('#tables').load('@{ Html.RenderAction("_Tables", new { date = "' + date + '", time = "' + time + '", seats = "' + seats + '" });}');
$('#tables').load('@Url.Action("_Tables","Home")', { 'date': date, 'time': time, 'seats': seats });
alert(time);
//alert('@{ Html.RenderAction("_Tables", new { date = "' + date + '", time = "' + time + '", seats = "' + seats + '" });}');
});
I know the problem lies in my lack of understanding but i do not have the time to research ajax.我知道问题在于我缺乏了解,但我没有时间研究 ajax。 My internship is based on "figuring it out" under deadlines"
我的实习是基于在最后期限内“弄清楚”
I see a commented line in your code:我在您的代码中看到一条注释行:
$("#tables").html(result);
It's all you need.这就是你所需要的。 You should fill your div with all partial view html that returns from your controller.
您应该使用从控制器返回的所有局部视图 html 填充您的 div。
Suppose you have a div
with id
tables as假设您有一个带有
id
表的div
<div id="tables">
You can use the following method of appending the partial view content based on your paramters as您可以使用以下方法根据您的参数附加部分视图内容
$.ajax({
url: "/Home/_Tables?date=" + val + "&time="+ val +"&seats="+seats,
type: "POST",
cache: false,
success: function (result) {
$("#tables").empty();
$("#tables").html(result);
},
error: function () {
$("#tables").empty();
}
});
this will be the main view ajax function.and in the controller do the following这将是主要视图 ajax function.and 在 controller 中执行以下操作
public ActionResult _Tables(string date, string time,string seats)
{
// here you can provide model,any viewbag values etc to the partial view and you will get corresponding html result
return PartialView("Yourpartial ViewName");
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.