Onchange

•

What is DaniWeb IT Discussion Community?

You're currently browsing the JavaScript / DHTML / AJAX section within the Web Development category of DaniWeb, a massive community of 391,922 software developers, web developers, Internet marketers, and tech gurus who are all enthusiastic about making contacts, networking, and learning from each other. In fact, there are 3,704 IT professionals currently interacting right now! Registration is free, only takes a minute and lets you enjoy all of the interactive features of the site.

Join our community!

Please support our JavaScript / DHTML / AJAX advertiser: Lunarpages Web Hosting

Thread Tools Display Modes

Views: 1527 | Replies: 2

•

Join Date: Oct 2006

Posts: 71

Reputation: assgar is an unknown quantity at this point

Rep Power: 2

Solved Threads: 0

assgar

Offline

Junior Poster in Training

Onchange

Jul 10th, 2008

Hi
I am new to javascript.
I have two drop downs used to reload the page displaying selected information.

How do I get the OnChange function to pass year and user form the drop down.
I also need to pass data in the array $month.

Help with Code Tags

(Toggle Plain Text)

<html>
<head>
<body>
<script language="JavaScript" type="text/JavaScript">
<!--

function OnChange(dropdown)
{
  //reload page after drop down selection
  window.location.href="http://localhost/month_view.php?u_user_id=" +
  dropdown.options[dropdown.selectedIndex].value    "&year="+   "&month="+ ;
}
--->


 <table>
   <tr><td>
     <!--year drop down-->
     <select name ="year" onChange ="javascript:OnChange(this)"
      <option value="">Select</option>
      <option value="2007">2007</option>
      <option value="2008">2008</option>
     </select>

	
      
     <select name = "user_id" onChange ="javascript:OnChange(this)"
      <option value="">Select</option>
      <option value="1">Frank</option>
      <option value="2">Mark</option>
     </select>
     
</td>    
</tr>
<tr>
<td>
 <?php
 	//display information based on selected year, month and user
 	display_info($year, $month, $user);
 ?>
	
</td>
</tr>
</table>
</body>
</head>
</html>

•

Join Date: Jul 2008

Posts: 17

Reputation: kceleb9 is an unknown quantity at this point

Rep Power: 1

Solved Threads: 0

kceleb9

Offline

Newbie Poster

Re: Onchange

Jul 10th, 2008

First - it looks like you are trying to re-load the page to early. It is the first line in your function - so you will lose whatever was selected in the drop down.

Clean way is just make a var:

var year;

and assign it to the value of the dropdown at the **beginning** of your function

year = options[dropdown.selectedIndex].value;

if you need to use both year AND user when you refresh the page - then instead of passing (this) from the onchange hander - just give an id to each SELECT element and then look up each one with document.getElementById() in your function.

Then you can get the year and the user before you refresh the page again.

•

Join Date: Oct 2006

Posts: 71

Reputation: assgar is an unknown quantity at this point

Rep Power: 2

Solved Threads: 0

assgar

Offline

Junior Poster in Training

Re: Onchange

Jul 13th, 2008

Hi

Thanks for the response and suggestion.
I could not a single function to work.
I could get 2 seperate functions working and it does the job.

I am curious why your suggestion won;t work as one function but will wor as two?

solution

Help with Code Tags

(Toggle Plain Text)

<html>
<head>
<script language="javascript" type="text/javascript">

function YearChange()
{
   var year = document.getElementById('year').value;
   window.location.href="http://localhost/month_view.php?year=" + year;
}

function ProChange()
{
   var providerId = document.getElementById('provider_id').value;
   window.location.href="http://localhost/month_view.php?u_org_pro_id=" + providerId;
}

</script>
</head>
<body>
 <table>
   <tr><td>

   <select name= "year" onchange="javascript:YearChange();">
     <?
        //dynamic year dropdown 14 years (4 back, current and 9 forward)
	year_only($year);
     ?>
    </select>
 
      
    <select name= "user_id" onchange="javascript:ProChange();">
       <?
 	  //display information based on selected year, month and user
 	  display_info($year, $month, $user);     
       ?>
    </select>

</td>
</tr>
</table>
</body>
</html>

Last edited by assgar : Jul 13th, 2008 at 9:10 pm.