Conditional Display of Form Fields

Printable View

07-23-2008, 12:19 AM
kuau

Conditional Display of Form Fields

I am creating a data entry form with a drop-down list of locations from which to choose. I have a checkbox next to "Please add my location to the list," in case the desired location is not on the list.

I would like the fields for adding the new location to be visible only when someone checks the box. So far nothing happens when they check the box - the fields do not show up. What am I missing? Thanks, e :)

Code:

<?php if(isset($_POST['addnewloc'])) { ?> <div id="newloc"> <p><label for="location">New Location:</label><input type="text" name="location" size="60"></p> <p><label for="address">Address:</label><input type="text" name="address" size="40"></p> <p><label for="city">City:</label><input type="text" name="city" size="40"></p> <p><label for="zip">Zip Code:</label><input type="text" name="zip" size="12"></p> </div> <?php } ?>
07-23-2008, 12:45 AM
rangana

What's the identity of your checkbox? Try to give it an id of trig (as of now), and have this script:

Code:

<script type="text/javascript"> window.onload=function() { var loc=document.getElementById('newloc'), // assign the element having an ID of newloc to loc var. trig=document.getElementById('trig'); // get the ID of checkbox loc.style.display='none'; trig.onclick=function() {document.getElementById('newloc').style.display=(this.checked!=true)?'none':'';}} </script>

If you've got an id of the checkbox already, then replace the highlighted with what you have.

See if it helps.
07-23-2008, 01:01 AM
kuau

Do I replace every instance of trig? This is what I tried, but I'm not sure where to put it. I got the message "Error on page." Thanks so much. :)

Code:

<p>Please add my location to the list: <input type="checkbox" id="addnewloc" name="addnewloc" value="Y" <?php echo ( ! empty ( $addnewloc ) ? "checked" : "" ); ?> "> <script type="text/javascript"> window.onload=function() { var loc=document.getElementById('newloc'), // assign the element having an ID of newloc to loc var. addnewloc=document.getElementById('addnewloc'); // get the ID of checkbox loc.style.display='none'; addnewloc.onclick=function() {document.getElementById('newloc').style.display=(this.checked!=true)?'none':'';}} </script> <?php if(isset($_POST['addnewloc'])) { ?> <div id="newloc"> <p><label for="location">New Location:</label><input type="text" name="location" size="60"></p> <p><label for="address">Address:</label><input type="text" name="address" size="40"></p> <p><label for="city">City:</label><input type="text" name="city" size="40"></p> <p><label for="zip">Zip Code:</label><input type="text" name="zip" size="12"></p> </div> <?php } ?>
07-23-2008, 01:21 AM
rangana

I can't reproduce the problem on my end, but maybe because I've used the onload event and you might have used it already.

With that said, have a try by having the highlighted instead of the script I've given:

Code:

<input type="checkbox" id="addnewloc" name="addnewloc" value="Y" <?php echo ( ! empty ( $addnewloc ) ? "checked" : "" ); ?> " onclick="document.getElementById('newloc').style.display=(this.checked!=true)?'none':'';">
07-23-2008, 01:23 AM
kuau

I don't have a <body onload=??>. Do I need one?
07-23-2008, 01:30 AM
rangana

No. The addition on the input element will (might) work.

Does it throws an error when added?
07-23-2008, 01:31 AM
kuau

OK, I tried that and got the error "Object expected on line 393." There are only 244 lines in the code.
07-23-2008, 01:35 AM
rangana

Could you show us your complete modification instead.
07-23-2008, 01:35 AM
kuau

I have commented out a section of garbage code in the file while I am working on it -- could this be conflicting? Thanks for helping me. :)
07-23-2008, 01:45 AM
rangana

Thanks for the link. Together with the link is a vivid reason of the error.

You don't have an element having an id of newloc.
07-23-2008, 01:48 AM
kuau

Yes I do, right here. Maybe I'm misunderstanding.. sorry.

Code:

<?php if(isset($_POST['addnewloc'])) { ?> <div id="newloc"> <p><label for="location">New Location:</label><input type="text" name="location" size="60"></p>
07-23-2008, 01:54 AM
rangana

But it's not being added in the page (as markup).

View your page's source and do a ctrl+f and find newloc. (See that it does'nt exists (yet).
07-23-2008, 02:10 AM
kuau

I see what you mean (duh!). It was because of the

Code:

<?php if(isset($_POST['addnewloc'])) { ?>

around it. Anyway, I fixed it and it works perfectly except for one detail -- I LOVE it! Exactly what I had in mind.

The only problem is that when the page loads, the fields are showing already. If you click and then unclick, they go away. How do I make the page load with the fields hidden to start? e :)
07-23-2008, 02:11 AM
rangana

See if adding the highlighted helps:

Code:

<div id="newloc" style="display:none;">
07-23-2008, 02:20 AM
kuau

Dear Rangana: That was it! It is perfect now... thank you so much. I just love it when things work in such cool ways. I would never have figured that out in a million years.

You made my day. :) e
07-27-2008, 04:27 AM
Jas

Quote:

Originally Posted by kuau

http://www.calendarmaui.com/php/event-submit.php

Hmm. I'm not liking your form validation. Suppose that you were color blind, how could you get past that? See the W3C's WCAG 2.0, as well.

Quote:

1.4.1 Use of Color: Color is not used as the only visual means of conveying information, indicating an action, prompting a response, or distinguishing a visual element.

Though WCAG is often criticized, that rule makes a lot of sense. I highly suggest a new CAPTCHA program.
07-27-2008, 04:48 AM
kuau

I just finished making that one myself and was quite proud of it. :( I figured that the small percentage of people who are colorblind could use a process of elimination and deduce the color based on the ones they could see. I don't want a difficult CAPTCHA program. Nothing ruins my day faster than not being able to get past some unintelligible CAPTCHA. I haven't even made the form live yet. Maybe it will be too easy for the bots and I'll have to change it, but right now I do not want to go back to square one. Thanks.
07-27-2008, 04:58 AM
motormichael12

I love these kind: (I made it but it is like the ones I always get)

http://img297.imageshack.us/img297/926/captchael9.png

Solve it :P
07-27-2008, 05:08 AM
kuau

I rest my case! haha
07-27-2008, 07:57 PM
Jas

Quote:

Originally Posted by kuau

I just finished making that one myself and was quite proud of it. :( I figured that the small percentage of people who are colorblind could use a process of elimination and deduce the color based on the ones they could see.

It is a nice captcha program, no doubt. But I don't think you understand color blindness very well. For one thing, there are more color blind people than you seem to think there are-- I know a few myself. For another, the "process of elemination" only works if you recognize all of the other colors, and chances are that they won't unless they are mildly color blind. In a severly color blind person, things like yellow, blue, and red can all look exactly the same. Generally speaking, color blind people can only really tell saturated colors (i.e. true red, true blue, etc). Colors like purple and blue are very hard to tell apart, and in some cases green and red, pink and purple, etc.

Quote:

I don't want a difficult CAPTCHA program. Nothing ruins my day faster than not being able to get past some unintelligible CAPTCHA.

So you see the problem :)

Quote:

I haven't even made the form live yet. Maybe it will be too easy for the bots and I'll have to change it, but right now I do not want to go back to square one. Thanks.

Understandable, but at the same time it will frustrate a lot of color blind people. Maybe a more traditional captcha program, or a random question would work better. As for the former, there is a simple version in a tutorial linked in my signature. It needs work, though, before it's actually used live. (For one thing, blind people still cannot use it, for another the hyper linked code/example don't work quite right (the posted code does).)
07-28-2008, 01:52 AM
motormichael12

You know that by having separate images there for each one, it could just find the main rbg (or rgb, i always forget th order) of the image.
07-28-2008, 04:13 AM
kuau

There are 5 images each containing 4 words spelled in different colors. Are you thinking each image has just one color?
07-29-2008, 02:35 AM
Medyman

I've been battling this problem myself. One of our big selling points, is that we create standards-based (including WCAG) designs. So, when a recent client needed a CAPTCHA system to prevent spam but also needed it to be accessible, we were a little put off. There isn't currently a good solution out there.

The solution may lie is some wort of humanist, audio hybrid, but the technology simply does not exist.

So, we opted for a simple "logic puzzles": What's the opposite of "cold"? What's 2+2? etc... etc...

That's the best way, we thought, of providing support for the maximum amount of people. Of course, this might prove difficult for people with a cognitive impairment, but that's a loss that we were willing to take.
07-29-2008, 04:41 AM
kuau

Dear MM: Yes! That's exactly what I was going to replace it with! Great minds think alike haha. Do you use images or text for the questions? Also I remember seeing a site that showed what colors look like to color-blind people so I thought I could pick some they could see so Jas will be happy. :)
07-29-2008, 06:13 PM
Jas

Quote:

Originally Posted by kuau

Yes! That's exactly what I was going to replace it with! Great minds think alike haha.

Didn't I suggest that in my last post? I suppose I should have explained it. :rolleyes:

Quote:

Do you use images or text for the questions?

You would need to use text so screen readers can read the question. Otherwise blind people still wouldn't be able to get past it.

Quote:

Also I remember seeing a site that showed what colors look like to color-blind people so I thought I could pick some they could see so Jas will be happy. :)

lol.

By the way, I wouldn't throw away the old CAPTCHA program. Eventually you might be able to make it work.
07-30-2008, 10:42 PM
kuau

Hey Medyman, I was wondering how your captcha was doing... does it keep out bots 100%? Jas, I looked at your captcha code..very cool. Thanks for that.

It would be useful to know exactly what bots are able to do these days. Obviously they can use digital character recognition seeing as all the captcha programs are aimed at foiling that, and according to motormichael12 they can read the main RGB of an image, but what else? Do they maintain databases of what they have tried on a given page and just keep plugging away until they get it, and then add that to a table of correct responses? ie. can they 'learn'? Who owns these bots? Who puts them out there? Is there a way to filter what bots can crawl your site, like in robots.txt or something? Could the browser-writers incorporate code to enable us to do that eventually? How do bots get past the javascript on my forms to check for blanks, and submit blank entries? Why do they even bother doing this? Why can't everybody just get along????
07-31-2008, 04:30 PM
Jas

Quote:

Originally Posted by kuau

Jas, I looked at your captcha code..very cool. Thanks for that.

Still needs work, though. Haven't had time to finish it up. But your welcome. :)

Quote:

It would be useful to know exactly what bots are able to do these days. Obviously they can use digital character recognition seeing as all the captcha programs are aimed at foiling that, and according to motormichael12 they can read the main RGB of an image, but what else? Do they maintain databases of what they have tried on a given page and just keep plugging away until they get it, and then add that to a table of correct responses? ie. can they 'learn'?

Depending on who made the bot, it's possible that the bot can "learn," however, there are two problems. One, the bot has to figure out the right answers first. Two, since the question is randomly generated it still has to match the question with the answer. Hopefully bots aren't smart enough to do both. Admittedly, the random question is probably the least secure, but it's also the least used form of CAPTCHA.

Quote:

Who owns these bots? Who puts them out there?

Miserable nerds with no life. I don't know how many of them actually have a reason to do what they do. For example, the guy that attacked the DD forums a few months ago. Why did he do it?

Quote:

Is there a way to filter what bots can crawl your site, like in robots.txt or something?

. . . I thought we were talking about spam. You can get rid of crawlers like this.

Quote:

Could the browser-writers incorporate code to enable us to do that eventually? How do bots get past the javascript on my forms to check for blanks, and submit blank entries? Why do they even bother doing this? Why can't everybody just get along????

The problem is not in web browsers. Bots don't always need to go through a web browser. And, since they don't always go through browsers, the JavaScripts won't do anything against them. Even if a bot does go through a web browser, JavaScript can be disabled.

BTW: I had another idea as well. I assume the information is stored in a MySQL table? You could always limit the number of submissions per hour per IP address.