1
これは私の初めてのスタックオーバーフローを使用しているので、書式中のエラーについてはお詫び申し上げます。選択肢ドロップダウンリストは生成された行で開かれません
データベース内にハザードと呼ばれる新しいオブジェクトを作成する行を生成し、ドロップダウンリストにSelectivityを使用しています。ここで私は、ドロップダウンリストのための私の見解を持っているものです。
@if (Model != null && Model.Count > 0)
{
int j = 0;
foreach (var i in Model)
{
var hazard = i.hazardID;
<tr>
<td>
<div class="form-groupcol-md-12">
<label class="control-label col-md-2" for="hazardID">Hazard</label>
<div class="col-md-10">
@Html.DropDownListFor(Model => Model[j].hazardID, hazardList, htmlAttributes: new { @class = "ddl ddlHazard" })
@Html.ValidationMessageFor(m => m[j].hazardID, "", new { @class = "text-danger" })
</div>
</div>
そしてここでは、ボタンがクリックされたとき、私は最後の行に&変更名などを複製するために使用しているjQueryのです：
$('body').on('click', '#addNew', function (e) {
e.preventDefault();
var $tableBody = $("#itemTable");
var $trLast = $tableBody.find("tr:last");
var $trNew = $trLast.clone();
var suffix = $trNew.find(':input:first').attr('name').match(/\d+/);
$trNew.find("td:last").html('<a href="#" class="remove glyphicon glyphicon-remove"></a>');
$trLast.find("td:last").html('');
$.each($trNew.find(':input'), function (i, val) {
//replace name
if (i != 1 && i!=4)
{
var oldN = $(this).attr('name');
var type = $(this).attr('type');
if (type != "file") {
var newN = oldN.replace('[' + suffix + ']', '[' + (parseInt(suffix) + 1) + ']');
$(this).attr('name', newN);
}
if (type == "text") {
if (i != 6)
$(this).val("");
}
else if (type == "file") {
$(this).val("");
}
$(this).removeClass("input-validation-error");
}
});
$.each($trNew.find('.text-danger'), function (i, val) {
var oldD = $(this).attr('data-valmsg-for');
var newD = oldD.replace('[' + suffix + ']', '[' + (parseInt(suffix) + 1) + ']');
$(this).attr('data-valmsg-for', newD);
});
$trLast.after($trNew);
//reassign validation
var form = $("form")
.removeData("validator")
.removeData("unobtrusiveValidation");
$.validator.unobtrusive.parse(form);
});
残念ながら、行を追加すると正常に見えますが、ドロップダウンリストをクリックしても何も起こりません。私は通常のドロップダウンリストを使用する（または生成された行なしでフォームを送信する）場合は正常に動作するので、私は間違って何をやっているのか分からない。
オリジナルDDL：
<div class="form-groupcol-md-12">
<label class="control-label col-md-2" for="hazardID">Hazard</label>
<div class="col-md-10">
<select class="ddl ddlHazard" data-val="true" data-val-number="The field Hazard must be a number." data-val-required="You must enter a hazard type" name="[0].hazardID" style="width: 100%; margin-bottom: 6px; display: none;">
<option value="3">Chemical Storage</option>
<option value="9">Eyewash</option>
<option value="10">First Aid Kit</option>
<option value="5">Flamming Storage</option>
<option value="2">Food spill</option>
<option value="4">Frayed Cords</option>
<option value="7">Gaurding</option>
<option value="1">Guard Missing</option>
<option value="6">Housekeeping</option>
<option value="11">Improper Wiring</option>
<option value="8">Pinch Points</option>
<option value="12">Other</option>
</select>
<div id="s9y_undefined" class="ddl ddlHazard selectivity-input" style="width:100%;margin-bottom:6px" data-name="[0].hazardID" tabindex="0">
<div class="selectivity-single-select">
<input class="selectivity-single-select-input" type="text">
<div class="selectivity-single-result-container">
<span class="selectivity-single-selected-item" data-item-id="3">
<a class="selectivity-single-selected-item-remove">
<i class="fa fa-remove"></i>
</a>Chemical Storage
</span>
</div>
<i class="fa fa-sort-desc selectivity-caret"></i>
</div>
</div>
<span class="field-validation-valid text-danger" data-valmsg-for="[0].hazardID" data-valmsg-replace="true"></span>
</div>
生成されたDDL：
<div class="form-groupcol-md-12">
<label class="control-label col-md-2" for="hazardID">Hazard</label>
<div class="col-md-10">
<select class="ddl ddlHazard" data-val="true" data-val-number="The field Hazard must be a number." data-val-required="You must enter a hazard type" name="[1].hazardID" style="width: 100%; margin-bottom: 6px; display: none;">
<option value="3">Chemical Storage</option>
<option value="9">Eyewash</option>
<option value="10">First Aid Kit</option>
<option value="5">Flamming Storage</option>
<option value="2">Food spill</option>
<option value="4">Frayed Cords</option>
<option value="7">Gaurding</option>
<option value="1">Guard Missing</option>
<option value="6">Housekeeping</option>
<option value="11">Improper Wiring</option>
<option value="8">Pinch Points</option>
<option value="12">Other</option>
</select>
<div id="s9y_undefined" class="ddl ddlHazard selectivity-input" style="width:100%;margin-bottom:6px" data-name="[0].hazardID" tabindex="0">
<div class="selectivity-single-select">
<input class="selectivity-single-select-input" type="text">
<div class="selectivity-single-result-container">
<span class="selectivity-single-selected-item" data-item-id="3">
<a class="selectivity-single-selected-item-remove">
<i class="fa fa-remove"></i>
</a>Chemical Storage
</span>
</div>
<i class="fa fa-sort-desc selectivity-caret"></i>
</div>
</div>
<span class="field-validation-valid text-danger" data-valmsg-for="[1].hazardID" data-valmsg-replace="true"></span>
</div>
選択性でインスタンス化され、ここで、それは場合に役立ちます新しい行が追加されると、HTMLです。 ddlクラス：
$(document).ready(function() {
$(".ddl").each(function() {
$(this).selectivity({
allowClear: true
});
});
});
$（this）.selectivity（ 'open'）を強制的に開こうとすると、Selectivityインスタンスを持たない要素のメソッドをコンソールから呼び出せないことがコンソールから伝えられます。どんな助けでも大歓迎です！
あなたは確かに、[選択]（HTTPSについて話）; ...このソリューションがテストされていません
：
注：
右
«var $trNew = $trLast.clone();後に、追加します。 io/selectivity /）...あなたが要素上でそれをどのように発覚させているかを示してください...そして、あなたがクローンされた要素上にそれをどのようにインスタンス化するか（ええと...あなたはそれをしなければなりません...）。 –