Hi,
I have the following form
The first table they have to pick one team. Their reserve team.
The second ckeckbox range they can pick 3 teams.
What I would like is an error check so if they select the same
team in the checkbox table again, an alert box says ('Your have picked this team as a reserve team')
Maybe along the lines of adding [<INPUT type=checkbox value="Belper Town" name="south1" onclick "validatecheckbox();">Belper Town<BR>]
onclick "validatecheckbox()"; but I can't sort out the elements needed.
1) restricts the maximum team selections from the checkboxes to 3
2) checks if the reserve team selection = any of the checkbox teams
3) if the user changes the reserve team after selecting up to 3 checkbox teams, it checks if the new reserve team is a selected checkbox team
The order of the teams in both lists can be in any order, but make sure the corresponding values for each team in each list are the same.
PHP Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript">
<!--
//helper function to get elements by class name
function getElementsByClassName(oElm, strTagName, strClassName)
{
var arrElements = (strTagName == "*" && oElm.all)? oElm.all : oElm.getElementsByTagName(strTagName);
var arrReturnElements = new Array();
strClassName = strClassName.replace(/\-/g, "\\-");
var oRegExp = new RegExp("(^|\\s)" + strClassName + "(\\s|$)");
var oElement;
for(var i=0; i<arrElements.length; i++)
{
oElement = arrElements[i];
if(oRegExp.test(oElement.className))
{
arrReturnElements.push(oElement);
}
}
return (arrReturnElements)
}
//helper function
function numSelectionsIsOk() {
var count = 0;
var elems = getElementsByClassName(document, "input", "teams")
for(var i in elems) {
if(elems[i].checked) count = count + 1;
}
if(count <= maxSelections) {
return true;
} else {
return false;
}
}
//---------------------------------------------------------------------------------
var maxSelections = 3;
//function to check validity of checkbox selection
function valdateTeam(thisTeam,elemId) {
//check if a reserve team has been selected
if(document.getElementById("selResTeam").selectedIndex == 0) {
document.getElementById(elemId).checked = false;
alert("Select a Reserve team first");
}
//check number of team selections
if(numSelectionsIsOk()) {
var resTeam = document.getElementById("selResTeam").options[document.getElementById("selResTeam").selectedIndex].value;
if(thisTeam == resTeam) {
document.getElementById(elemId).checked = false;
alert("You have selected this team - "+thisTeam+" - as your Reserve Team.");
}
} else {
document.getElementById(elemId).checked = false;
alert("You can select a maximum of "+maxSelections+" teams.");
}
}
//function to check validity of select list selection
function checkResTeam(selElem) {
var selTeam = selElem.options[selElem.selectedIndex].value;
//get the checkbox teams
chkBoxTeams = getElementsByClassName(document, "input", "teams");
//check if selTeam is a checked checkbox team
for(var i in chkBoxTeams) {
if(chkBoxTeams[i].checked && chkBoxTeams[i].value == selTeam) {
selElem.selectedIndex = 0;
alert("This Reserve Team - "+selTeam+" - is one of your "+maxSelections+" teams below");
}
}
}
1) I can select more than 3 teams from the checkboxes. My interpretation of the OP's post was that the maximum number of team selections should be 3.
2) If the user changes their reserve team selection after selecting their up to 3 teams, their up to 3 selections are lost and they have to reselect them.
In order to maintain user friendliness, imo it would be more user friendly to leave the up to 3 teams selected and then simply check if the new selected reserve team is 1 of the up to 3 'checked' teams.
1) I can select more than 3 teams from the checkboxes. My interpretation of the OP's post was that the maximum number of team selections should be 3.
2) If the user changes their reserve team selection after selecting their up to 3 teams, their up to 3 selections are lost and they have to reselect them.
In order to maintain user friendliness, imo it would be more user friendly to leave the up to 3 teams selected and then simply check if the new selected reserve team is 1 of the up to 3 'checked' teams.
Anyway, just some food for thought.
All good points that could be coded around if need be.
I was just trying to keep as close to OP's code as possible.
No sense for me to alter more unless OP cannot do it themselves.
Two excellent variations a solution. Will use one of them, depending which fits my original form the better, as they both have different merits. Hope someone else can use a similar solution too. Well done to you both.
Now then a snag with TIRNA way which I've tried first.
Form entry is fine but my form processor returns the following with no info for the selected teams in the south league as it did before.
I need this data i.e
south3: Cammell Laird
south5: Chasetown
south22: Witton Albion
but get only this...
the (chkTeam: Array) bit I can get around.
ReserveSouth: Belper Town
ReservePremier: Ashton United
ReserveNorth: AFC Fylde
chkTeam: Array
Now then a snag with TIRNA way which I've tried first.
Form entry is fine but my form processor returns the following with no info for the selected teams in the south league as it did before.
You didn't post any details at all in your original post regarding how the form data was going to be processed.
The code I posted simply meets the specifications in your original post.
If you need help with processing the form, maybe post your form processing code and what your required outputs are after processing.
btw - I don't normally click posted links in forums like this for obvious security reasons.
You need to substitute 'chkTeam' with whatever name your form data processing script expects and you must have [] at the end of your name as I have above since you are passing an array of checkboxes and not just a single checkbox to your processing script.
If you need further info on how html forms and <input> work, maybe have a look at the w3schools tute at:
ReserveSouth: Belper Town
ReservePremier: Ashton United
ReserveNorth: AFC Fylde
south1: Carlton Town
forms work ok but data sent back to me from the form is incomplete.
I don't understand the problem.
Will need to see the code you are using as the code I posted did not contain any actions/methods for the <form>
Possibly supply a link?
ReserveSouth: Belper Town
ReservePremier: Ashton United
ReserveNorth: AFC Fylde
south1: Carlton Town
forms work ok but data sent back to me from the form is incomplete.
is this the line thats wrong please
str += '<INPUT type="checkbox" value="'+Items[i]+'" name="south1">'+Items[i]+'<BR>';
I'm still confused.
What is being sent and what is incomplete?
What do you think is wrong with the <input...> line?
Your link to your page has 3 columns of selections, but only the first uses part of the code I provided.
Is the problem in that section or one of the other two?
Are you trying to get the same actions to occur for all 3 columns?
Can you give a little more description as to what should happen
when you select a particular combination of options vs. what does happen?
Reply With Quote
Another option ...
Originally Posted by JMRKER
More information about the problem please ...
Bookmarks