Wrox Programmer Forums

Need to download code?

View our list of code downloads.

Go Back   Wrox Programmer Forums > Web Programming > JavaScript > Javascript How-To
Password Reminder
Register
| FAQ | Members List | Calendar | Search | Today's Posts | Mark Forums Read
Javascript How-To Ask your "How do I do this with Javascript?" questions here.
Welcome to the p2p.wrox.com Forums.

You are currently viewing the Javascript How-To section of the Wrox Programmer to Programmer discussions. This is a community of tens of thousands of software programmers and website developers including Wrox book authors and readers. As a guest, you can read any forum posting. By joining today you can post your own programming questions, respond to other developers’ questions, and eliminate the ads that are displayed to guests. Registration is fast, simple and absolutely free .
DRM-free e-books 300x50
Reply
 
Thread Tools Search this Thread Display Modes
  #1 (permalink)  
Old November 30th, 2003, 06:09 AM
Authorized User
 
Join Date: Oct 2003
Location: KL, wilayah persekutuan, Malaysia.
Posts: 91
Thanks: 0
Thanked 0 Times in 0 Posts
Default javascript coding problem

Please help me correct the code below. i know the error is in my javascript but i donno how to fix it.
i want the yearSalesStart, yearSalesEnd text box and view_by radio button be displayed when i clicked on the yearSales radio button is clicked and
monthSales text box and view_radio buttons be displayed when i clicked on the monthSales radio button.

<html>
<head>

<script language="javascript">
     function ToggleTextBoxDisplay()
     {

    if(yearSales == graph_by)
    {
           div1.style.visibility = "visible";
           div1.style.display = "block";
    }
    else if(monthSales == graph_by)
    {
       div2.style.visibility = "visible";
           div2.style.display = "block";
    }
       div3.style.visibility = "visible";
           div3.style.display = "block";
     }

</script>

</head>
<body>
<form method=POST action="selectedchoice.php">

<table border="0" width="100%" cellpadding="10">
<tr>
<td width="50%" valign="top">
<b>What would you prefer to view :? </b><br>
<input type="radio" name="graph_by" value="prodCat" >Product Number Per Category<br>
<input type="radio" name="graph_by" value="yearSales" onclick="ToggleTextBoxDisplay() ">Sales By Year<br>
<input type="radio" name="graph_by" value="monthSales" onclick="ToggleTextBoxDisplay()">Sales By Month<br>
</td>
</tr>

<tr>
<td>
<div id="div1" style="visibility:hidden;display:none"><br>
&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp From <input type="text" name="yearSalesStart" size="7" > To <input type="text" name="yearSalesEnd" size="7" > <br>
</div>

<div id="div2" style="visibility:hidden;display:none"><br>
&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp Year <input type="text" name="monthSalesYear" size="7" > <br><br>
</div>

<div id="div3" style="visibility:hidden;display:none"><br>
&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp<input type="radio" name="view_by" value="category">View Category<br>
&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp<input type="radio" name="view_by" value="specategory">View Specified Category<br>
&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp<input type="radio" name="view_by" value="speproduct" >View Specified Product<br><br>
</div>
</td>
</tr>

<tr>
    <td>&nbsp </td>
    <td align="center"><input type="submit" size="10" value="Submit "> <input type="reset" size="10" value="Reset "> </td>
</tr>
</table>

</form>
</body>
</html>


Reply With Quote
  #2 (permalink)  
Old December 1st, 2003, 05:39 AM
joefawcett's Avatar
Wrox Author
Points: 9,763, Level: 42
Points: 9,763, Level: 42 Points: 9,763, Level: 42 Points: 9,763, Level: 42
Activity: 0%
Activity: 0% Activity: 0% Activity: 0%
 
Join Date: Jun 2003
Location: Exeter, , United Kingdom.
Posts: 3,074
Thanks: 1
Thanked 38 Times in 37 Posts
Default

I would simplify a little, there is no need to worry about display and visibility. If you want to reserve portions of the page and hide and show items use visibility, if you want the area to collapse when not shown use display. I'll show the radio buttons and function to toggle changes using style.display:
Code:
<input type="radio" name="graph_by"  value="yearSales" onclick="ToggleTextBoxDisplay(this.value) ">Sales By Year<br>
<input type="radio" name="graph_by"  value="monthSales" onclick="ToggleTextBoxDisplay(this.value)">Sales By Month<br>

function ToggleTextBoxDisplay(Period)
{
  var divYear = document.getElementById("div1");
  var divMonth = document.getElementById("div2");
  if (Period == "yearSales")
  {
    divYear.style.display = "block";
    divMonth.style.display = "none";
  }
  else
  {
    divYear.style.display = "none";
    divMonth.style.display = "block";
  }
}
--

Joe
Reply With Quote
  #3 (permalink)  
Old December 3rd, 2003, 06:33 AM
Authorized User
 
Join Date: Oct 2003
Location: KL, wilayah persekutuan, Malaysia.
Posts: 91
Thanks: 0
Thanked 0 Times in 0 Posts
Default

Thanks! i've solve half of the problem. But....
I want the yearSalesStart, yearSalesEnd textbox and view_by radio button be displayed only when the user clicked the Sales by Year radio button.
While the monthSalesYear textbox and view_by radio button be displayed only when the user clicked the Sales by Month radio button.
My problem is :when i clicked the Sales by Year radio button and then i change to clicked the Sales by Month radio button, the previous two textbox that displayed for Sales by Year is still displayed and the situation also happen when i clicked the Sales by Month radio followed by Sales by Year.
Could someone please correct my code so that only the right textbox and radio button are displayed when the user change their option?



Reply With Quote
  #4 (permalink)  
Old December 4th, 2003, 04:56 AM
joefawcett's Avatar
Wrox Author
Points: 9,763, Level: 42
Points: 9,763, Level: 42 Points: 9,763, Level: 42 Points: 9,763, Level: 42
Activity: 0%
Activity: 0% Activity: 0% Activity: 0%
 
Join Date: Jun 2003
Location: Exeter, , United Kingdom.
Posts: 3,074
Thanks: 1
Thanked 38 Times in 37 Posts
Default

I thought I had.

--

Joe
Reply With Quote
Reply


Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is Off
HTML code is Off
Trackbacks are Off
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
problem in coding with ndbm library shayanppp BOOK: Beginning Linux Programming, 4th Edition ISBN 978-0-470-14762-7 1 August 8th, 2008 11:32 AM
coding problem in common dialog box cancertropica Visual Basic 2005 Basics 0 July 30th, 2008 09:38 AM
i need help for my coding problem... danielnixon C# 2 May 19th, 2008 03:51 PM



All times are GMT -4. The time now is 01:13 AM.


Powered by vBulletin®
Copyright ©2000 - 2019, Jelsoft Enterprises Ltd.
© 2013 John Wiley & Sons, Inc.