I'm beefing up a Quick Suirvey on one of my pages. Right now I have one radio-button selection, with two choices, an area for an optional comment, and that's all.
Now I want to add another set of radio buttons, with four buttons to choose from.
In my current version, I have one button checked as the default; in the new version, which I havne't fully tested yet (but the page validates with W3C - it's not up, though) - although I hve one button checked by default, it doesn't show as checked when I bring the page up. Ouch!
[Adding notes with an edit - BLUSH! I see a code error! "<div id=radio1">" - a missing quote mark! I guess I didn't validate THIS version! The Validator would have caught that!]
[Adding more notes: I corrected the missing quote, and the page validated (by file upload), but I still don't get the default check-mark in the radio button series #1. Don't know why not! I'm amending the code example now so the missing quote mark is included.]
This is very crude, and I don't have a decent .CSS structure for it either, and will be inquiring about that.
Meantime, can anybody tell me how i can fix this? (HTML snippet follows)
Code:
<div id="surveyquest">
<h3 id="survey">Quick Survey</h3>
<h4>Where are you from?</h4>
<div id="radio1">
<p>East</p>
<p><input type="radio" name="radio" value="East" checked="checked" /></p>
<p>West</p>
<p><input type="radio" name="radio" value="West" /></p>
<p>South</p>
<p><input type="radio" name="radio" value="South" /></p>
<p>North</p>
<p><input type="radio" name="radio" value="North" /></p>
</div>
<h4>Do you have a dog?</h4>
<div id="radio2">
<p>Yes, I do.</p>
<p><input type="radio" name="radio" value="Yes" checked="checked" /></p>
<p>No, I don't.</p>
<p><input type="radio" name="radio" value="No" /></p>
</div>
<h4>You may leave a comment if you like</h4>
<p><textarea name="message" rows="4" cols="40">Comment here</textarea></p>
<p><input type="submit" value="Reply to survey" /></p>
<p><strong>or</strong></p>
<p><input type="reset" value="Quit" /></p>
</div>
Probably those divs are extraneous; I stuck them in when I wondered if not having them prevented the checked radio button from being visibly checked when I brought the page up.
Mon, 21 Nov 2005 09:16:19
Last edited by CarolW; 11-21-2005 at 11:38 AM.
Reason: additional info
Hey, thanks! maybe I should have included the entire code example - OPTGROUP, I'm not familiar with. Here's what surrounds the code example I gave before - well, I'd better include the entire form part.
Code:
<div class="feedput">
<form method="post" action="/cgi-bin/mailit">
<!-- Validator requires a div here -->
<!-- and also closing of tags -->
<div class="questions">
<input type="hidden" name="login" value="cwhitney" />
<!-- the following returns visitor to refreshed survey page -->
<input type="hidden" name="reply" value="thanks11.htm" />
<input type="hidden" name="date" id="date" value="<!--#echo var='DATE_LOCAL' -->" />
<input type="hidden" name="date" value="date" />
<input type="hidden" name="file" value="carolarkowl" />
<input type="hidden" name="format" value="human" />
<input type="hidden" name="fields" value="date message" />
<!-- end questions div here; it seems no longer needed by Validator after this -->
</div>
<div id="surveyquest">
<h3 id="survey">Quick Survey</h3>
<h4>Where are you from?</h4>
<div id="radio1">
<p>East</p>
<p><input type="radio" name="radio" value="East" checked="checked" /></p>
<p>West</p>
<p><input type="radio" name="radio" value="West" /></p>
<p>South</p>
<p><input type="radio" name="radio" value="South" /></p>
<p>North</p>
<p><input type="radio" name="radio" value="North" /></p>
</div>
<h4>Do you have a dog?</h4>
<div id="radio2">
<p>Yes, I have one or more.</p>
<p><input type="radio" name="radio" value="Yes" checked="checked" /></p>
<p>No, I don't.</p>
<p><input type="radio" name="radio" value="No" /></p>
</div>
<h4>You may leave a comment if you like</h4>
<p><textarea name="message" rows="4" cols="40">Comment here</textarea></p>
<!-- Display portion with questions and buttons and boxes and bows -->
<p><input type="submit" value="Reply to survey" /></p>
<p><strong>or</strong></p>
<p><input type="reset" value="Quit" /></p>
</div>
</form>
<!-- close feedput div here -->
</div>
I gather OPTGROUP has something to do with having multiple radio-button parts in the form?
Since the page validates on file upload (XHTML 1.0 Strict), I guess the page itself is all right; it's the radio-button or general form coding that's off.
You must have seen my cached post which wasn't finished; I said check they have different name attrib or it will think name="radio" is just one long form.
You didn't think I'd say you're wrong, right? [haha]
Originally Posted by Robert Wellock
You must have seen my cached post which wasn't finished; I said check they have different name attrib or it will think name="radio" is just one long form.
I did this, and your example really, really helped; thanks! The page validated with W3C by file upload, appeared fine in my test-folder (offlline without SSI), and the radio buttons were checked appropriately. Whew! Fabulous help; thanks!
Now over to CSS to see if I can catch on how to make this even passably sensible and attractive and useful!
multiple radio buttons on form
Reply With Quote
Originally Posted by Robert Wellock
Oh! Oh! I think I get it!
You're right, and it worked!
Bookmarks