2016-04-06 3 views
0

Я рассмотрел варианты повторного выбора первого варианта выпадающего списка и включил код в свой код. Он работает в первый раз, когда я нажимаю кнопку «addRow», но не вторую или последующую «addRow». соответствующий кодПовторно выберите первый вариант выпадающего меню выбора после сохранения значения

$("#selectBox option:first-child").attr("selected", "selected"); 

Полные коды следующим образом:

<?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> 

Я хочу «переключатель», чтобы показать текст «выбрать часть» после того, как кнопка «addRow» была нажата. Это делается при первом нажатии, но не в дальнейшем. Есть идеи?

+1

Я не читал все, что код, но, чтобы выбрать первый вариант просто использовать 'selectedIndex' как' document.getElementById («переключателе»). SelectedIndex = 0' –

+0

Да! Это сработало. Большое спасибо @selvakumar – Geoff

+0

Рад, что это сработало. отправлен как ответ на закрытие. –

ответ

0

Вы можете установить selectedIndex в 0, чтобы выбрать первый вариант.

document.getElementById('selectBox').selectedIndex = 0 
Смежные вопросы