js novice needs help consolidating simple (but long) script

[glennn.php]

i know VERY little of js - but i'm SURE this could be consolidated (it works fine, it's just a little obtuse, i think):

 

var dr=new Array();
dr=document.getElementsByName("drink[]");
var dri=-1;
for(i=0;i<dr.length;i++){
	if(dr[0].checked){
		dri=0;
	}
	if(dr[1].checked){
		dri=1;
	}
	if(dr[2].checked){
		dri=2;
	}
	if(dr[3].checked){
		dri=3;
	}
	if((dr[1].checked) && (dr[2].checked)){
		dri=4;
	}
	if((dr[1].checked) && (dr[3].checked)){
		dri=5;
	}
	if((dr[2].checked) && (dr[3].checked)){
		dri=6;
	}
	if((dr[1].checked) && (dr[2].checked) && (dr[3].checked)){
		dri=7;
	}
}
if (dri == -1){
	alert('please indicate whether or not you drink alcohol');
	return false;

}


var br=new Array();
br=document.getElementsByName("beer[]");
var beer=0;
for(i=0;i<br.length;i++){
	if(br[i].checked){
		beer=1;
	}
}

var wn=new Array();
wn=document.getElementsByName("wine[]");
var wine=0;
for(i=0;i<wn.length;i++){
	if(wn[i].checked){
		wine=1;
	}
}

var li=new Array();
li=document.getElementsByName("liquor[]");
var liq=0;
for(i=0;i<li.length;i++){
	if(li[i].checked){
		liq=1;
	}
}


if ((dri == 1) && (beer == 0)) {
	alert('beer');
	return false;
}

if ((dri == 2) && (wine == 0)) {
	alert('wine');
	return false;
}

if ((dri == 3) && (liq == 0)) {
	alert('liquor');
	return false;
}

if ((dri == 4) && (beer == 0) && (wine == 0)) {
	alert('beer and wine');
	return false;
}

if ((dri == 4) && (beer == 0) && (wine == 1)) {
	alert('beer');
	return false;
}

if ((dri == 4) && (beer == 1) && (wine == 0)) {
	alert('wine');
	return false;
}

if ((dri == 5) && (beer == 0) && (liq == 0)) {
	alert('beer and liquor');
	return false;
}

if ((dri == 5) && (beer == 0) && (liq == 1)) {
	alert('beer');
	return false;
}

if ((dri == 5) && (beer == 1) && (liq == 0)) {
	alert('liquor');
	return false;
}

if ((dri == 6) && (wine == 0) && (liquor == 0)) {
	alert('wine and liquor');
	return false;
}

if ((dri == 6) && (wine == 0) && (liquor == 1)) {
	alert('wine');
	return false;
}

if ((dri == 6) && (wine == 1) && (liquor == 0)) {
	alert('liquor');
	return false;
}

if ((dri == 7) && (beer == 0) && (wine == 0) && (liq == 0)) {
	alert('beer and wine and liquor');
	return false;
}

if ((dri == 7) && (beer == 0) && (wine == 0) && (liq == 1)) {
	alert('beer and wine');
	return false;
}

if ((dri == 7) && (beer == 0) && (wine == 1) && (liq == 0)) {
	alert('beer and liquor');
	return false;
}

if ((dri == 7) && (beer == 0) && (wine == 1) && (liq == 1)) {
	alert('beer');
	return false;
}


if ((dri == 7) && (beer == 1) && (wine == 0) && (liq == 0)) {
	alert('wine and liquor');
	return false;
}


if ((dri == 7) && (beer == 1) && (wine == 0) && (liq == 1)) {
	alert('wine');
	return false;
}


if ((dri == 7) && (beer == 1) && (wine == 1) && (liq == 0)) {
	alert('liquor');
	return false;
}

 

can someone kindly show me how this might be shortened...?

 

i'm grateful -

 

GN

[brianlange]

can you post some html and indicate what it is you are trying to accomplish?

 

[glennn.php]

very grateful, thanks

 

part of the form:

<div class="oneField">
          <label class="preField">Do you drink alcohol?</label>
          <span class="oneChoice">
          <input type="checkbox" value="No" name="drink[]">
          <label for="No" class="postField">No</label>
          </span>
          <span class="oneChoice">
          <input type="checkbox" value="Beer" id="beer" name="drink[]">
          <label for="Beer" class="postField">Beer</label>
          </span>
          <span class="oneChoice">
          <input type="checkbox" value="Wine" id="wine" name="drink[]">
          <label for="Beer" class="postField">Wine</label>
          </span>
          <span class="oneChoice">
          <input type="checkbox" value="Liquor" id="liquor" name="drink[]">
          <label for="Beer" class="postField">Liquor</label>
          </span>
        </div>

<div style="float:left; width:220px;">
    <input type="checkbox" name="beer[]" value="Miller Lite">
    Miller Lite<br />
    <input type="checkbox" name="beer[]" value="Modelo">
    Modelo<br />
    <input type="checkbox" name="beer[]" value="Molson">
    Molson<br />
    <input type="checkbox" name="beer[]" value="Natural Lite">
    Natural Lite<br />
    <input type="checkbox" name="beer[]" value="Pabst Blue Ribbon">
    Pabst Blue Ribbon<br />
    <input type="checkbox" name="beer[]" value="Rolling Rock">
    Rolling Rock<br />
    <input type="checkbox" name="beer[]" value="Sam Adams">
    Sam Adams<br />
    <input type="checkbox" name="beer[]" value="St. Pauli Girl">
    St. Pauli Girl<br />
    <input type="checkbox" name="beer[]" value="Tecate">
    Tecate<br />
    <input type="checkbox" name="beer[]" value="Yuengling">
    Yuengling<br />
  </div>
  <div style="clear:left; padding-left:5px; margin-bottom:10px;"> Other
    <input id="ber" name="beer[]" />
  </div>

// AND WINE AND LIQUOR...

 

just trying to validate that at least one BEER option has a value IF "drink[], beer" is checked, and wine and liquor...

 

thanks for your help very much,

 

GN

 

[brianlange]

Here's the script using jquery (http://jquery.org/)

 

I created a button with an id of "drinkButton". this is assigned an onclick event.

 

A div with an id of "drinkChoice" wraps the "Beer" "Wine","Liquor" selection.

jquery can find all of the checked checkboxes in this div with the following code:

 

var choices = '';

var ds = $('#drinkChoice').find(":checked").each(function(){

              choices += $(this).val() + ",";

});

 

I then check if beer is one of the choices. If it is and a beer has not been selected then there's an alert for a selection to be made.

 

 

 

 

 

 

 

 

    $(document).ready(function() { 

 

        $("#drinkButton").click(function(event) {

           

         

          var choices = "";

          var ds = $('#drinkChoice').find(":checked").each(function(){

              choices += $(this).val() + ",";

          });

         

          if (choices.indexOf('Beer') != -1) {

             

              var beerCB = $('#beerSelection').find(':checked');

             

               

              if (beerCB.length == 0) {

                    alert('please select a beer');

                } else {

                    alert('good choice');

                }

           

          }

       

        });

     

    });

 

 

<form id="drinkz" action="#">

 

<div class="oneField" id="drinkChoice">

          <label class="preField">Do you drink alcohol?</label>

          <span class="oneChoice">

          <input type="checkbox" value="No" name="drink">

          <label for="No" class="postField">No</label>

          </span>

          <span class="oneChoice">

          <input type="checkbox" value="Beer" id="beer" name="drink">

          <label for="Beer" class="postField">Beer</label>

          </span>

          <span class="oneChoice">

          <input type="checkbox" value="Wine" id="wine" name="drink">

          <label for="Beer" class="postField">Wine</label>

          </span>

          <span class="oneChoice">

          <input type="checkbox" value="Liquor" id="liquor" name="drink">

          <label for="Beer" class="postField">Liquor</label>

          </span>

</div>

 

<div style="float:left; width:220px;" id="beerSelection">

    <input type="checkbox" name="beer[]" value="Miller Lite">

    Miller Lite<br />

    <input type="checkbox" name="beer[]" value="Modelo">

    Modelo<br />

    <input type="checkbox" name="beer[]" value="Molson">

    Molson<br />

    <input type="checkbox" name="beer[]" value="Natural Lite">

    Natural Lite<br />

    <input type="checkbox" name="beer[]" value="Pabst Blue Ribbon">

    Pabst Blue Ribbon<br />

    <input type="checkbox" name="beer[]" value="Rolling Rock">

    Rolling Rock<br />

    <input type="checkbox" name="beer[]" value="Sam Adams">

    Sam Adams<br />

    <input type="checkbox" name="beer[]" value="St. Pauli Girl">

    St. Pauli Girl<br />

    <input type="checkbox" name="beer[]" value="Tecate">

    Tecate<br />

    <input type="checkbox" name="beer[]" value="Yuengling">

    Yuengling<br />

  </div>

  <div style="clear:left; padding-left:5px; margin-bottom:10px;"> Other

    <input id="ber" name="beer[]" />

  </div>

  <div id="submit-form">

    <input id="drinkButton" type="button" value="Submit Drink Order">

  </div>

</form> 

 

 

[glennn.php]

awesome, can't wait to look this over -

 

you'll see the ENTIRE form here, just in case  you're curious:

 

www.glennnall.com/perimeterresearch

 

thanks again for your time and trouble...

 

GN

[Psycho]

There is a problem with your form. There is a question for "Do you drink alcohol?" with four checkbox options:

No, Beer, Wine, Liquor. So, the form allows the user to select No and one of the three Yes options concurrently. The question should be something such as "Select the types of alcohol that you drink" and just drop the No option as that would be assumed if the user didn't select any options.