您遇到了麻煩，因爲您希望將表單放入模式中，而您已將一個操作鏈接放到另一個具有表單的頁面上。您必須從不需要的頁面複製表格並將其粘貼到模態的主體中。那麼當你在這裏提交表單時，它會觸發你的表單在你的控制器中指向的動作，這個動作將處理表單數據並返回一個視圖，也就是刷新頁面。所以你應該編輯你的表單動作來重定向到索引視圖或watever視圖，它有這個模式。正如你所說你正在考慮使用Ajax，可能是因爲你不想刷新頁面。無論如何，我會在這裏製作一個模擬表單，因爲我不知道你的表單看起來像什麼或者你的HttpPost動作。附：我正在打電話。
重新開始。
// here is a button which will open up the modal. forget about using an actionlink to do this.
<button type="button" class="btn btn-info btn-lg" data-toggle="modal" data- target="#myModal">Create New</button>
//here is a functioning modal
<div id="myModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Create Something</h4>
</div>
//wrap your modal-body and your modal- footer in a form. You can copy the begin form from your other page. You may have problems here because if this is a scaffolded crud that form most likely uses another model(not modal) which you return to it from an action. What you can do is make an html form and name your inputs correctly and post it to your action.
<form action="/ControllerName/ActionName" method="post">
<div class="modal-body">
First name: <input type="text" name="fname"> <br>
Last name: <input type="text" name="lname"><br>
</div>
<div class="modal-footer">
<a class="btn btn-default" data-dismiss="modal">Close</a>
<input type="submit" class="btn btn-success pull-right" value="Save">
</div>
</form>
</div>
</div>
</div>
提交輸入將提交您的表單並對您在url中指定的操作進行發佈。這實際上與書寫相同：
@using (Html.BeginForm("ActionName", "ControllerName", FormMethod.Post,
new { enctype = "multipart/form-data" }))
{
<div class="modal-body">
First name: <input type="text" name="fname"> <br>
Last name: <input type="text" name="lname"><br>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<input type="submit" class="btn btn-success pull-right" value="Save">
</div>
}
我不知道您是否需要驗證摘要或反僞造令牌。你必須檢查你想複製的表格。
那麼你的行動將是這個樣子：
public class ControllerName : Controller
{
public ActionResult Index()
{
// Add action logic here
return View();
}
[HttpPost]
public ActionResult ActionName(string fname, string lname)
{
// do something with fname and lname. Thenaming of your html inputs and the parameters you recieve here are important. If the post action has a required parameter that you do not post it will give you a 404 or something.
//redirec to whatever page has the modal on
return View("Index")
}
}
答案編輯：
所以對於你的情況，我建議忘記回傳一種模式的創建形式。它將模型返回到創建頁面的原因是，如果某人填寫了表單並且保存時出錯，則該操作將返回該對象與用戶填寫的所有字段，以便他不必填寫再次出來。你可以在表單的HttpPost動作中看到這一點。當你最初創建一個條目時，你不需要一個模型，但是因爲你始終將所有的字段都設爲空。 （僅供參考 - 您應該意識到顯然需要將模型返回到「編輯」頁面，因爲您正在編輯已經保存在數據庫中的值..）所以這是您的選擇 - 如果您想返回字段已經填寫回頁面如果保存失敗，你將不得不使用視圖模型。否則，你可以製作一個標準的HTML表單，併發布到你的行動。我可以在這裏做一個例子。
這是您的形式：
@using (Html.BeginForm("Create", "ControllerName", FormMethod.Post,
new { enctype = "multipart/form-data" }))
{
@Html.AntiForgeryToken()
<div class="modal-body">
First name: <input type="text" name="FirstMidName"> <br>
Last name: <input type="text" name="lname"><br>
//do you need a date picker here????
Enrollment Date: <input type="text" name="EnrollmentDate"><br>
Payment Due: <input type="text" name="PaymentDue"><br>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<input type="submit" class="btn btn-success pull-right" value="Save">
</div>
}
這裏是你的控制器：
[Authorize(Roles = "Admin")]
[ValidateAntiForgeryToken]
[HttpPost]
public ActionResult Create(string LastName, string FirstMidName, string EnrollmentDate, string PaymentDue)
{
// If you do not have validation on the front end you at tge very least need to put some null checks here based on you required fields. I remover the model state check as we are not passing through a model anymore. So:
if (FirstMidName != ""){
try
{
Student student = new Student();
student.LastName = LastName;
student.FirstMidName = FirstMidName;
//you need to handle how this date is parsed here
student.EnrollmentDate =DateTime.Parse(EnrollmentDate);
//if this is a bool you may need to do some logic here depending on what values your form gives you. Maybe if (PaymentDue == "checked"){student.PaymentDue = true} else { student.PaymentDue = false}
//if payment due is monetry value you must be very catefull about the way you parse decimals/floats with the decimal point and culturr information. You will need to do some research here.
student.PaymentDue = PaymentDue;
studentRepository.InsertStudent(student);
studentRepository.Save();
return RedirectToAction("Index");
}
}
catch (DataException /* dex */)
{
//Log the error (uncomment dex variable name after DataException and add a line here to write a log.
ModelState.AddModelError(string.Empty, "Unable to save changes. Try again, and if the problem persists contact your system administrator.");
}
}
//see i removed the old return view with a model here which was incase there was a problem saving.
return RedirectToAction("Index") ;
}
那是一個粗略的想法。即時typin在我的手機哈哈。我建議複製現有創建表單中的所有驗證元素，並將其粘貼到新的表單模式中，如果存在驗證摘要（包括驗證摘要）。您可以在Chrome中打開現有表單並右鍵單擊以查看頁面源，然後從表單中複製呈現的表單的HTML，以便您不會丟失任何現有的驗證和輸入。但如果你喜歡，請保留@ html.Beginform和antiforgerytoken。 Alyernatively你shoild使用視圖模型，我不敢打字現在！
感謝您的信息。我對jQuery和AJAX非常陌生，我正試圖讓自己的頭腦清楚。如果我需要使用jQuery來創建模式彈出窗口，它是否會改變你在帖子中的佈局格式？ – Truecolor
不，只要您在頁面上正確設置了表單，如果您使用jquery或默認引導，則無關緊要。但是我會建議使用默認引導模式，它工作正常。另請注意，我編輯了模式上的關閉按鈕，因爲您放入表單中的按鈕將進行提交。所以我會把它改成一個錨點。 – Harry
正如你所提到的那樣，它使我在使用模態體部分的開始表單時遇到問題，因爲我無法在視圖中使用多個模型引用。當我嘗試創建一個正常的html表單時，我無法創建驗證器或AntiForgery。 – Truecolor