Ishrat Jahan Ishrat Jahan - 3 months ago 10
PHP Question

PHP with document.getElementById for to values in option tag

I want to take the value of 'id' from option tag .... How can I edit function. Every time I run it it gives id info but I want to show price info

how can i edit

var sel = document.getElementById('proID');


this line please suggest me help

<tr>
<td><label> Product : </label></td>
<td>
<select id="proID" name="proID" >
<option>Select Product</option>
<?php
$getProId = $pi->getAllProd();
foreach($getProId as $pi){
?>
<option value="<?php echo $pi['proID'] ;?>" id="<?php echo $pi['proUPrice'];?>"><?php echo $pi['proName'] ;?></option>
<?php } ?>
</select>
<input type="text" size="30" name="display" id="display" />
<p>
<input type="button" id="showVal" value="Value Property" />
</p>
</td>
</tr>
<script>(function() {

// get references to select list and display text box
var sel = document.getElementById('proID');
var el = document.getElementById('display');


function getSelectedOption(sel) {
var opt;
for ( var i = 0, len = sel.options.length; i < len; i++ ) {
opt = sel.options[i];
if ( opt.selected === true ) {
break;
}
}
return opt;
}

// assign onclick handlers to the buttons
document.getElementById('showVal').onclick = function () {
el.value = sel.value;
}

}());</script>

Answer

Here is pure javascript solution to get id of selected option id.

select = document.getElementById('proID');
var selectedOpt = select.options[select.selectedIndex];
alert(selectedOpt.id); 

Here is fiddle https://jsfiddle.net/1n9u8782/1/

Comments