Prestashop Product Customizations - Saving To Cart

Question

Prestashop 1.6

I created a module that adds a form to the product page. I used the prestashop module generator to create a basic bare-bones module. It doesn't do anything except add a form to the product page via a hook.

I am using the default-bootstrap theme.

The form is generated via a .tpl file that is based on which category the product is in (i.e. if it's in category A, then it shows form A). The form looks like this:

<form id="engraving_selection">
    <h3>Engraving Options</h3>
    <input type="radio" name="engraving" value="Engrave-Different" id="engrave_different" checked="checked">Unique engraving for each item<br />
    <input type="radio" name="engraving" value="Engrave-Same" id="engrave_same">The engraving would the same on each item<br />
    <input type="radio" name="engraving" value="No-Engraving" id="no_engraving">I would not like engraving<br />
</form>
<form id="engraving_options">
    <h4>Engraving Text</h4>
    <div id="items">
        <div class="item" data-position="1">
            <h4 id="engraving-item">Item 1</h4>
            <label>Engraving Line 1: </label>
            <input type="text" class="engraving-input" name="line1-trophy" id="item1">
            <br />
            <label>Engraving Line 2: </label>
            <input type="text" class="engraving-input" name="line2-trophy" id="item1">
            <br />
            <label>Engraving Line 3: </label>
            <input type="text" class="engraving-input" name="line3-trophy" id="item1">
            <br />
        </div>
    </div>
</form>

The form is a selection of radio inputs, followed by 3 text inputs. If the user changes the quantity, an additional 3 inputs are added accordingly via javascript (so if the user changes the quantity to '2', then 2 sets of the 3 inputs appear for customization on each product).

I would like some guidance on saving these inputs and the information the user has entered when the user clicks 'add to cart' so that it may be retrieved / edited later (before the user checks out).

Some research has led me to ajax-cart.js and this function specifically:

add : function(idProduct, idCombination, addedFromProductPage, callerElement, quantity, whishlist)

What is the best way to do pass in that data so it can be saved/retrieved?

Ultimately I would like it to be included on the order (obviously) and saved to the database with that order for future use.

I know the plugin Attribute Wizard Pro exists - but I'm looking to expand my knowledge and make something on my own.

If there are other ways to go about this that would be cleaner/easier I'm open to those suggestions as well.

Answer 1

You can create a totally fresh solution, but it will take long time and many lines of code.

The best choice would be to use Prestashop built-in product Customization option.

1. Go to Backoffice and select a single Product Edit > Customization tab.
2. Add Text fields number which you can think can be a maximum for one product.

3. Add some javascript to your product page hiding / showing these text fields inputs (as they all would be visible on default).

   You can add your javascript code to:

   • themes/[your-theme]/product.js file (preferred) - it will be loaded only on the product page,
   • themes/[your-theme]/js/autoload/[any-file-name].js - it will be loaded on all pages.

   Please be sure to add buggy free code :)

Done!