Ajax 返回一个视图,但它没有使用 mvc4 显示
Ajax Returning a view but it is not showing using mvc4
csHtml代码
第一个 Foreach 循环是创建食品类别列表的动态菜单。
第二个 Foreach 循环正在显示产品 onclick 动态菜单。
@foreach (var i in Model.Foods)
{
<a href="#" id="@i.FoodList" class="@i.FoodList" onclick="test(this.id)" >@i.FoodList</a>
}
@foreach (var j in Model.Products)
{
<div class="card col-lg-2">
<a href="../Home/ProductDetails">
<img src="~/Images/@j.Images" class="card-img-top" alt="...">
<div class="card-body">
<p class="card-text ProName">@j.Product_Name</p>
<p class="card-text ProOrder">Min. Order : @j.Min_Order</p>
</div>
</a>
</div>
}
脚本
在这个脚本中,我获取动态菜单的值并发送到控制器。
function test(ids) {
document.getElementById("myNav").style.width = "0%";
var x = ids;
alert(ids + "---" + x)
$.ajax({
type: 'POST',
//url: "/Home/ProductList",
url: '@Url.Action("ProductList")',
dataType: 'html',
UpdateTargetId: 'loads',
data: {
Id: x,
},
success: function (status) {
console.log('Send');
//$("#loads").load(" #loads");
$("#loads").empty();
$("#loads").html(status);
},
error: function () {
console.log('something went wrong - debug it!');
}
});
}
控制器
public ActionResult ProductList(string Id)
{
DemoProjectEntities DPE = new DemoProjectEntities();
var data = new MasterDetails
{
Products = DPE.Products.Where(a => a.Category == Id).ToList(),
Foods = DPE.Foods.ToList()
};
return View(data);
}
让我知道这种情况下的问题是什么??
脚本
function test(ids) {
document.getElementById("myNav").style.width = "0%";
var x = ids;
//alert(ids + "---" + x)
$.ajax({
type: 'POST',
url: '@Url.Action("ProductList1")',
dataType: 'html',
UpdateTargetId: 'loads',
data: {
Id: x,
},
success: function (status) {
console.log('Send');
$("#loads").html(status);
},
error: function () {
console.log('something went wrong - debug it!');
}
});
}
控制器
public ActionResult ProductList()
{
DemoProjectEntities DPE = new DemoProjectEntities();
var data = new MasterDetails
{
Foods = DPE.Foods.ToList(),
//Products = DPE.Products.Where(a => a.Category == Id).ToList()
};
return View(data);
}
public string ProductList1(string Id)
{
DemoProjectEntities DPE = new DemoProjectEntities();
StringBuilder s = new StringBuilder();
var Products = DPE.Products.Where(a => a.Category == Id).ToList();
foreach (var j in Products)
{
s.Append("<div class='card'>");
s.Append("<a href='../Home/ProductDetails' id=" + j.Product_Name + " onclick='getProName(this.id)'>");
s.Append("<img src='/Images/" + j.Images + "' class='card-img-top' alt='...'/>");
s.Append("<div class='card-body'>");
s.Append(string.Format("<p class='card-text ProName'>{0}</p>", j.Product_Name));
s.Append(string.Format("<p class='card-text ProOrder'>Min. Order : {0}</p>", j.Min_Order));
s.Append("</div>");
s.Append("</a>");
s.Append("</div>");
}
return s.ToString();
}
csHtml代码
第一个 Foreach 循环是创建食品类别列表的动态菜单。 第二个 Foreach 循环正在显示产品 onclick 动态菜单。
@foreach (var i in Model.Foods)
{
<a href="#" id="@i.FoodList" class="@i.FoodList" onclick="test(this.id)" >@i.FoodList</a>
}
@foreach (var j in Model.Products)
{
<div class="card col-lg-2">
<a href="../Home/ProductDetails">
<img src="~/Images/@j.Images" class="card-img-top" alt="...">
<div class="card-body">
<p class="card-text ProName">@j.Product_Name</p>
<p class="card-text ProOrder">Min. Order : @j.Min_Order</p>
</div>
</a>
</div>
}
脚本
在这个脚本中,我获取动态菜单的值并发送到控制器。
function test(ids) {
document.getElementById("myNav").style.width = "0%";
var x = ids;
alert(ids + "---" + x)
$.ajax({
type: 'POST',
//url: "/Home/ProductList",
url: '@Url.Action("ProductList")',
dataType: 'html',
UpdateTargetId: 'loads',
data: {
Id: x,
},
success: function (status) {
console.log('Send');
//$("#loads").load(" #loads");
$("#loads").empty();
$("#loads").html(status);
},
error: function () {
console.log('something went wrong - debug it!');
}
});
}
控制器
public ActionResult ProductList(string Id)
{
DemoProjectEntities DPE = new DemoProjectEntities();
var data = new MasterDetails
{
Products = DPE.Products.Where(a => a.Category == Id).ToList(),
Foods = DPE.Foods.ToList()
};
return View(data);
}
让我知道这种情况下的问题是什么??
脚本
function test(ids) {
document.getElementById("myNav").style.width = "0%";
var x = ids;
//alert(ids + "---" + x)
$.ajax({
type: 'POST',
url: '@Url.Action("ProductList1")',
dataType: 'html',
UpdateTargetId: 'loads',
data: {
Id: x,
},
success: function (status) {
console.log('Send');
$("#loads").html(status);
},
error: function () {
console.log('something went wrong - debug it!');
}
});
}
控制器
public ActionResult ProductList()
{
DemoProjectEntities DPE = new DemoProjectEntities();
var data = new MasterDetails
{
Foods = DPE.Foods.ToList(),
//Products = DPE.Products.Where(a => a.Category == Id).ToList()
};
return View(data);
}
public string ProductList1(string Id)
{
DemoProjectEntities DPE = new DemoProjectEntities();
StringBuilder s = new StringBuilder();
var Products = DPE.Products.Where(a => a.Category == Id).ToList();
foreach (var j in Products)
{
s.Append("<div class='card'>");
s.Append("<a href='../Home/ProductDetails' id=" + j.Product_Name + " onclick='getProName(this.id)'>");
s.Append("<img src='/Images/" + j.Images + "' class='card-img-top' alt='...'/>");
s.Append("<div class='card-body'>");
s.Append(string.Format("<p class='card-text ProName'>{0}</p>", j.Product_Name));
s.Append(string.Format("<p class='card-text ProOrder'>Min. Order : {0}</p>", j.Min_Order));
s.Append("</div>");
s.Append("</a>");
s.Append("</div>");
}
return s.ToString();
}