Adding a Custom Customer Drop-Down List to ACAD

[lesliekirk]

Today's ignorant questions (or in other words - code begs):

How do I add a Custom Customer Field Drop-Down List to the ACAD Page to allow the customer to select an option?

How do I have that data collected display on the ACED Page?

Sidenote - the site is still successfully using the EmporiumPlus Custom Customer Fields Interface to gather other info. Unfortunately, Bill didn't provide an example of how to use the Drop-Down List.

[Bruce - PhosphorMedia]

1) Create the Custom Field
2) On the ACAD screen, recreate the Select/Options of the custom field. (I don't think there is a way to do this dynamically as the custom field only stores the selected value.) Lets say you named the Select input field 'MyCustomStuff'.
3) Assuming the Select/Option field is withing the ACAD screen, that's all you need here.
4) On the ACED screen (I usually do this right after the html profile tag) write value selected on ACAD to the customer's custom field
<mvt:if expr="g.MyCustomStuff">
<mvt:item name="customfields" param="Write_Customer_ID( g.basket:cust_id, 'custom_field_code', g.MyCustomStuff)" />
</mvt:if>
<mvt:item name="customfields" param="Read_Customer_ID( g.basket:cust_id, 'custom_field_code', l.settings:customfields )" />

5) Use &mvt:customfields;value; to display the results captured from ACAD.

[lesliekirk]

2) On the ACAD screen, recreate the Select/Options of the custom field. (I don't think there is a way to do this dynamically as the custom field only stores the selected value.) Lets say you named the Select input field 'MyCustomStuff'.

This seems to be my stumbling block step.

[Bruce - PhosphorMedia]

Yea, it would be cool if there was an API call like

<mvt:item name="customfields" param="Read_Customer_Field( 'custom_field_code', l.settings:customfieldsCodes)" />

But its really straight forward. If the customer custom field was created like:

Code: myColors
Name: My Favorite Colors
Values: blue
red
green
gold

Then your select item looks like:

<select name="myColors">
<option value="blue"></option>
<option value="red"></option>
<option value="green"></option>
<option value="gold"></option>
</select>

And your read/write value are g.myColors

[lesliekirk]

Then shouldn't you just be able to use the item?

[Bruce - PhosphorMedia]

sorry, don't follow...which "item" and where? (going for more coffee so maybe i'll understand this later)

[lesliekirk]

sorry, don't follow...which "item" and where? (going for more coffee so maybe i'll understand this later)

The custom field (drop down) item - I'm guessing it won't display as a drop-down select list?

[Bruce - PhosphorMedia]

No, that only shows the values that get stored IN that custom field when an admin user selects it. Like I said, it'd be nice to have an SMT function that would create the select for you (and more importantly, auto update when new values are added) but its not that difficult to create the select item.

[lesliekirk]

Following up on this. I have the dropdown working but the store owner wants it to be part of the Ship To and Bill To. I've been able to add to that "area" of the form, but getting the info to fill over from the Ship To to the Bill To is going to be another story since I'm pretty sure that being done by something in the clientside.mvc - a file named ToogleDetails.js

Is it possible to somehow "add" the field to the CopyFields function? My javascript foo is very weak...

[kayakbabe]

Do you have tool belt? you could save them with a post_action screen (won't show to the customer) but then you can use miva script to write the fields to the custom customer fields data.

[Bruce - PhosphorMedia]

Following up on this. I have the dropdown working but the store owner wants it to be part of the Ship To and Bill To. I've been able to add to that "area" of the form, but getting the info to fill over from the Ship To to the Bill To is going to be another story since I'm pretty sure that being done by something in the clientside.mvc - a file named ToogleDetails.js

Is it possible to somehow "add" the field to the CopyFields function? My javascript foo is very weak...

The last time I saw a 'copy to' script it was actually on the OCST page, but its probably now in one of the "script" files for the theme...it should be easy if they kept the same method (and why not--it worked). The script just grabbed all the variables from Ship (or Bill) and copied them over to the other one so you just be able to add your form variables to that list.

[lesliekirk]

The last time I saw a 'copy to' script it was actually on the OCST page, but its probably now in one of the "script" files for the theme...it should be easy if they kept the same method (and why not--it worked). The script just grabbed all the variables from Ship (or Bill) and copied them over to the other one so you just be able to add your form variables to that list.

I "think" what you may be thinking about might be driven by this

<script src="&mvte:global:clientside_url;Store_Code=&mvta:store:code;&amp;Filename=ToggleDetails.js&amp;Primaddr=shipping&amp;Shipping=D&amp;Billing=O"></script>

[Bruce - PhosphorMedia]

If you have jQuery available, why not just do:

      $(document).ready(function()
      {
          $('#shipto-to-billto').click(function()
          {
               $('#ship-thisInputfield').val($('#bill-thisInputfield').val());
          });
      });

where
'#shipto-to-billto' is the id of the checkbox
#ship-thisInputfield is the id of the field you want to copy (may need to add)
'#bill-thisInputfield is the id of its billing equivalent.

This should negate digging through any existing scripts. could also be done is just plain js...simular but i'd have to think about the actual trigger code...

[lesliekirk]

Thanks Bruce. Here is what I put in place

  $(document).ready(function()
      {
          $('billing_to_show').click(function()
          {
               $('Customer_CCF_OM').val($('Customer_CCF_OM_B').val());
          });
      });

But I think I have an issue with the drop-down menu not retaining it's value if the page reloads due to something required being missing.

This is the on the ship-to coding

<mvt:item name="custedit" param="OM" />    
<mvt:if expr="g.error_messages AND ISNULL l.settings:custedit:current:value">
    <div class="&mvte:global:BillFirstName_Row; invalid">
<label class="required" for="Customer_&mvt:custedit:current:name;"><strong><span style="color:#FF0000;">&mvt:custedit:current:name;:</span></strong></label>
<mvt:else>
    <div class="&mvte:global:BillFirstName_Row;">
<label class="required" for="Customer_CCF_OM"><strong>&mvt:custedit:current:name;:</strong></label>    
    </mvt:if>
<input type="hidden" name="CFM_required[&mvte:custedit:current:id;]" value="1">

    <select name="CFM_value[&mvte:custedit:current:id;]" id="Customer_CCF_OM" class="input">
<option value="">Select</option>
        <option value="Owner">Owner</option>
        <option value="BuyerManager">Buyer/Manager</option>
        </select>
<input type="hidden" name="CFM_field[&mvte:custedit:current:id;]" value="1">
</div>

This is on the bill-to side (I had to remove the required because it was preventing customers from proceeding):

<mvt:item name="custedit" param="OM_B" />    
    <div class="&mvte:global:BillFirstName_Row;">
<label class="required" for="Customer_CCF_OM_B"><strong>&mvt:custedit:current:name;:</strong></label>    
<!-- <input type="hidden" name="CFM_required[&mvte:custedit:current:id;]" value="1"> -->

    <select name="CFM_value[&mvte:custedit:current:id;]" id="Customer_CCF_OM_B" class="input">
<option value="">Select</option>
        <option value="Owner">Owner</option>
        <option value="BuyerManager">Buyer/Manager</option>
        </select>
<input type="hidden" name="CFM_field[&mvte:custedit:current:id;]" value="1">
</div>

Here is the link to the page.