Hi again,
Well, here is what I have so far. I'm still considering what else might be useful along these lines, perhaps exending it to handle other events, but for now hopefully it will be of use to some folks out there.
NOTE: This has been tested only on X-Cart 4.1.9
Step 1: Alteration to DB; we need a field to store our javascript code. Use your preferred mysql client to execute the following SQL:
Code:
ALTER TABLE xcart_product_options_js ADD custom_javascript_code TEXT;
Step 2: Modify the following PHP files:
a) $xcart_dir/modules/Product_Options/product_options.php
after ::
Code:
#
# Update Validation script (Javascript)
#
if ($geid && $fields['js']) {
while ($pid = func_ge_each($geid, 1)) {
change the two lines in the subsequent code that begin with 'func_array2insert' such that our new js code will be properly stored in the db ::
Code:
/* === BEGIN NTH PRODUCT OPTS JAVASCRIPT MOD === */
func_array2insert("product_options_js", array("productid" => $pid, "javascript_code" => $js_code, "custom_javascript_code" => $custom_js_code), true);
}
} else {
func_array2insert("product_options_js", array("productid" => $productid, "javascript_code" => $js_code, "custom_javascript_code" => $custom_js_code), true);
/* === END NTH PRODUCT OPTS JAVASCRIPT MOD === */
then, directly after ::
Code:
# Get the product options list
$product_options = func_get_product_classes($productid);
$product_options_ex = func_get_product_exceptions($productid);
$product_options_js = func_get_product_js_code($productid);
add the following line that retrieves our custom javascript from the db for a given product and stores it in the variable '$custom_product_options_js' ::
Code:
/* === BEGIN NTH PRODUCT OPTS JAVASCRIPT MOD === */
$custom_product_options_js = func_get_custom_product_js_code($productid);
/* === END NTH PRODUCT OPTS JAVASCRIPT MOD === */
then directly after the following ::
Code:
if (!empty($product_options_js))
$smarty->assign("product_options_js", $product_options_js);
add the following to pass that variable off to our smarty object ::
Code:
/* === BEGIN NTH PRODUCT OPTS JAVASCRIPT MOD === */
if (!empty($custom_product_options_js))
$smarty->assign("custom_product_options_js", $custom_product_options_js);
/* === END NTH PRODUCT OPTS JAVASCRIPT MOD === */
b) $xcart_dir/modules/Product_Options/func.php
after ::
Code:
#
# Get product JS code
#
function func_get_product_js_code($productid) {
global $sql_tbl;
return func_query_first_cell("SELECT javascript_code FROM $sql_tbl[product_options_js] WHERE productid = '$productid'");
}
add the following ::
Code:
/* === BEGIN NTH PRODUCT OPTS JAVASCRIPT MOD === */
function func_get_custom_product_js_code($productid) {
global $sql_tbl;
return func_query_first_cell("SELECT custom_javascript_code FROM $sql_tbl[product_options_js] WHERE productid = '$productid'");
}
/* === END NTH PRODUCT OPTS JAVASCRIPT MOD === */
c) $xcart_dir/modules/Product_Options/customer_options.php
after ::
Code:
$product_options = func_get_product_classes($productid, !empty($product_info['is_taxes']));
$product_options_ex = func_get_product_exceptions($productid);
$product_options_js = func_get_product_js_code($productid);
add the following ::
Code:
/* === BEGIN NTH PRODUCT OPTS JAVASCRIPT MOD === */
$custom_product_options_js = func_get_custom_product_js_code($productid);
/* === END NTH PRODUCT OPTS JAVASCRIPT MOD === */
then, after ::
Code:
$smarty->assign("err", $err);
$smarty->assign("product_options_count", is_array($product_options) ? count($product_options) : 0);
$smarty->assign("product_options_js", @trim($product_options_js));
add the following ::
Code:
/* === BEGIN NTH PRODUCT OPTS JAVASCRIPT MOD === */
$smarty->assign("custom_product_options_js", @trim($custom_product_options_js));
/* === END NTH PRODUCT OPTS JAVASCRIPT MOD === */
Step 3: Modify and/or create the following Smarty templates:
a) Create the file $xcart_dir/skin1/modules/Product_Options/custom_check_options_js.tpl ::
Code:
{* $Id: custom_check_options_js.tpl,v 1.0.0 2007/12/28 04:14:37 nth Exp $ *}
{* === BEGIN NTH PRODUCT OPTS JAVASCRIPT MOD === *}
<script type="text/javascript" language="JavaScript 1.2">
<!--
function custom_check_options() {ldelim}
{if $active_modules.Product_Options ne '' && $product_options ne ''}
{if $custom_product_options_js ne ''}
{$custom_product_options_js}
{/if}
{/if}
return true;
{rdelim}
-->
</script>
{* === END NTH PRODUCT OPTS JAVASCRIPT MOD === *}
b) $xcart_dir/skin1/modules/Product_Options/product_options.tpl
after ::
Code:
<table cellspacing="0" cellpadding="0" width="100%">
{if $geid ne ''}
<tr>
<td width="15" class="TableSubHead"><img src="{$ImagesDir}/spacer.gif" width="15" height="1" border="0" /></td>
<td class="TableSubHead"><b>* {$lng.lbl_note}:</b> {$lng.txt_edit_product_group}</td>
</tr>
{/if}
<tr>
{if $geid ne ''}<td width="15" class="TableSubHead"><input type="checkbox" value="Y" name="fields[js]" /></td>{/if}
<td><textarea name="js_code" cols="60" rows="15">{$product_options_js}</textarea></td>
</tr>
<tr>
{if $geid ne ''}<td width="15" class="TableSubHead"> </td>{/if}
<td> </td>
</tr>
add the following ::
Code:
{* === BEGIN NTH PRODUCT OPTS JAVASCRIPT MOD === *}
<tr>
{if $geid ne ''}<td width="15" class="TableSubHead"> </td>{/if}
<td>{$lng.txt_custom_product_options_js_note}</td>
</tr>
<tr>
{if $geid ne ''}<td width="15" class="TableSubHead"><input type="checkbox" value="Y" name="fields[js]" /></td>{/if}
<td><textarea name="custom_js_code" cols="60" rows="15">{$custom_product_options_js}</textarea></td>
</tr>
<tr>
{if $geid ne ''}<td width="15" class="TableSubHead"> </td>{/if}
<td> </td>
</tr>
{* === END NTH PRODUCT OPTS JAVASCRIPT MOD === *}
c) $xcart_dir/skin1/customer/main/product.tpl
near the top of the file, directly after ::
Code:
{include file="form_validation_js.tpl"}
add the following ::
Code:
{* ==== BEGIN NTH PRODUCT OPTS JAVASCRIPT MOD === *}
{include file="modules/Product_Options/custom_check_options_js.tpl"}
{* ==== END NTH PRODUCT OPTS JAVASCRIPT MOD === *}
Step 4: Modify the following Javascript file:
a) $xcart_dir/skin1/modules/Product_Options/func.js
after ::
Code:
/*
Rebuild page if some options is changed
*/
function check_options() {
add the following ::
Code:
// === BEGIN NTH PRODUCT OPTS JAVASCRIPT MOD ===
custom_check_options();
// === BEGIN NTH PRODUCT OPTS JAVASCRIPT MOD ===
Step 5: Add the following language variable - 'txt_custom_product_options_js_note' with the value:
Code:
Below you can write a client-side Javascript code that will be launched when a customer decides to add a product to cart and starts selecting options with which the product should be added. This script will execute when any options' onchange() event handler is triggered, rather than when the onsubmit() handler is triggered, as with the custom javascript textarea above. You need to have skills in Javascript programming to avoid errors on the customer frontend.
Usage: When administering a given product's options, you'll now find an additional textarea directly underneath the one used for custom form validation code on the customer front-end product detail page. The same notes apply - you need some familiarity with javascript to do anything useful, etc... The code gets executed by the same function that the stock x-cart code uses to handle various tasks when a product options' onchange() event is triggered, i.e. check_options().
a simple example (completely contrived - your code will need to refer to your specific product option variables, etc.):
Code:
var optid = document.getElementById('po3');
if (optid.value == '11') {
document.getElementById('product_avail').value = 5;
alert('qty modified!');
}
I hope this is useful to someone, and suggestions/improvements are most welcome.
Regards,
Nate