Я использую бритву asp.net mvc 4, и у меня есть основное представление с несколькими флажками и кнопкой отправки. Эти флажки указывают задачи, которые необходимо выполнить. Пользователь выбирает задачи для выполнения с помощью флажков, а затем запускает процесс, нажав кнопку отправки. У меня есть блок div, на который я хочу поместить ход действия в контроллере, задачи, которые они выполняют в данный момент.
После нажатия кнопки отправки я хочу запустить первый скрипт (основной), а затем выполнить следующие задачи.
Проблема в том, что первый основной скрипт, который затем последовательно вызывает остальные, не вызывается.
Я использую ASP.NET MVC4.
Под кодом.
Вид:
@using (Html.BeginForm(
"PerformTasks", "Tests", FormMethod.Post,
htmlAttributes: new { id = "frm" }))
{
(...)
@Html.CheckBoxFor(m => m.task01)<span>Task 1</span><br />
@Html.CheckBoxFor(m => m.task02)<span>Task 2</span><br />
(...)
<input type="submit" value="Do Tasks" />
<div id="divStatus">
</div>
}
<script>
// First ajax script
$("#frm").submit(function (event) {
$("#frm").validate();
if ($("#frm").valid()) {
$.ajax({
url: "/Tests/PerformTasks/",
type: 'POST',
data: $("#frm").serialize(),
success: function() {
perFormTask1();
},
beforeSend: function() {
$("#divStatus").append('<br/>Begginig tasks...<br/>');
}
});
event.preventDefault();
}
});
// second ajax script
function performTask1() {
$.ajax({
url: "/Tests/Task1/",
type: 'POST',
data: $("#frm").serialize(),
success: function() {
$("#divStatus").append('Task1 completed.<br/>');
perFormTask2();
},
beforeSend: function() {
$("#divStatus").append('<br/>Begginig task 1...<br/>');
}
});
};
function performTask2() {
$.ajax({
url: "/Tests/Task2/",
type: 'POST',
data: $("#frm").serialize(),
success: function() {
$("#divStatus").append('Task2 completed.<br/>');
},
beforeSend: function() {
$("#divStatus").append('<br/>Begginig task 2...<br/>');
}
});
};
</script>
Контроллер (TestsController.cs в папке \Controllers):
public class TestsController : Controller
{
[HttpPost]
public ActionResult PerformTasks(ViewModel model)
{
// Nothing to do here, tasks are done individually in the methods below.
// To stay in the same page after submit button is clicked
return Redirect(this.Request.UrlReferrer.AbsolutePath);
}
[HttpPost]
public ActionResult Task1(ViewModel model)
{
// Task 1 should be done if checkbox in the main view is checked, otherwise not.
bool doTask1 = model.task01;
if (doTask1 )
{
// Do some stuff
}
// To stay in the same page after submit button is clicked
return Redirect(this.Request.UrlReferrer.AbsolutePath);
}
[HttpPost]
public ActionResult Task2(ViewModel model)
{
// Task 2 should be done if checkbox in the main view is checked, otherwise not.
bool doTask2 = model.task02;
if (doTask2)
{
// Do some stuff
}
// To stay in the same page after submit button is clicked
return Redirect(this.Request.UrlReferrer.AbsolutePath);
}
}
Модель представления:
public class ViewModel
{
public bool task01{ get; set; }
public bool task02{ get; set; }
}
У меня есть следующие проблемы:
- Я должен поставить вместо потому что, если нет, я получаю сообщение об ошибке javascript '$' не определен
- этот скрипт $("#frm").submit(function (event) { ... // body ... } не выполняется, поэтому ни остальные действия на этом не завершаются. Таким образом, завершение события первого скрипта не достигается.
Примечание. Я проверил, что действие PerformTasks в контроллере выполняется. Другие действия Task1, Task2 на контроллере не достигаются. В сценариях вместо успеха я пробовал завершить, но безуспешно. Также я попытался заменить ActionResult в действиях, контролируемых JsonResult, и вернуть return Redirect(...) для возврата Json(""), но также безуспешно.
Похоже, что обработчик событий Javascript не перехватывает отправку формы.
Любые идеи?
Сгенерированный код:
<form action="/Tests/PerformTasks" id="frm" method="post"><fieldset style="margin-top:20px;margin-left:0px;float:left;">
....
<input type="submit" value="Execute" />
...
<div id="divStatus"></div>
...
</form>
а затем под скриптами:
<script src="/Scripts/jquery-1.7.1.min.js" type="text/javascript">
alert("Within Script");
$("#frm").submit(function (event) { .. });
...
</script>
Скрипты такие же, как здесь.