Member Avatar for zappan

Hi everyone,

I've an issue here. i want load the data from database and i want it appear at DOM select. what i had done,first i load data to hidden text and use a javascript load to DOM select. But the problem is i need to click on select textbox first before the data is appear and also other problem i can't select other option.here is my code.

PHP code.

<head><script type='text/javascript' src='script.js'></script></head>
<body>
<tr>
<td>
<input type='hidden' id='hiddenState' value='$custState' size='28'></td></tr>

<tr>
<td>
<select id='state' onClick='return retrieveOption();'>
<option value='apple'>Apple</option>
<option value='banana'>Banana</option>
<option value='car'>car</option>
<option value='mouse'>mouse</option>
</td>
</tr>
</body>

/#############################################

javascript code.

function retrieveOption(){
	  var var_State=document.getElementById("hiddenState").value;
	  var var_Option=document.getElementById("state");

	  for(var i=0;i<var_Option.length;i++){
	    if (var_Option[i].value==var_State)
	    {
			var var_Text=var_Option[i].text;
			var_Option[i].selected=true;
			
	    }
	  }
	}

thank you.

  • 2 Contributors
  • 2 Replies
  • 105 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by langsor
Member Avatar for zappan

Please someone help me....:S

Member Avatar for langsor

Let me get this straight, you want to update the values of your <select><options> using values you retrieve from a database -- based on what option your user selects from that <select> field initially? Is that correct?

If so, you might expand upon this code snippet to change the values of your select menu.
If you have the same number of new options as the original then it's easy, if you need to add or remove options depending on the results you get back you can also do that with DOM methods, or you can construct an entire new <select> input element with the new options and swap out the old with the new using either DOM methods or innerHTML method.

function retrieveOption () {
  var state = document.getElementById('state');
  for ( var i = 0; i < state.length; i ++ ) {
    if ( state[i].selected ) {
      // grab the new values here
      // example of updating one <option> value
      state[i].value = 'pizza';
      state[i].firstChild.nodeValue = 'Pizza';
    }
  }
}

Please clarify your problem some more if you need more help.

Thanks

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.