1

I read a lot the old forums of Cartthrob and here... Didn't find something to help me understand exactly how Hardcoded option work...

I'm trying to create what you can see in the capture screen that I just post.. All my html is done.

<div id="piping_color0" class="color_swatch" style="background:#FFFFFF; border:1px solid #ccc;"  onclick="javascript:ApplyBindingColor(169); setBorder(0,23,'binding'); makerequest();"><img src="images/colorblk.png" alt="White" title="White"></div>

But I can't figure out how to create the script for the hardcoded option... I you can juste tell me some idea ou link me some post or article that you know that can help me i will very apperciate :)

Thx Guys!

EDIT: Here some new developpement from my part!

I menage to use Matrix to create all the Entry; option_value, option_name color_code and Price. Now my problem is when i'm putting the code together i have a error when I reload my page.

Parse error: syntax error, unexpected 'endif' (T_ENDIF) in /home/hakounan/public_html/clients/ogilvy/system/expressionengine/libraries/Functions.php(680) : eval()'d code on line 1585

{exp:cartthrob:item_options entry_id="{entry_id}" row_id="{row_id}"}
    {options}       
    {if selected}
    {option_label}: {option_name}<br />

        {exp:channel:entries channel="products" dynamic="no"}
            {binding}
                <div id="{option_value}" class="color_swatch" style="background:#{color_code}; border:1px solid #ccc;"  onclick="javascript:ApplyBodyColor(187); setBorder(0,7,'body'); makerequest();"><img src="{site_url}assets/images/colorblk.png" alt="{option_value}" title="{option_name}"></div>
            {/binding}
        {/exp:channel:entries}
    {/if}    
    {/options}  
{/exp:cartthrob:item_options}

Piping option for Hardcoded Cartthrob Option..

Improve this question
2

If I'm understanding correctly, you're trying to set up those color swatches to be a clickable way to set an item option.

I'm assuming that your Matrix field is named "binding". Here is some code that will hopefully help you out. It uses a simple jquery click event to set the value of a text field that will be submitted when you add the product to your cart.

<html>
<head>
{!-- using the jquery module script tag here, but you can link to any jquery library --}
{exp:jquery:script_tag}
</head>
<body>
{exp:channel:entries channel="products" dynamic="no"}
    {exp:cartthrob:add_to_cart_form entry_id="{entry_id}"}
        {title}<br />
        {binding}
           <div id="{option_value}" class="color_swatch" style="background:#{color_code}; border:1px solid #ccc; width:50px; height:25px; display:block; float:left; margin: 10px;"></div>
        {/binding}
        <div style="clear:both;"></div>

        {!-- this is the input that will add the item option called "color" to your item in your order channel --}
        {!-- you can change this to type="hidden" if you don't want it shown --}
        <input type="text" name="item_options[color]" id="selected_color" /><br />

        <input type="submit" value="Add to Cart" />
    {/exp:cartthrob:add_to_cart_form}
{/exp:channel:entries}

 <script type="text/javascript">
 jQuery(document).ready(function($){
      $(".color_swatch").click(function(){
           $("#selected_color").val($(this).attr('id'));
      });
 });
 </script>
 </body>
 </html>
Improve this answer
2
  • Thx Alot for the Help! That exactly what I was looking for!!! Can I ask, one last thing? If I want the color in the cart fix ( the client won't be able to change what writhed in the color ) – Magalon Jan 31 '14 at 3:04
  • 1
    If you are trying to keep the customer from changing the color once it's added in an update_cart_form, you can search for the item option using an if statement in the item_options tag. Look for the option_field cartthrob.com/docs/tags_detail/item_options/#if-option_field – Chris Newton Jan 31 '14 at 4:48

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.