我有一個將輸入添加到option-container div.
當我提交表單時，只有1個選項被添加到資料庫中，并且ID資料庫中的 也顯示為0. 這就是我所擁有的：
index.cshtml
@model AoTWiki.Models.DB.PollModel
...
<div class="form-group row">
<h4 class="col-4 col-form-label text-light">Options <button id="addNewOptionBtn" class="btn btn-primary"> </button></h4>
<div class="col-8">
<div class="option-container">
</div>
</div>
</div>
<hr />
<div class="form-group row">
<div class="col-8 offset-4">
<div class="row">
<div class="col">
<a asp-action="index" asp-controller="home" class="btn btn-warning text-white form-control">Cancel</a>
</div>
<div class="col">
<button type="submit" class="btn btn-success form-control">Create Poll</button>
</div>
</div>
</div>
</div>
@section Scripts
{
<script>
$("document").ready(function() {
$("#addNewOptionBtn").click(function(e) {
e.preventDefault();
var count = $(".options").length;
var newOption = "<input name='PollOptions[" count "].OptionId' value='" count "' /><input name='PollOptions[" count "].Option' placeholder='Option' /><br/><br/>";
$(newOption).appendTo(".option-container");
})
});
</script>
<partial name="_ValidationScriptsPartial" />
}
PollController.cs
[HttpPost]
public ActionResult add(PollModel poll)
{
if (ModelState.IsValid)
{
if (poll != null)
{
_mongo.ConnectToMongo<PollModel>("polls").InsertOne(poll);
}
}
return RedirectToAction("index", "home");
}
PollModel.cs
[BsonId]
public ObjectId Id { get; set; }
public int PollId { get; set; }
public string? PollTitle { get; set; }
public IEnumerable<PollOptionModel>? PollOptions { get; set; }
public DateTime? CreatedAt { get; set; }
public bool IsActive { get; set; }
PollOptionModel.cs
[BsonId]
public ObjectId Id { get; set; }
public int OptionId { get; set; }
public string? Option { get; set; }
這是資料庫的樣子：
編輯：
這就是除錯所顯示的。我做了3 個選項，然后按了提交。
另外值得一提的是，即使 Id 中的值input也是0，IE this，如果我沒記錯的話，它應該根據 JS 遞增：
uj5u.com熱心網友回復：
看起來我們忘記用 div 包裹我們的輸入欄位了。因此，只有 0 被回傳var count = $(".options").length;。
請參閱下面的更新腳本，var new option = "<div class='options'><input..."
<script>
$("document").ready(function() {
$("#addNewOptionBtn").click(function(e) {
e.preventDefault();
var count = $(".options").length;
var newOption = "<div class='options'><input name='PollOptions[" count "].OptionId' value='" count "' /><input name='PollOptions[" count "].Option' placeholder='Option' /><br/><br/></div>";
$(newOption).appendTo(".option-container");
})
});
</script>
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/429163.html
標籤：javascript C＃ 网 asp.net-mvc