[RESOLVED] Help with simple js onChange behavior

h4x0rmx

I'm working on a "form" class that lets me add fields dynamically to it.
I have a addDropDownBoxTest method that creates a drop-down box as its name says it:

	/**
	 * Adds a drop-down box to the current form
	 * @param string $elementId ID for the drop-down box
	 * @param string $label Label for the dp box
	 * @param Array $values
	 * @param Array $selected Selected values (Subset of $values)
	 * @param String $onChangeBehavior URL to forward the page to (i.e. 'users.php?id=' )
	 */
	public function addDropDownBoxTest($elementId, $label, $values, $selected = '', $onChangeBehavior = ''){ //...
}

I'm attaching a screenshot of my interface so you can understand it easier. When someone clicks on 'edit' the div with the red border is replaced by the contents of a php file (let's call it roles.php).
Inside roles.php I use the drop-down box to let the user view the "rights" of the roles and then click on ok. By clicking ok they will be changing the data on the DB, so I use the drop-down box so that they can navigate between "roles".
Everything works fine when I hard code the value of the variable to send to my js function, but I can't get it to read/know the value the user actually selected in the dd box.
I've tried different ways, but the following code is the one that I think is closest, except that ff's error console displays a "missing ) after argument list" error on the makerequest funciton.
This is what I have inside my addDropDownBoxTest method:

			if(!empty($onChangeBehavior)){ 
//				$tmp = 'onChange="makerequest(\'' . $onChangeBehavior .  7 . '\',\'details\');"'; //Works
				$tmp = 'onChange="makerequest(\'' . $onChangeBehavior . '\'+document.role_edit.role_edit_team_id.options[selectedIndex].value' . '\',\'details\');"';
				$this->html .= $tmp;
}

where role_edit = form's ID
role_edit_team_id = drop-down box's id
details = id of div to be replaced

Could anyone please help with this?
I will really appreciate it!

Res

The select input doesn't hold a value, it holds a reference to the selected option index. Your script isn't working because you are looking for value.

try this instead:

//you should be able to use 'this', but here is the correct way
//of getting the "value" of a select input
this.selectedIndex;
//vs the way you currently have it
this.value;

Unless you are attaching the event to the option tag, and not the select, there will be no data in value for the select box.

h4x0rmx

I'll give it a try tomorrow at work!
Thanks!

Res

No worries, happy to help. If it ends up being the solution to your problem, please remember to mark the thread as resolved. There is a drop down up top marked "Thread Tools" that has the option.

h4x0rmx

This is what I have:

//				$tmp = 'onChange="makerequest(\'' . $onChangeBehavior . '+document.role_edit.role_edit_team_id.options[selectedIndex].selectedIndex\',\'details\');"';
				$tmp = ' onChange="makerequest(\'' . $onChangeBehavior . '+this.selectedIndex\',\'details\');"';

and the output html is:

<select id="role_edit_team_id" name="role_edit_team_id" onChange="makerequest('inc/users.role.edit.php?id=+this.selectedIndex','details');">

which doesn't really do what I need it to do. It ignores my $onChangeBehavior value and it also sends "this.selectedIndex" instead of the actual selected Index. It does load the new page, but sending $_GET['id']='+selectedIndex'
Any ideas?

h4x0rmx

So, I have an idea of what my problem is, but I don't know how to fix it...
I'm trying concatenate a string with the selected value of the drop down box, but instead I'm concatenating only strings:

onChange="makerequest('inc/users.role.edit.php?id=this.value','details');"

I just don't know how to call makerequest and send it something like 'inc/users.role.edit.php?id={selectedValue}" where {selectedValue} is the value from one of the options in the drop down box. Is there a way to accomplish what I'm trying to do?

I was testing with something like:

		$this->html .= '<script type="text/javascript">
function alertselected(selectobj){
 alert(selectobj.value)
}
</script>';
$tmp = ' onChange="alertselected(this)"';

Where I would get an alert message, but only when loogink at the users.role.edit.php file by itself, not when it was inside the php file that called it.

Res

I think the qoutes might be messsed up, so the JS isn't getting parsed.

//old code
$tmp = ' onChange="makerequest(\'' . $onChangeBehavior . '+this.selectedIndex\',\'details\');"'; 

//new code, with qoutes
$tmp = ' onChange="makerequest(\'' . $onChangeBehavior . '\'+this.selectedIndex ,\'details\');"';

//js concatenating :
var word = 'my word';
var txt = "This"+word+" is the word";

h4x0rmx

NICE!!!
Thank you so much!!!