please help w/ javascript function

[slamMan]

I am weak in javascript mojo and need some help. I have a drop down select box that is customized to look like a button. The box is hidden till the button is clicked then the drop down appears. The text on the button is defined by a span tag. I need a javascript function to find out what item is selected in the drop down and then output the text from that item to the span tag. I think  I would do this by calling a function through an onchange event on the select box element. The box already has another inline onchange element being called, so I now believe I need to also re-write those calls inside the function.

 

The problem is I am not comfortable re-writing the existing code as there are a few elements involved i.e. html code and php variables. Help would be greatly appreciated.

 

The current Code:

 

 

$html .= "<span class=\"select\">";		$html .= "   </span>\n";		// If content plugins are enabled, reload the whole page; otherwise, use ajax 		if( VM_CONTENT_PLUGINS_ENABLE == '1' ) {			$html .= "<select class=\"inputbox styled\" onchange=\"var id = $('product_id_field')[selectedIndex].value; if(id != '') { document.location = '" . $mm_action_url . "index.php?option=com_virtuemart&page=shop.product_details&flypage=$flypage&Itemid=$Itemid&category_id=$category_id&product_id=' + id; }\" id=\"product_id_field\" name=\"prod_id[]\">\n" ;		} else {			$html .= "<select class=\"inputbox styled\" onchange=\"var id = $('product_id_field')[selectedIndex].value; if(id != '') { loadNewPage( 'vmMainPage', '" . $mm_action_url . "index2.php?option=com_virtuemart&page=shop.product_details&flypage=$flypage&Itemid=$Itemid&category_id=$category_id&product_id=' + id ); }\" id=\"product_id_field\" name=\"prod_id[]\">\n" ;		}

 

I am unsure about the vm_content_plug_enable function in the code below, I am trying to recreate the inline code from the code above and then also call the get_child_text () function. I will need to do the same for the second part of the if statement:

 

 

<script type="text/javascript" language="javascript"><!-function get_child_text () {	var select_list_field = document.getElementById('product_id_field');	var select_list_selected_index = select_list_field.selectedIndex;	var text = select_list_field.options[select_list_selected_index].text;	var value = select_list_field.value;	document.write (value);}function vm_content_plug_enabled () {	var id = $('product_id_field')[selectedIndex].value; if(id != '') { 	document.location = '" . $mm_action_url . "index.php?option=com_virtuemart&page=shop.product_details&flypage=$flypage&Itemid=$Itemid&category_id=$category_id&product_id=' + id; } //-></script>

 

[Adam]

Could you show the mark-up for the button?

[slamMan]

Button was probably the wrong thing to say. It looks like a button, but is just and image put on top of the drop down box via css.

 

The script being used is from here:

 

http://ryanfait.com/resources/custom-checkboxes-and-radio-buttons/

 

I am not sure why it is not working properly for this drop down. The site has many other dropdowns that work perfectly.