Jump to content

js novice needs help consolidating simple (but long) script

glennn.php

By glennn.php
in Javascript Help

 Share

Recommended Posts

glennn.php Regular Member

glennn.php

Posted
Posted

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

Link to comment
Share on other sites
glennn.php Regular Member

glennn.php

Posted
  • Author
Posted

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

 

Link to comment
Share on other sites
brianlange Regular Member

brianlange

Posted
Posted

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> 

 

 

Link to comment
Share on other sites
Psycho Prolific Member

Psycho

Posted
Posted

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.

Link to comment
Share on other sites
This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to topic listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.