[英]Call view with ajax javascript in ASP.NET MVC
I want to call Action
to open up my Index View
by Ajax Javascript, but it does not load target view. 我想调用
Action
来通过Ajax Javascript打开Index View
,但是它不会加载目标视图。 Before I use ajax I called action like this that work properly: 在使用ajax之前,我这样调用了可以正常工作的动作:
<a class="btn btn-orange" href="@Url.Action("Index", "Booking", new { area = "Portal" })">انتخاب</a>
But I need to call with javascript Ajax and when I transfer that to this : 但是我需要用javascript Ajax调用,当我将其转移到此时:
<a class="btn btn-orange" onclick="Booking(@Json.Encode(item))">انتخاب</a>
I faced this problem that it does not load page. 我遇到了无法加载页面的问题。 This is my ajax code:
这是我的ajax代码:
function Booking(obj) {
var schedulingViewModel = {
};
for (var key in obj) {
if (obj.hasOwnProperty(key)) {
schedulingViewModel[key] = obj[key];
}
}
$.ajax({
url: '/Portal/Booking',
type: 'post',
data: schedulingViewModel,
success: function (data) {
alert('Data: ' + data);
},
error: function (request, error) {
alert("Request: " + JSON.stringify(request));
}
});
}
And this s my BookingController: 这是我的BookingController:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using Tranship.ViewModel;
namespace Tranship.UI.Areas.Portal.Controllers
{
public class BookingController: Controller
{
[HttpPost]
public ActionResult Index(ScheduleViewModel schedulingViewModel)
{
return View("Index", schedulingViewModel);
}
}
}
This is my view with IEnumerable model that I want to send an Item of that to action: 这是我对IEnumerable模型的看法,我希望将其发送给行动:
@model IEnumerable<Tranship.ViewModel.ScheduleViewModel>
<div class="pg-search-form">
@foreach (var item in Model)
{
<div class="list-block main-block f-list-block dashboard-listing booking-listing">
<div class="list-content">
<table class="table table-hover">
<tbody>
<tr>
<td class="dash-list-icon booking-list-date">
<div class="b-date">
<h3>@item.DepartureDay</h3>
<p>@item.DepartureMonth</p>
</div>
</td>
<td class="dash-list-text booking-list-detail">
<h3>@item.Origin به @item.Destination</h3>
<ul class="list-unstyled booking-info">
<li>@item.DepartureDate<span>تاریخ رفت :</span></li>
<li>@item.ArrivalDate<span>تاریخ برگشت :</span></li>
<li>@item.Adult نفر<span>تعداد :</span></li>
</ul>
</td>
<td class="dash-list-btn">
<a class="btn btn-orange" onclick="BookingMethod(@Json.Encode(item))">انتخاب</a>
@*<button type="submit" class="btn btn-orange">انتخاب</button>*@
@*<a class="btn btn-orange" href="@Url.Action("Index", "Booking", new { area = "Portal" })">انتخاب</a>*@
<div id="price">@item.Price تومان</div>
</td>
</tr>
</tbody>
</table>
</div>
<!-- end list-content -->
</div>
}
<div class="pages">
<ol class="pagination">
<li><a href="#" aria-label="Previous"><span aria-hidden="true"><i class="fa fa-angle-left"></i></span></a></li>
<li class="active"><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#" aria-label="Next"><span aria-hidden="true"><i class="fa fa-angle-right"></i></span></a></li>
</ol>
</div>
<!-- end pages -->
</div>
In fact ajax return correct HTML but I couldn't find why it does not redirect to target view. 实际上,ajax返回正确的HTML,但是我找不到为什么它不重定向到目标视图的原因。
window.location()
is used to redirect from one page to another page. window.location()
用于从一个页面重定向到另一页面。
After Successful ajax request write that code. 在成功的ajax请求之后,编写该代码。
$.ajax({
url: '/Portal/Booking',
type: 'post',
data: schedulingViewModel,
success: function (data) {
alert('Data: ' + data);
window.location = "/Booking/Index";
},
error: function (request, error) {
alert("Request: " + JSON.stringify(request));
}
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.