AJAX

for validation - text box and drop down menu

Please support our JavaScript / DHTML / AJAX advertiser: PostgreSQL or MySQL? Compare and contrast the two most popular open source databases

•

Join Date: Dec 2006

Posts: 10

Reputation: drewrockshard is an unknown quantity at this point

Solved Threads: 0

drewrockshard drewrockshard is offline

Offline

Newbie Poster

for validation - text box and drop down menu

Dec 14th, 2006

I have a little problem. I have a drop down menu that contains various different entries. I am allowing the user to also have a text box right next to the drop down menu where they can specify a category (and it will insert it into the drop down menu for the next time). The text box, though is an issue for me.

The issue is, if the user types in an entry and the entry already excists in the drop down menu, I want a popup to say "Category already excists" or something like that. It's for validation, but I am wanting the javascript to check the drop down menu so that the same categories aren't entered multiple times.

Is there a way in javascript i can validate these so this does not happen. Thanks.

•

Join Date: Oct 2006

Posts: 257

Reputation: Dukane is an unknown quantity at this point

Solved Threads: 22

Dukane

Offline

Posting Whiz in Training

Re: for validation - text box and drop down menu

Dec 14th, 2006

Sure, when someone enters, call a function which iterates through each item in the list. If the entry in the textbox matches one of the items in the list, the throw up the error message. If not, allow it to be added.

•

Join Date: Dec 2006

Posts: 10

Reputation: drewrockshard is an unknown quantity at this point

Solved Threads: 0

drewrockshard drewrockshard is offline

Offline

Newbie Poster

Re: for validation - text box and drop down menu

Dec 14th, 2006

You have any sample code? Something to start me along? I know what you mean, like a for() loop of some sort, right?

•

Join Date: Oct 2006

Posts: 257

Reputation: Dukane is an unknown quantity at this point

Solved Threads: 22

Dukane

Offline

Posting Whiz in Training

Re: for validation - text box and drop down menu

Dec 14th, 2006

Yes, you could use a for loop to iterate through each item in the array of items in the list box. Each time, look to see if that particular item equals the contents of the textbox. If it does, stop and give an error message. But if the loop completes, then allow the contents of the textbox to be added to the listbox and continue on with your script.

•

Join Date: Dec 2006

Posts: 10

Reputation: drewrockshard is an unknown quantity at this point

Solved Threads: 0

drewrockshard drewrockshard is offline

Offline

Newbie Poster

Re: for validation - text box and drop down menu

Dec 15th, 2006

Alright, having some issues

.

Here's what I have so far. Here's the form:

[html]
<form method="post" action="doit.php" name="content">
<p><label id="datBegin">Date</label><br />
<input type="text" id="date" name="date" value="<?php echo date('F d, Y'); ?>" />
<input type="hidden" id="time" name="time" value="<?php date('H:i:s'); ?>" /></p>
<p><label id="category">Category</label><br />
<select id="category" name="category" onchange="changeNewCat()">
<optgroup label="Please Pick">
<option value="0">No Category Selected</option>
<?php
$i=0;
while ($i<$num) {
$row = mysql_fetch_assoc($result);
echo "<option value=".$row['category'].">".$row['category']."</option>";
$i++;
}
?>
</optgroup>
</select> OR
<input type="text" id="newcat" name="newcat" /> (Add a new category)</p>
<p><label id="daily">Content</label><br />
<textarea id="daily" name="daily"></textarea></p>
<input type="submit" value="Create Daily" onclick="return checkForm(this.form)" />
</form>
[/html]
First off, don't worry about the PHP. This all works. Also, the onchange="changeNewCat()" works great too.

Let me give you javascript before I go further into this:

 Help with Code Tags 
 JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
// Trying to code up a duplicate stopper!!
var dropdowns = document.getElementsByName("category");
var newCatDrop = document.forms[0].newcat.value;
for(var i = 0; i < dropdowns.value; i++) {
    if (i == newCatDrop) {
        alert("Sorry, no duplicates allowed.");
        return false;
    }
    else {
        // For debugging purposes, will remove later.
        alert("No Match");
        return false;
    }
}
// Trying to code up a duplicate stopper!!
var dropdowns = document.getElementsByName("category");
var newCatDrop = document.forms[0].newcat.value;
for(var i = 0; i < dropdowns.value; i++) {
    if (i == newCatDrop) {
        alert("Sorry, no duplicates allowed.");
        return false;
    }
    else {
        // For debugging purposes, will remove later.
        alert("No Match");
        return false;
    }
}

The javascript just doesn't work. Theres is more to this. Also, don't worry about the part that says onclick="return checkForm(this.form)". The above javascript is a snippet, as this all works, except for the javascript stated above.

Am I not iterating properly. If someone could guide me or show me a little better way of getting this done, please do show.

I believe this is the last part of the validation of this form and it will be complete.

Any thoughts?

•

Join Date: Oct 2006

Posts: 257

Reputation: Dukane is an unknown quantity at this point

Solved Threads: 22

Dukane

Offline

Posting Whiz in Training

Re: for validation - text box and drop down menu

Dec 15th, 2006

Your iteration is not correct.

Look at your if statement. if (i == newCatDrop).
But what is i? i is an integer variable that is counting the number of times you go through the loop, not the indexes in the drop-down list.

What you want to do is put all of the options into an array. Then, cycle through that array and see if each one is NOT what the user entered. If it is, display an error message. If not, then add it to your list. You're on the right track, you just need to make some minor changes.

•

Join Date: Dec 2006

Posts: 10

Reputation: drewrockshard is an unknown quantity at this point

Solved Threads: 0

drewrockshard drewrockshard is offline

Offline

Newbie Poster

Re: for validation - text box and drop down menu

Dec 15th, 2006

How exactly would I do that? I'm pretty good with programming - when it comes to loops - I fall... hard.

I'll try my best, best if you could help me out, that would be great.

•

Join Date: Dec 2006

Posts: 10

Reputation: drewrockshard is an unknown quantity at this point

Solved Threads: 0

drewrockshard drewrockshard is offline

Offline

Newbie Poster

Re: for validation - text box and drop down menu

Dec 15th, 2006

Now I have this:

 Help with Code Tags 
 JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
        // Trying to code up a duplicate stopper!!
        var dropdowns = document.getElementsByName("category");
        var newCatDrop = document.forms[0].newcat.value;
        for(var i = 0; i < dropdowns.length; i++) {
                if (dropdowns[i] == newCatDrop) {
                        alert("Match");
                        return false;
                }
                else {
                        alert("No Match");
                        return false;
                }
        }
        // Trying to code up a duplicate stopper!!
        var dropdowns = document.getElementsByName("category");
        var newCatDrop = document.forms[0].newcat.value;
        for(var i = 0; i < dropdowns.length; i++) {
                if (dropdowns[i] == newCatDrop) {
                        alert("Match");
                        return false;
                }
                else {
                        alert("No Match");
                        return false;
                }
        }

It now pops up with "no match" although, this is a match. So it works, but it doesn't work correctly

.. any help?

•

Join Date: Oct 2006

Posts: 257

Reputation: Dukane is an unknown quantity at this point

Solved Threads: 22

Dukane

Offline

Posting Whiz in Training

Re: for validation - text box and drop down menu

Dec 15th, 2006

All of the options in the select element need to be placed into an array. Your code here doesn't do that. Instead, you're looking to see each time through the loop if the select box equals what was typed in. That's why it always comes out false.

•

Join Date: Dec 2006

Posts: 10

Reputation: drewrockshard is an unknown quantity at this point

Solved Threads: 0

drewrockshard drewrockshard is offline

Offline

Newbie Poster

Re: for validation - text box and drop down menu

#10

Dec 15th, 2006

Could you possibly help out. Telling me and showing me are two different things. I have exhausted all my javascript skills (which isn't much).

Here is my newest attempt:

 Help with Code Tags 
 JavaScript / DHTML / AJAX Syntax (Toggle Plain Text) 
        var dropdowns = document.forms[0].category;
        var newCatDrop = document.forms[0].newcat.value;
        for (var i = 0;i < dropdowns.length;i++) {
                if (dropdowns.options[i].value == newCatDrop) {
                        alert("Match");
                        return false;
                }
                else {
                        alert("Not A Match");
                        return false;
                }
        }
        var dropdowns = document.forms[0].category;
        var newCatDrop = document.forms[0].newcat.value;
        for (var i = 0;i < dropdowns.length;i++) {
                if (dropdowns.options[i].value == newCatDrop) {
                        alert("Match");
                        return false;
                }
                else {
                        alert("Not A Match");
                        return false;
                }
        }

This almost works, but it doesn't. If you type in 0 (the value of the initial drop down menu option) it works. If you type in "drew" (no quotes) - which is one of the values/options of the drop down menu - does not work.

This is not what I want.

You think someone could manipulate my code to get something working? Let me know. Thanks.