Page 1 of 1

Dropdown Value not setting on onChange

Posted: Sat Aug 07, 2010 4:02 pm
by Mahalko
Hello all,

I have a form which has a dropdown list, its values coming from a mysql database. Values show fine. One option is the 'other'-value, which, if selected, should bring up an empty text box where the user can fill in whatever they want.

This form should when loaded at first come up with previously filled in values that come from the database (it's part of your regular edit-profile-form).
With the code below, the page loads fine with the 'old' data in the dropdown, but when the user wants to update it with a new value, the onChange-function doesn't take this new value, but sticks to the 'old' value, whichever select-option I take.

What am I missing here?
PS. I'd like not to have to refresh the page for this to work..

Hope it's a bit clear - thanks for anyone trying to help me out!



Code: Select all

function jobtitle_other(sel) {

alert(document.getElementById("jobtitle").value);
	if(sel.value=="Other") { 
		document.getElementById("title_other").style.display = "inline";
	}
	else {
document.getElementById("title_other").style.display = "none";
	} 
}
....

<form method="post" name="editprofile1" action="<?php echo $_SERVER['PHP_SELF']; ?>">

....

<label for="jobtitle">Job Title:</label>

Code: Select all

<?php 
	$query = "SELECT jobtitle from tbl_dd_jobtitle";
	$result = mysqli_query($dbc, $query);
	echo "<select name=\"jobtitle\" value=\"$jobtitle\" onChange=\"jobtitle_other(this)\">Title";
	while ($row = mysqli_fetch_array($result)) {
		$value = $row["jobtitle"];
		$selected = (isset($jobtitle)&&$jobtitle==$value)? ' selected="selected"':'';
		echo("<option value=\"$jobtitle\"$selected>$value</option>");
	}
	echo "</select>";
	
?>
<br />
<input name="title_other" type="text" style="display: none;"><br />

Re: Dropdown Value not setting on onChange

Posted: Sat Aug 07, 2010 5:00 pm
by JakeJ
Unless you're going to use an ajax request to go get new data from the server (or store all the the possible data in arrays on that page), making a selection from the drop down box isn't going to change anything but what's displayed in the drop down.

There's lots of good tutorials out there on ajax select boxes.

Re: Dropdown Value not setting on onChange

Posted: Sat Aug 07, 2010 5:20 pm
by Mahalko
Hello Jake,

Thanks for your quick reply! I do get the correct data the first time from the server: the already existing database entry is being selected by the drop down box on loading the page

I'm sorry but I'm not sure I catch your drift here: I should POST the new selection back to the server on the onChange event, then have java GET this entry back to the page? (there's only one selection possible each time)

You mean through the getHTTPObject()? and onreadystatechange?

Re: Dropdown Value not setting on onChange

Posted: Sat Aug 07, 2010 5:37 pm
by JakeJ
Ok.. maybe I misunderstood what you were trying to say at first...

The way I understand it is... You have a select box and a form that both load fine. But, when you change the selection in the select box, you want the form data to update to match that selection. Correct?

If I'm understanding it right, ajax is still your best solution here without reloading the page. Pass the value of the select box back to the server, base your query on that and send the form back to your main page.

jquery actually makes this stuff pretty easy, it's an ajax framework.

Re: Dropdown Value not setting on onChange

Posted: Sun Aug 08, 2010 2:25 am
by Mahalko
You're right: when a selection has been changed, I need to capture the new value without reloading: from the moment 'Other' has been selected, a html input-textfield should become visible (to be able to describe more the 'other'). Then, a submit-button will send all this updated data to the database.
But even when selecting 'other', or any value other than the (correctly) 'old' selected one at page load, my form still believes it is this 'old' one..
I thought the onchange(this) would take the updated value to the javafunction for evaluation, but apparently it doesn't..
I'll see how far I get with the ajax - time for some reading again!
Thanks a lot!

Re: Dropdown Value not setting on onChange

Posted: Sun Aug 08, 2010 3:13 am
by JakeJ
Use jQuery and the forms plug in. It will make things a LOT easier.