javascript deciding whether to set checkbox checked

When binding to a data list i use:
Select Case e.Item.ItemType
                Case ListItemType.Header
                Case ListItemType.AlternatingItem, ListItemType.Item
                    Select Case _enmMode
                        Case enumScreenMode.modeEditBasket
                            Dim checkbox As CheckBox
                            checkbox = e.Item.FindControl("chkCabinSelected")

                            checkbox.Attributes.Add("onclick", "CheckSingleCheckbox()")

                        Case enumScreenMode.modeToursBooking
                            'todo add script to constrain number of selections to _intNoCabinsRequired
                    End Select
            End Select

I have the javascript function(which is only half finished):
<script type="text/javascript">
        var boolCabinSelected;
        boolCabinSelected = false;
        function CheckSingleCheckbox()
        {  
            alert(boolCabinSelected);
            if (boolCabinSelected = false)'then we can allow the checkbox to be checked
            {
                alert("Danny Is A James Blunt");
                boolCabinSelected = true;              
            }  
else
{
here we need to not allow the checkbox to be checked in.

I am aware that i will need to pass the name of the checkbox in but am looking for some help on this as im not overly familiar with jscript as u might be noticing.

The checkboxes as present look like:
                                                <input id="dlCabins_ctl01_chkCabinSelected" type="checkbox" name="dlCabins$ctl01$chkCabinSelected" onclick="CheckSingleCheckbox();" />                                                

I'd appreciate some advice.

}        
        }
    </script>

What I need is initially the boolCabinSelected value to be false, then whenever a checkbox is clicked the checkbox name is passed into the function, so i can first say, are any checkboxes checked, i.e is boolCabinSelected = true, if they are then i want the popup to display and the tickbox that was ticked to not get ticked, i.e set to unchecked, and if false then allow the checkbox to be checked and set the value of boolCabinSelected to be true
scm0smlAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

scm0smlAuthor Commented:
sorry the function should read something like:
 function CheckSingleCheckbox()
        {  
            if (boolCabinSelected = false)'then we can allow the checkbox to be checked
            {
                 boolCabinSelected = true;              
            }  
else
{
here we need to not allow the checkbox to be checked
0
pkumarraCommented:
I hope this is what you want

<input id="dlCabins_ctl01_chkCabinSelected" type="checkbox" name="dlCabins$ctl01$chkCabinSelected" onclick="CheckSingleCheckbox(this);" />

function CheckSingleCheckbox(obj)
        {  
            if (!boolCabinSelected) //'then we can allow the checkbox to be checked
            {
                 boolCabinSelected = true;
              obj.checked = true;
            }  

}
0
scm0smlAuthor Commented:
Ok i have the following and it is working upto a point.

When first selecting an option it allows as there are no others selecting - fine.

But in the else statement i can never hit allert 3.

What is the ordering of when the checkbox gets ticked etc, as if boolCabinSelected = true then we jump into the else, but if the tickbox we have just ticked is not currently ticked then we should be hitting alert 3, this never happens.

Is the checkbox being checked before this statement?
<script type="text/javascript">
        var boolCabinSelected;
        boolCabinSelected = false;
        
        function CheckSingleCheckbox(obj)
        {   
            alert(boolCabinSelected);
            if (!boolCabinSelected) 
            {     
                alert("1");          
                boolCabinSelected = true; 
                obj.selected = true;          
            }
            else 
            {
                if (obj.selected = true)'will handle unticking the selected checkbox to allow for a new one to be selected.
                {
                    alert("2");          
                   boolCabinSelected = false ;
                   obj.selected = false;
                }
                else
                {
                    alert("3");          
                    alert("Only one cabin may be selected. You must de-select your previous choice before being able to select this cabin");
                   obj.selected = false;
                }
            }            
        }
    </script>

Open in new window

0
The Ultimate Tool Kit for Technolgy Solution Provi

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy for valuable how-to assets including sample agreements, checklists, flowcharts, and more!

b0lsc0ttIT ManagerCommented:
scm0sml,

You need to use the comparison operator in your Ifs.  For example ...

                if (obj.selected == true)

Of course this is assuming you are really trying to use Javascript.  The "comment" after that if isn't commented out.  Javascript comments use // instead of '.

Let me know if you have any questions or need more information.

b0lsc0tt
0
b0lsc0ttIT ManagerCommented:
scm0sml,

Notice I added the missing equal sign (==).  I corrected your snippet and posted it below.

Let me know if you have a question.

b0lsc0tt
<script type="text/javascript">
        var boolCabinSelected;
        boolCabinSelected = false;
        
        function CheckSingleCheckbox(obj)
        {   
            alert(boolCabinSelected);
            if (!boolCabinSelected) 
            {     
                alert("1");          
                boolCabinSelected = true; 
                obj.selected = true;          
            }
            else 
            {
                if (obj.selected == true)//will handle unticking the selected checkbox to allow for a new one to be selected.
                {
                    alert("2");          
                   boolCabinSelected = false ;
                   obj.selected = false;
                }
                else
                {
                    alert("3");          
                    alert("Only one cabin may be selected. You must de-select your previous choice before being able to select this cabin");
                   obj.selected = false;
                }
            }            
        }
    </script>

Open in new window

0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
scm0smlAuthor Commented:
yeah i had put the comment in just for this post, it isnt in my code.

Ok almost there now.

The only problem now is that when it hits the alert 3 section, it should b setting the obj.selected = false but the checkbox stays checked.

so basically they have tried to select a checkbox when one is already checked, they get the popup to tell them they cant do this, but the checkbox stays checked anyway?

any ideaS?
0
b0lsc0ttIT ManagerCommented:
It is probably obj.  What is used to call that function?

To test this theory try to reference the element with the document collection instead.  For example, instead of obj on that line use ...

document.forms[0].fieldName[0].checked = false;

This assumes it is in the first (or only form) and the checkbox is named fieldName and is the first box.

Let me know what you find out or if you have a question.

bol
0
scm0smlAuthor Commented:
it is called using                                                
<input id="dlCabins_ctl02_chkCabinSelected" type="checkbox" name="dlCabins$ctl02$chkCabinSelected" onclick="CheckSingleCheckbox(this);" />                                                
0
b0lsc0ttIT ManagerCommented:
Thanks.  What is the result if you use ...

document.getElementById('dlCabins_ctl02_chkCabinSelected').checked = false;

bol
0
b0lsc0ttIT ManagerCommented:
Actually are you sure about the alert 3 thing??  Going from the code as I last saw it (see my post) alert 3 should only appear if that box isn't checked.  Please either update the code or clarify the problem you just asked about.  Alert 2 and 3 seem to do the same thing to the checkbox.

bol
0
scm0smlAuthor Commented:
Ok function attached.

For what was alert 2, we were saying, ok a checkbox that IS checked has just been unchecked so untick it.

For what was alert 3 we were saying ok this checkbox has been checked, but another checkbox has already been checked so we give an error popup message and make sure the checkbox that was just ticked doesnt actually get set as ticked.

Comprende? :)
function CheckSingleCheckbox(checkbox,newcabinid)
        {   
            
            if (!boolCabinSelected)//if no cabin has been selected 
            {                     
                boolCabinSelected = true; //set our global flag
                checkbox.selected = true;
                form1.hddnCabinID.value = newcabinid //populate our hidden field with the cabin id.
            }
            else 
            {
                if (checkbox.selected == true)//we are unchecking the currently ticked checkbox
                {                    
                   boolCabinSelected = false ;//set flag to allow other cabins to be selected
                   checkbox.selected = false;
                   form1.hddnCabinID.value = 0 //reset hidden field value
                }
                else //else the user is trying to select a 2nd cabin which is not allowed so we prompt the user advising.
                {                    
                    alert("Only one cabin may be selected. You must de-select your previous choice before being able to select this cabin.");                    
                    checkbox.selected = false; //and de-select the choice they have just made.
                }
            }            
        }

Open in new window

0
scm0smlAuthor Commented:
and what is happening at the moment is that theuy get the popup fine saying they cannot enter more than 2....

the next line is then:
checkbox.selected = false

but for whatever reason the checkbox stays checked?
0
b0lsc0ttIT ManagerCommented:
I will look over your last posts.  What was the result of trying http:#20746784 ?

bol
0
b0lsc0ttIT ManagerCommented:
You use a variable name that will probably cause problems.  Change checkbox to something else.  For example (see snippet).  Let me know if that works.

bol
function CheckSingleCheckbox(checkbox,newcabinid)
        {   
            
            if (!boolCabinSelected)//if no cabin has been selected 
            {                     
                boolCabinSelected = true; //set our global flag
                checkbox.selected = true;
                form1.hddnCabinID.value = newcabinid //populate our hidden field with the cabin id.
            }
            else 
            {
                if (checkbox.selected == true)//we are unchecking the currently ticked checkbox
                {                    
                   boolCabinSelected = false ;//set flag to allow other cabins to be selected
                   checkbox.selected = false;
                   form1.hddnCabinID.value = 0 //reset hidden field value
                }
                else //else the user is trying to select a 2nd cabin which is not allowed so we prompt the user advising.
                {                    
                    alert("Only one cabin may be selected. You must de-select your previous choice before being able to select this cabin.");                    
                    checkbox.selected = false; //and de-select the choice they have just made.
                }
            }            
        }

Open in new window

0
scm0smlAuthor Commented:
am i being an idiot or has your snippet not changed?
0
scm0smlAuthor Commented:
this seems to be having a better affect:
document.getElementById('dlCabins_ctl02_chkCabinSelected').checked = false;

but obviously for the one checkbox, how do i refereence which ever one i passed in.

I'm trying to use:
document.getElementById(checkbox).checked = false; where checkbox was the parameter passed in.

but this isnt working, do i need to reference checkbox.name or .id somehow instead?
0
b0lsc0ttIT ManagerCommented:
You aren't an idiot at all; I messed up trying to do a copy and just copied your code instead of my modified version.  I have posted the code I meant to post in the snippet below.  Basically I renamed the checkbox variable to myCheckbox.

Since my other recommendation worked then it probably is the name you used for the variable.  If that is the problem then this will fix it (using myCheckbox instead of checkbox).  The word checkbox is a reserved word in some ways and should not be used for a variable name.

bol
function CheckSingleCheckbox(myCheckbox,newcabinid)
        {   
            
            if (!boolCabinSelected)//if no cabin has been selected 
            {                     
                boolCabinSelected = true; //set our global flag
                myCheckbox.selected = true;
                form1.hddnCabinID.value = newcabinid //populate our hidden field with the cabin id.
            }
            else 
            {
                if (myCheckbox.selected == true)//we are unchecking the currently ticked checkbox
                {                    
                   boolCabinSelected = false ;//set flag to allow other cabins to be selected
                   myCheckbox.selected = false;
                   form1.hddnCabinID.value = 0 //reset hidden field value
                }
                else //else the user is trying to select a 2nd cabin which is not allowed so we prompt the user advising.
                {                    
                    alert("Only one cabin may be selected. You must de-select your previous choice before being able to select this cabin.");                    
                    myCheckbox.selected = false; //and de-select the choice they have just made.
                }
            }            
        }
 

Open in new window

0
scm0smlAuthor Commented:
still no joy im afraid?

seems strange  that the checks using myCheckbox.selected  are working fine but then setting the actual value doesnt.......

any ideas?
0
hieloCommented:
I barely saw your request on the other thread. Try the code below.
function CheckSingleCheckbox(myCheckbox,newcabinid)
        {   
            
            if (!boolCabinSelected)//if no cabin has been selected 
            {                     
                boolCabinSelected = true; //set our global flag
                myCheckbox.checked = true;
                form1.hddnCabinID.value = newcabinid //populate our hidden field with the cabin id.
            }
            else 
            {
                if (myCheckbox.checked == true)//we are unchecking the currently ticked checkbox
                {                    
                   boolCabinSelected = false ;//set flag to allow other cabins to be selected
                   myCheckbox.checked = false;
                   form1.hddnCabinID.value = 0 //reset hidden field value
                }
                else //else the user is trying to select a 2nd cabin which is not allowed so we prompt the user advising.
                {                    
                    alert("Only one cabin may be selected. You must de-select your previous choice before being able to select this cabin.");                    
                    myCheckbox.checked = false; //and de-select the choice they have just made.
                }
            }            
        }

Open in new window

0
scm0smlAuthor Commented:
nope still leaving the checkbox checked?

this is driving me nuts......

Why is the check if (myCheckbox.checked == true) working but then using the same thing to set the checked value not?
0
scm0smlAuthor Commented:
i was being an idiot hielo, it did work.

Cheers for finishing this off for me!
0
b0lsc0ttIT ManagerCommented:
I'm glad I could help.  Thanks for the grade, the points and the fun question.

bol
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
JavaScript

From novice to tech pro — start learning today.