asp.net mvc 4 razor を使用しており、いくつかのチェックボックスと送信ボタンがあるメイン ビューがあります。これらのチェックボックスは、実行するタスクを示します。ユーザーはチェックボックスで実行するタスクを選択し、送信ボタンをクリックしてプロセスを開始します。
送信ボタンがクリックされると、このビューに関連付けられたコントローラーが呼び出されます。コントローラー内で次のことを行います。
1) テキストエリアを持つ別のビューを開きます。2)コントローラーがユーザーが選択したタスクを実行している間に、開いたばかりの新しいビューのテキストエリアを更新したい(ステップ1)。3) コントローラーがタスクを終了したら、開いたばかりの新しいビュー (ステップ 1) にとどまり、ボタンを介してユーザーの操作を待ちます (前のメイン ビューに戻ります)。
注: テキストエリアの更新は同期的です。
例えば：
コントローラ：
public ActionResult PerformTasks(ViewModel model)
{
// model contains the values of the checkboxes. With this I know which tasks to perform.
UpdateTextArea("Beginning tasks...");
// ##### Do first task
UpdateTextArea("Doing task #1...");
// Do some stuff for task #1
// ##### Do second task
UpdateTextArea("Doing task #2...");
// Do some stuff for task #2
(...)
// ##### Doing last task
UpdateTextArea("Doing task #N...");
// Do some stuff for task #N
UpdateTextArea("Tasks completed.");
// At the end of the process, new view just opened with contains the textarea
// must remain to user action.
return ¿?
}
開いたばかりの新しいビューのテキストエリアの出力は次のようになります。
- Textarea content at the end of the process -
Beginning tasks...
Doing task #1...
Doing task #2...
Doing task #3...
...
Doing task #N...
Tasks completed.
どうすればこれを簡単に行うことができますか？この Web アプリは非常に小さいため、サードパーティのフレームワークは使用したくありません。
簡単にするために、別の異なる新しいビューではなく、同じメイン ビューにテキストエリアを配置できます。
最初の試み ( AminSaghiソリューション):
現在、メイン ビューには次の側面があります (2 つのタスクに簡略化されています): (実装しようとするときは、最後に私の問題を参照してください)
@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 type="text/javascript">
// 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>
コントローラー (\Controllers の下の TestsController.cs):
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; }
}
私が理解していないことと、どうすればよいかわかりません:
1.- Once submit button is clicked, how to launch first ajax script in order to start the tasks sequence?
2.- Action PerformTasks as I understand should be leave empty, only return to the same page line should be put, am I right, because it
only launches the others in the ajax script.
3.- What is #frm in the ajax script? should i replace with something?
4.-I think for the last task, in this case task 2, is not necessary to do another ajax script as this is the last, Am I right?
5.-If some task fails, for example task 1, below tasks should be done, in this case task 2. How to do this?
6.-For each task I should pass some data, the status of all checkboxes and the within each action in the controller check if
this task has been checked to be done. If so, task is performed, if
not, task is not performed. How to pass this data to tasks, 1 and 2?
through data element in ajax?