Compulsory Drop Downs before adding to cart

[Kwacker]

Hi,
I've searched the forums but don't seem to be able to find a solution to my problem. All I want to do is make sure the customer chooses an option from the various drop downs (colour, size etc) before the product is added to the shopping cart.
Anybody help?

Thanks in advance

[Stefko]

Try this in the AddToCart function:

Code: Select all

AdditionalInfoValue        = 'select';
AdditionalInfoPrompt       = 'Please select a Type';
AdditionalInfoValue2       = 'select';
AdditionalInfoPrompt2      = 'Please select a Style';
AdditionalInfoValue3       = 'select';
AdditionalInfoPrompt3      = 'Please select a Color';
AdditionalInfoValue4       = 'select';
AdditionalInfoPrompt4      = 'Please select a Size';

if(thisForm.ADDITIONALINFO!=null){
selectedObj = thisForm.ADDITIONALINFO[thisForm.ADDITIONALINFO.selectedIndex].value;
if (selectedObj == ''+AdditionalInfoValue+'') {
alert(''+AdditionalInfoPrompt+'');
return false;
}
}
if(thisForm.ADDITIONALINFO2!=null){
selectedObj2 = thisForm.ADDITIONALINFO2[thisForm.ADDITIONALINFO2.selectedIndex].value;
if (selectedObj2 == ''+AdditionalInfoValue2+'') {

alert(''+AdditionalInfoPrompt2+'');
return false;
}
}
if(thisForm.ADDITIONALINFO3!=null){
selectedObj3 = thisForm.ADDITIONALINFO3[thisForm.ADDITIONALINFO3.selectedIndex].value;
if (selectedObj3 == ''+AdditionalInfoValue3+'') {

alert(''+AdditionalInfoPrompt3+'');
return false;
}
}
if(thisForm.ADDITIONALINFO4!=null){
selectedObj4 = thisForm.ADDITIONALINFO4[thisForm.ADDITIONALINFO4.selectedIndex].value;
if (selectedObj4 == ''+AdditionalInfoValue4+'') {

alert(''+AdditionalInfoPrompt4+'');
return false;
}
}


[Kwacker]

Thanks a lot Stefko, I'll give it a try.

[Kwacker]

Hi Stefko,
That works a treat but there is just one thing. If you don't choose an option on the drop down and you click OK on the pop up window it still takes you to managecart.html instead of staying on the product page. Any ideas?

Thanks

[Kwacker]

Hi,
It's fine. I've done it. Just a simple case of not telling the form to go to managecart.html.
I've got a 'View Basket' link and a You have (x) products in your basket on each web page so if users need to see the contents they can click on that instead of constantly getting taken to the basket each time they add something.

One more mod I need help on and it's this - On several product pages there is a drop down which has 2 options. These are 'Logo' and 'Personalisation text'. If the user chooses the 'Personalisation text' option they need to type in their text in a text field below the drop down. What I need to make sure is that if they choose the 'personlisation text' option they cannot add the product to the shopping cart unless they have input their text.

Many thanks

[Stefko]

Right, what you need is a js validation that fires when the user clicks the "Add To Cart" button. if all is validated then the script should submit the form, else it returns false and alerts the user.

[Kwacker]

OK thanks. I'll do some research into it.
Also the compulsory drop down code you sent works fine in Firefox but doesn't work in IE. Do you know why?

Thanks

[Stefko]

Verify that your drop-down options includes the value="xxx", e.g. <option value="xxx">XXX</option>
or PM me a link to the product page in question

[Kwacker]

Thanks for your help. I'll try the code and if i don't have any joy i'll send you a PM.

Thanks again

[Stefko]

change your AddToCart Function to read:

Code: Select all


//---------------------------------------------------------------------||
// FUNCTION:    AddToCart                                              ||
// PARAMETERS:  Form Object                                            ||
// RETURNS:     Cookie to user's browser, with prompt                  ||
// PURPOSE:     Adds a product to the user's shopping cart             ||
//---------------------------------------------------------------------||
function AddToCart(thisForm) {
   var iNumberOrdered = 0;
   var bAlreadyInCart = false;
   var notice = "";
   iNumberOrdered = GetCookie("NumberOrdered");

   if ( iNumberOrdered == null )
      iNumberOrdered = 0;
   
   if ( thisForm.Thumb == null )
      strThumb = "";
   else
      strThumb = thisForm.Thumb.value;

   if ( thisForm.ID_NUM == null )
      strID_NUM    = "";
   else
      strID_NUM    = thisForm.ID_NUM.value;

   if ( thisForm.QUANTITY == null )
      strQUANTITY  = "1";
   else
      strQUANTITY  = thisForm.QUANTITY.value;

   if ( thisForm.PRICE == null )
      strPRICE     = "0.00";
   else
      strPRICE     = thisForm.PRICE.value;

   if ( thisForm.NAME == null )
      strNAME      = "";
   else
      strNAME      = thisForm.NAME.value;

   if ( thisForm.SHIPPING == null )
      strSHIPPING  = "0.00";
   else
      strSHIPPING  = thisForm.SHIPPING.value;

////////////////////////////////////////////////////////////////

    AdditionalInfoValue        = 'Please select';
    AdditionalInfoPrompt       = 'Please choose a colour';
    AdditionalInfoValue2       = 'Please select';
    AdditionalInfoPrompt2      = 'Please choose a print detail';
    AdditionalInfoValue3       = 'Please select';
    AdditionalInfoPrompt3      = 'Please choose a size';
    AdditionalInfoValue4       = 'Please select';
    AdditionalInfoPrompt4      = 'Please choose a club type';

    if(thisForm.ADDITIONALINFO!=null){
    selectedObj = thisForm.ADDITIONALINFO[thisForm.ADDITIONALINFO.selectedIndex].value;
    if (selectedObj == ''+AdditionalInfoValue+'') {
    alert(''+AdditionalInfoPrompt+'');
    return false;
    }
    }
    if(thisForm.ADDITIONALINFO2!=null){
    selectedObj2 = thisForm.ADDITIONALINFO2[thisForm.ADDITIONALINFO2.selectedIndex].value;
    if (selectedObj2 == ''+AdditionalInfoValue2+'') {

    alert(''+AdditionalInfoPrompt2+'');
    return false;
    }
    }
    if(thisForm.ADDITIONALINFO3!=null){
    selectedObj3 = thisForm.ADDITIONALINFO3[thisForm.ADDITIONALINFO3.selectedIndex].value;
    if (selectedObj3 == ''+AdditionalInfoValue3+'') {

    alert(''+AdditionalInfoPrompt3+'');
    return false;
    }
    }
    if(thisForm.ADDITIONALINFO4!=null){
    selectedObj4 = thisForm.ADDITIONALINFO4[thisForm.ADDITIONALINFO4.selectedIndex].value;
    if (selectedObj4 == ''+AdditionalInfoValue4+'') {

    alert(''+AdditionalInfoPrompt4+'');
    return false;
    }
    }

/////////////////////////////////////////////////////////////////////

   if ( thisForm.ADDITIONALINFO == null ) {
      strADDTLINFO = "";
   } else {
      strADDTLINFO = thisForm.ADDITIONALINFO[thisForm.ADDITIONALINFO.selectedIndex].value;
   }
   if ( thisForm.ADDITIONALINFO2 != null ) {
      strADDTLINFO += "; " + thisForm.ADDITIONALINFO2[thisForm.ADDITIONALINFO2.selectedIndex].value;
   }
   if ( thisForm.ADDITIONALINFO3 != null ) {
      strADDTLINFO += "; " + thisForm.ADDITIONALINFO3[thisForm.ADDITIONALINFO3.selectedIndex].value;
      }
   if ( thisForm.USERENTRY != null ) {
   strADDTLINFO += "; " + thisForm.USERENTRY.value;
    }
   if ( thisForm.ADDITIONALINFO4 != null ) {
      strADDTLINFO += "; " + thisForm.ADDITIONALINFO4[thisForm.ADDITIONALINFO4.selectedIndex].value;
   }
   if ( thisForm.USERENTRY2 != null ) {
   strADDTLINFO += "; " + thisForm.USERENTRY2.value;
   }
   if ( thisForm.USERENTRY3 != null ) {
   strADDTLINFO += "; " + thisForm.USERENTRY3.value;
   }

   //Is this product already in the cart?  If so, increment quantity instead of adding another.
   for ( i = 1; i <= iNumberOrdered; i++ ) {
      NewOrder = "Order." + i;
      database = "";
      database = GetCookie(NewOrder);

      Token0 = database.indexOf("|", 0);
      Token1 = database.indexOf("|", Token0+1);
      Token2 = database.indexOf("|", Token1+1);
      Token3 = database.indexOf("|", Token2+1);
      Token4 = database.indexOf("|", Token3+1);
     Token5 = database.indexOf("|", Token4+1);

      fields = new Array;
      fields[0] = database.substring( 0, Token0 );
      fields[1] = database.substring( Token0+1, Token1 );
      fields[2] = database.substring( Token1+1, Token2 );
      fields[3] = database.substring( Token2+1, Token3 );
      fields[4] = database.substring( Token3+1, Token4 );
      fields[5] = database.substring( Token4+1, database.length );
     fields[6] = database.substring( Token5+1, database.length );

if ( fields[0] == strThumb &&
fields[1] == strID_NUM &&
fields[3] == strPRICE &&
fields[4] == strNAME &&
fields[6] == strADDTLINFO
) {
bAlreadyInCart = true;
dbUpdatedOrder = strThumb + "|" +
strID_NUM + "|" +
(parseInt(strQUANTITY)+parseInt(fields[2])) + "|" +
strPRICE + "|" +
strNAME + "|" +
strSHIPPING + "|" +
strADDTLINFO;
strNewOrder = "Order." + i;
DeleteCookie(strNewOrder, "/");
SetCookie(strNewOrder, dbUpdatedOrder, null, "/");
notice = strQUANTITY + " " + strNAME + strAdded;
break;
}
}

if ( !bAlreadyInCart ) {
iNumberOrdered++;

if ( iNumberOrdered > 12 )
alert( strSorry );
else {
dbUpdatedOrder =
strThumb + "|" +
strID_NUM + "|" +
strQUANTITY + "|" +
strPRICE + "|" +
strNAME + "|" +
strSHIPPING + "|" +
strADDTLINFO;

strNewOrder = "Order." + iNumberOrdered;
SetCookie(strNewOrder, dbUpdatedOrder, null, "/");
SetCookie("NumberOrdered", iNumberOrdered, null, "/");
notice = strQUANTITY + " " + strNAME + strAdded;
}
}

if ( DisplayNotice )
alert(notice);
}