Set the Dropdown box as selected in Javascript
I am using Javascript in my app. In my table, I have a column named industry
which contains value like
id 69
name :aruna
username :aruna
email :artkjnjkn@sf.sd
password: bd09935e199eab3d48b306d181b4e3d1:i0ODTgVXbWyP1iFOV
type : 3
industry: | Insurance | Analytics | EIS and Process Engineering
actually this industry value is inserted from a dropdown box multi select..
now i am trying like on load to make my form as to contain these values
where industry is dropdown box
<select id="ind1" moslabel="Industry" onClick="industryfn();"mosreq="0" multiple="multiple" size="3" class="inputbox" name="industry1[]">'+
<option value="Banking and Financial Services">Banking and Financial Services</option>
<option value="Insurance">Insurance</option>
<option value="Telecom">Telecom</option>
<option value="Government ">Government </option>
<option value="Healthcare & Life sciences">Healthcare & Life sciences</option>
<option value="Energy">Energy</option>
<option value="Retail &Consumer products">Retail &Consumer products</option>
<option value="Energy, resources & utilities">Energy, resources & utilities</option>
<option value="Travel and Hospitality">Travel and Hospitality</option>
<option value="Manufacturing">Manufacturing</option>
<option value="High Tech">High Tech</option>
<option value="Media and Information Services">Media and Information Services</option>
</select>
How to keep the industry values(| Insurance | Analytics | EIS and Process Engineering ) 开发者_开发百科as selected?
EDIT: Window.onDomReady(function(){ user->get('industry'); $s=explode('|', $str) ?>
var selectedFields = new Array();
<?php for($i=1;$i<count($s);$i++){?>
selectedFields.push("<?php echo $s[$i];?>");
<?php }?>
for(i=1;i<selectedFields.length;i++)
{
var select=selectedFields[i];
for (var ii = 0; ii < document.getElementById('ind1').length; ii++) {
var value=document.getElementById('ind1').options[ii].value;
alert(value);
alert(select);
if(value==select)
{
document.getElementById('ind1').options[ii].selected=selected;
}//If
} //inner For
}//outer For
</script>
i have tried the above the alert functions are working correctly. But the if loop didnt works correctly .. Why so ..Please help me....
Explode selected values into an array, make a foreach cycle to run through all options of your select and if those values match, just put there selected="selected".
Example:
Javascript / PHP:
<script type="text/javascript">
Array.prototype.in_array = function( p_val ) {
for(var i = 0, l = this.length; i < l; i++) {
if(this[i] == p_val) {
return true;
}
}
return false;
}
// Swap this for normal onDomReady if you don't use jQuery
$(document).ready( function() {
<?php
$selected_from_db = "Insurance|Analytics|EIS and Process Engineering|Telecom";
$selected = explode( "|", $selected_from_db );
?>
var selected_fields = new Array();
<?php
foreach ( $selected as $key => $value ) {
?>
selected_fields.push("<?php echo $value;?>");
<?php
}
?>
var ind_dropdown = document.getElementById( "ind1" );
for ( var i = 0; i < ind_dropdown.length; i++ )
{
if ( selected_fields.in_array( ind_dropdown.options[ i ].text ) ) {
ind_dropdown.options[ i ].setAttribute( "selected", "selected" );
}
/*var select=selectedFields[i];
for (var ii = 0; ii < document.getElementById('ind1').length; ii++) {
var value=document.getElementById('ind1').options[ii].value;
alert(value);
alert(select);
if(value==select)
{
document.getElementById('ind1').options[ii].selected=selected;
}
}*/
}
});
</script>
HTML:
<body>
<select id="ind1" name="industry[]" multiple="multiple" size="5">
<option value="Banking and Financial Services">Banking and Financial Services</option>
<option value="Insurance">Insurance</option>
<option value="Telecom">Telecom</option>
<option value="Government ">Government </option>
<option value="Healthcare & Life sciences">Healthcare & Life sciences</option>
<option value="Energy">Energy</option>
<option value="Retail &Consumer products">Retail & Consumer products</option>
<option value="Energy, resources & utilities">Energy, resources & utilities</option>
<option value="Travel and Hospitality">Travel and Hospitality</option>
<option value="Manufacturing">Manufacturing</option>
<option value="High Tech">High Tech</option>
<option value="Media and Information Services">Media and Information Services</option>
</select>
</body>
I don't recommend mixing PHP and Javascript code tho. It's way too messy and hard to maintain. I'd recommend you to parse these data either on server side (PHP) or client side (AJAX).
精彩评论