So, many say that LJ is just a repository of fluff. That it holds no real innate value.
So, I now put it out there. This is my test and situation.
I am trying to teach myself JavaScript. I think I’ve written my code correctly. Only problem is.. it doesn’t work. Actually it doesn’t do anything at all
So, below the cut I will explain the problem, code, and issue. I will leave myself logged on via AIM and Yahoo. I am curious to see how long it takes for someone to find read my issue and get in contact with me to aid the solution 🙂
Theoretically this is a very simple problem. 🙂
This is my current JavaScript quandry it is actually in two parts.
I have created a table that has 3 radio buttons, 3 simple text labels, and 3 text fields and 1 submit button. These all sit in a form:
The form:
Has a name and id of “NewData”
The radio buttons
Are all named “ModChoice”
Have values of 1, 2, and 3 respectively.
onClick=”radioClick(this.value)”
Up in the <head> section of the html I have written the following:
<script language="JavaScript" type="text/javascript">
<!--
function radioClick(radioChoice)
{
alert("Click in button [" . radioChoice . "]")
switch (radioChoice) {
{{Other stuff removed}}
}
}
//-->
</script>
So, question 1. When someone clicks a radio button, why doesn’t RadioClick get called?. When I hit one of the radio buttons, nothing happens.
Advanced question 2. I’d like to use the switch statement to change the css “on the fly” so that selecting a button causes the text in the unselected choices to change to a dimmer colour and the associated text fields ‘disable’.
From my reading, issue 1 should just work. Granted, I’ve yet to comprehend how JavaScript feels about semi-colon usage. I’ve seen examples that do and don’t use it.
So… comments? Thanks!
« The short form… as I am bushed… HELP ME DO MAGICK ;) Not getting much sleep tonight. PAIN and TMI »
IMO, if there’s any way you can avoid javascript and use something else, you should. Javascript behaves very differently between browsers and browser version and can be extremely frustrating to beat into consistency. It’s still too early for me to think clearly about the code you’ve posted, but if you don’t get an answer before I wake up I might think about it.
At this point, the only time I use javascript is when I’m forced to because I need to influence browser behavior, and javascript is the only thing at present that will do that (that I know of). Otherwise it’s safest (and least frustrating for both you and the end user) to use a less tempermental programming language.
I can talk about this much, much more if you’d like.
My understanding is that…
javascript is the quick way if you need page elements to change once the page has rendered and things like PHP are useful in dynamically rendering.
I’d prefer not to have to reload the page each time someone changes the radio button. So is there an alternative to the JavaScript?
Re: My understanding is that…
For client side changes Javascript is your best bet. There’s VBScript but that’s IE only.
I don’t have time to debug this, running late already today.
Netscape / Firefox / Mozilla – if you go to your test page and then type javascript: in the url button a window will popup with error messages in it.
The onclick should call the function. The alert should trigger. Since it doesn’t you probably have some syntax error in the function such that your browser isn’t considering it defined.
I feel better using ; s myself, though I’m not entirely sure they are required. Your syntax error maybe that or may be in the other code you’ve omitted.
You might also check on case sensitivity. Also you can try putting an alert loose above the function to make sure that one happens (should happen on page load if it’s not in a function).
Javascript does have a form of switch, but I forget the syntax inbetween uses of it, my references are at work, and my bookmarks are on other computers… for disabling fields you want the property blur.
If you can just think of likely terms, this sort of thing is easy to Google for.
Re: My understanding is that…
The page is still redrawing itself with client-side javascript, it’s just doing it in the browser instead of reloading from server. If you want to modify the way the page looks without sending a request to the server, then yes, javascript is unfortunately the only way (that I know of). I think it’s wise to always come up with an alternative though and make sure page functions w/o the javascript b/c many people disable javascript or use browsers that don’t support it.
Have you gotten an answer yet, or should I take a closer look at your posted code?
Also, if you use Firefox, there are some faboo extensions for debugging and examining javascript.
Not a javascripter, but…
Define “value” 😛
Re: Not a javascripter, but…
I’m not sure what you mean by define value.
Re: Not a javascripter, but…
Oh, just commenting on the idea that some people think lj holds nothing of “value” because they don’t find it interesting or helpful to them. Sorry!
javascript
http://dusk.org/alissa/andreijs/
You want + instead of . to concatenate.
Also, a debugging tip: If there is an error in a javascript function, it often won’t execute the function at all. Start by commenting out everything in the script except for an alert on the first last line with a simple string. If that works, the you know your function is being called. Then try replacing the string with the variables that you are trying to pass. Then you know that the variables are passing what you expect. Then start uncommenting bits of the code, line by line until it breaks, using an alert as your check.
Try…
Semicolon usage is optional, so long as the statements are on multiple lines. Semis can be used to put multiple statements on one line, such as when you’d like your “onClick” to do multiple things in succession. It’s considered good practice to use semis, IMO.
The following worked for me using IE. The code to disable and enable fields is included:
... <head> <script language="JavaScript" type="text/javascript"> function loadPage() { //handle the initial text field loading. document.newData.all.text1.disabled=false; document.newData.all.text2.disabled=true; document.newData.all.text3.disabled=true; } function radioClick(elementValue) { //here's the selected value alert("Selected element: " + elementValue); //do your enable/disable - this will grey out the other fields var buttons = document.newData.all.group; var text; for( i=0; i < buttons.length; i++ ) { if( buttons[i].checked == false ) { text = eval('document.newData.all.text' + (i+1)); text.disabled=true; } else { text = eval('document.newData.all.text' + (i+1)); text.disabled=false; } } } </script> </head> <body onLoad="loadPage()"> <form name="newData"> <input type="radio" name="group" id="1" value="1" onClick="radioClick(this.value)" checked> <input type="text" name="radiotext1" id="text1" value="1"><br> <input type="radio" name="group" id="2" value="2" onClick="radioClick(this.value)" > <input type="text" name="radiotext2" id="text2" value="2"><br> <input type="radio" name="group" id="3" value="3" onClick="radioClick(this.value)" > <input type="text" name="radiotext3" id="text3" value="3"> </form> </body>So do these responses count as an LJ sucess or not? And did you get it working yet?