•
•
•
•
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 374,019 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 2,751 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.
Please support our JavaScript / DHTML / AJAX advertiser: Lunarpages Web Hosting
Views: 7342 | Replies: 9
 |
•
•
Join Date: Mar 2006
Posts: 5
Reputation: 
Rep Power: 0
Solved Threads: 0
Newbie Poster
javascript radio buttons and insanity I am (as you will quickly discover) a novice javascript coder. Here is my issue. I am using a radio button, and it works fine. Then when I change some other element on the page, or hit refresh, the radio button does not remain set. You can see it in action here:
http://claytargetsonline.com/radio2.php?type=line
I have tried check to see which one is checked and every other solution I can think of. I have asked experienced programmers, and didn't want to waste more than 10 minutes of their time, but it was not obvious to them either.
I have spent about 5 hours searching the web. No avail. Help!
I did search this forum also but did not find a similar problem.
Any help woule be appreciated.
David
http://claytargetsonline.com/radio2.php?type=line
I have tried check to see which one is checked and every other solution I can think of. I have asked experienced programmers, and didn't want to waste more than 10 minutes of their time, but it was not obvious to them either.
I have spent about 5 hours searching the web. No avail. Help!
I did search this forum also but did not find a similar problem.
Any help woule be appreciated.
David
<script type="text/javascript">
function check(charttype)
{
document.getElementById("chartType").value=charttype
}
function refresh_window()
{
var type = document.getElementById("chartType").value
window.location=("radio2.php?type=" + type)
}
</script>
<form id="form1" action="(EmptyReference!)" method="put" name="form1">
<table width="415" border="0" cellspacing="2" cellpadding="0">
<tr>
<td width="297"><strong>Chart Type:</strong></td>
<td valign="bottom" width="112"> </td>
</tr>
<tr>
<td width="297">
<input type="radio" name="chartType" id="chartType" value="line" onclick="check(this.value)" <?php if ($type == "line") echo "CHECKED" ?> > line
<input type="radio" name="chartType" id="chartType" value="column" onclick="check(this.value)" <?php if ($type == "column") echo "CHECKED"?> > column <input type="radio" name="chartType" id="chartType" value="3dcolumn" onclick="check(this.value)" <?php if ($type == "3dcolumn") echo "CHECKED"?> > 3d column
</td>
<td align="right" rowspan="2" valign="bottom" width="112">
<button name="refresh" type="button" onclick="refresh_window()">Refresh Chart </button>
</td>
</tr>
<tr>
<td width="297"></td>
</tr>
</table>
</form>
<p>The problems is this. </p>
<p>Set the chart type to column and hit refresh. Everything works.</p>
<p>Now hit refresh again. Chart type changes to line.</p>
<p>I hope someone can help me with this. I am losing my mind.</p>
•
•
Join Date: Dec 2004
Posts: 1,589
Reputation:
Rep Power: 7
Solved Threads: 34
Not sure I understand the problem. Hitting "Refresh" will, well, refresh the page. No value would be expected to remain, every element would naturally go back to the initial, default values.
•
•
Join Date: Dec 2004
Location: Lincoln Park, Michigan
Posts: 1,744
Reputation:
Rep Power: 7
Solved Threads: 107
The answer is simple. You have the onclick events launched when you click a radio button. That function (check) sets a document item to the value of the clicked option. Then when you execute a refresh_window, that value is still valid in that page element, when you read the value in order to pass it to window.location, which is good, but when the page refreshes, so does the page element that normally gets set by the check function. So, since the check function isn't executed again, it resorts to it's default value. You can illustrate this, by going to the page, choosing an option, and click refresh, then click the same option, and click refresh again..... as long as you click an option, it remains checked on the refresh... it's only when you do a refresh, and then another refresh (because you aren't calling the check function on the second refresh) that it loses it's value. Now, I'm no programmer, but I'd suggest trying to add a call to the check function inside the refresh_window function....
As a very last resort, assuming the above doesn't solve the issue.... you could have the page write a cookie, and then read the cookie for the value that was previously set.... a tacky fix, but one that would probably work.
As a very last resort, assuming the above doesn't solve the issue.... you could have the page write a cookie, and then read the cookie for the value that was previously set.... a tacky fix, but one that would probably work.
•
•
Join Date: Mar 2006
Posts: 5
Reputation:
Rep Power: 0
Solved Threads: 0
Newbie Poster
I tried to simplify the code so that it would be the simplest for asking the question. Maybe the full example of what I am trying to do would be better.
I understand what you are saying about refresh setting the state back to the default, but checkboxes stay checked, why do radio buttons reset?
http://claytargetsonline.com/napl/ch...alse&type=line
This link will take you to the charting program that I am working on. If you select a column chart and hit refresh, everything works great. Then if you change ONLY the number of Months and refresh again, it resets the chart type to line.
Any suggestions for how to preserve the setting for columns? Neither the drop down nor the checkboxes seem to have the problem.
Thanks for the responses so far.
I understand what you are saying about refresh setting the state back to the default, but checkboxes stay checked, why do radio buttons reset?
http://claytargetsonline.com/napl/ch...alse&type=line
This link will take you to the charting program that I am working on. If you select a column chart and hit refresh, everything works great. Then if you change ONLY the number of Months and refresh again, it resets the chart type to line.
Any suggestions for how to preserve the setting for columns? Neither the drop down nor the checkboxes seem to have the problem.
Thanks for the responses so far.
•
•
Join Date: Dec 2004
Location: Lincoln Park, Michigan
Posts: 1,744
Reputation:
Rep Power: 7
Solved Threads: 107
Yeah, I said cookies....
But beyond, the code that you have in both what you posted, and the site in the link..... when you click the radio button, it executes an onclick event.... right? That function is called "check", and it gets called when you click an option button. The check box's don't call any kind of function at all, but the option buttons do. Why the checkbox's retain their value, and the option buttons do not, is beyond me.... but I'll bet if you call the check function within the refresh_window function, it should work just fine.... Look carefully at this line:
onclick, it calls check(this.value), when you hit refresh, the first time, it works if you change the option button, because you clicked the option button, and it called this function... when you click it the second time, it never calls "check".... ever. Not once... it needs to. So, somewhere in the refresh_window function, you need to have it call the check function.
Or something along those lines...
But beyond, the code that you have in both what you posted, and the site in the link..... when you click the radio button, it executes an onclick event.... right? That function is called "check", and it gets called when you click an option button. The check box's don't call any kind of function at all, but the option buttons do. Why the checkbox's retain their value, and the option buttons do not, is beyond me.... but I'll bet if you call the check function within the refresh_window function, it should work just fine.... Look carefully at this line:
<input type="radio" name="chartType" id="chartType" value="column" onclick="check(this.value)" > column
function refresh_window()
{
var type = document.getElementById("chartType").value
check(type);
window.location=("radio2.php?type=" + type)
}Or something along those lines...
•
•
Join Date: Mar 2006
Posts: 5
Reputation:
Rep Power: 0
Solved Threads: 0
Newbie Poster
Thanks. I will give it a try.
•
•
Join Date: Mar 2006
Posts: 5
Reputation:
Rep Power: 0
Solved Threads: 0
Newbie Poster
OK. I tried, but I never got it to work. Thanks for the help, but now a lovely dropdown menu that does work sits in place of the radio buttons. I am a beaten man. :-|
•
•
Join Date: Dec 2004
Location: Lincoln Park, Michigan
Posts: 1,744
Reputation:
Rep Power: 7
Solved Threads: 107
•
•
Join Date: Dec 2004
Location: Lincoln Park, Michigan
Posts: 1,744
Reputation:
Rep Power: 7
Solved Threads: 107
why not use cookies?
•
•
Join Date: Mar 2006
Posts: 5
Reputation:
Rep Power: 0
Solved Threads: 0
Newbie Poster
•
•
•
•
Originally Posted by Comatose
why not use cookies?
Remember the part at the start of the thread about being inexperienced? Well cookies is still something that I have not done. :o Soon though. I just can't figure out why the radio buttons lose their value and dropdowns and checkboxes don't. Go figure.
Thanks for your help. It is much appreciated.
|
•
•
•
•
Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
•
•
•
•
•
•
•
•
DaniWeb JavaScript / DHTML / AJAX Marketplace
Linear Mode
- An array of arrays of of radio buttons (JavaScript / DHTML / AJAX)
- dynamically generated textboxes & radio buttons php, insert into db (PHP)
- javascript: radio buttons (JavaScript / DHTML / AJAX)
- IE6 - dialogue boxes , check boxes and radio buttons work very slowly after hijacking (Viruses, Spyware and other Nasties)
Other Threads in the JavaScript / DHTML / AJAX Forum
- Previous Thread: Calling Different Iframes in Page
- Next Thread: Please help, been a few years.
