0
選択ドロップダウンの最初のオプションを再選択してコードに組み込んでみました。私は初めて "addRow"ボタンを押すが、2回目以降の "addRow"ボタンは押さない。関連するコードは値を保存した後、選択ドロップダウンメニューの最初のオプションを繰り返し再選択
$("#selectBox option:first-child").attr("selected", "selected");
フルコードで次のようにされています。私は「のAddRow」ボタンがクリックされた後のテキストは、「パートを選ぶ」と表示し、「選択ボックス」をしたい
<?php
$db = mysqli_connect("localhost",$username,$password,$database);
if($db->connect_errno > 0){
die('Unable to connect to database [' . $db->connect_error . ']');
}
$sql="SELECT part_id, part_code, part_descr FROM part";
$result = $db->query($sql);
if (!$result){
echo "no record found in the parts table";
}
$option = '<option value = "">select a part</option>';
while ($row = $result->fetch_assoc()) {
$option .= '<option value = "'.$row['part_id'].'">'.$row['part_code'].' '.$row['part_descr'].$row['part_id'].'</option>';
}
?>
<html>
<head>
<title>Test Drop Down Menu</title>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.0.3.js"></script>
</head>
<body >
<form id="form2" name="form2" method="post" enctype="multipart/form-data">
<div id="itemRows">
Quantity: <input type="text" name="add_qty" size="4" />
Part: <select id="selectBox" name="selectBox"
data-placeholder="Choose a Part..."
style="width:350px;" class="chosen-select"
onchange="storePartId();"
>
<?php echo $option; ?>
</select>
<input type="hidden" name="add_part_id" id='add_part_id' />
<input type="hidden" name="add_part_descr" id="add_part_descr" />
<input onClick="addRow(this.form);" type="button" value="Add row" />
(not saved until "Add row" clicked)
</div>
<input type="submit" name="next" value="submit report">
</form>
<script type="text/javascript">
var rowNum = 0;
function addRow(frm) {
rowNum ++;
var row = '<p id="rowNum'+rowNum+'">\n\
Quantity: <input type="text" name="qty[]" size="4" value="'+frm.add_qty.value+'" required> \n\
Part: <input type="text" name="part_descr[]" value="'+frm.add_part_descr.value+'" required> \n\
<input type="hidden" name="part_id[]" value="'+frm.add_part_id.value+'" required> \n\
<input type="button" value="Remove" onclick="removeRow('+rowNum+');"></p>';
jQuery('#itemRows').append(row);
frm.add_qty.value = '';
frm.add_part_descr.value = '';
frm.add_part_id.value = '';
$("#selectBox option:first-child").attr("selected", "selected");
}
function removeRow(rnum) {
jQuery('#rowNum'+rnum).remove();
}
function storePartId() {
var selectBox = document.getElementById("selectBox");
selectedValue = selectBox.options[selectBox.selectedIndex].value;
selectedText = selectBox.options[selectBox.selectedIndex].text;
if (selectedValue !== null){
document.getElementById("add_part_id").value = selectedValue;
document.getElementById("add_part_descr").value = selectedText;
} else {
document.getElementById("add_part_id").value = null;
document.getElementById("add_part_descr").value = null;
}
}
</script>
</body>
</html>
。最初にクリックされますが、それ以降はクリックされません。何か案は？
私はすべてそのコードを読んでいないが、ちょうど 'のdocument.getElementById（「選択ボックス」）として' selectedIndex'を使用する最初のオプションを選択する。selectedIndexの= 0 ' –
はい！それはうまくいった。ありがとう@selvakumar – Geoff
それはうまくいった。閉鎖のための答えとして掲示される。 –