THELIA Forum

Welcome to the THELIA support and discusssion forum

Announcement

Rejoignez la communauté sur le Discord Thelia : https://discord.gg/YgwpYEE3y3

Offline

#1 Checkbox sur la fiche produit

(23-05-2015 19:59:58)

Bonjour,

Quelqu'un à une astuce simple pour mettre des checkbox à la place des selectbox sur la fiche produit ?

Merci d'avance !

Offline

#2 Re: Checkbox sur la fiche produit

(25-05-2015 09:55:13)

Bon apparement, pas si simple smile Un Freelance intéressé pour le faire ?

Offline

#3 Re: Checkbox sur la fiche produit

(25-05-2015 12:22:12)

Bonjour,

Il serait plutôt judicieux de mettre des boutons radio.
http://www.w3schools.com/html/html_forms.asp

Du coté php, on attend un id de pse. Il y a une partie javascript qui va changer la valeur du champ id="pse-id" en fonction des changements dans les selects, il va falloir  travailler sur cette partie.

Cordialement,

Last edited by MrGuillou (25-05-2015 12:30:20)

Développeur Web chez OpenStudio
Thelia Module, Thelia School, My GitHub, My Twitter

Offline

#4 Re: Checkbox sur la fiche produit

(25-05-2015 12:31:55)

Plus simple si vous n'avez pas des milliers de déclinaisons.

{form_field form=$form field='product_sale_elements_id'}
{loop name="pse" type="product_sale_elements" product="$ID"}
                    <label for="product-radio-{$ID}">
                        loop name="combi" type="attribute_combination" product_sale_elements="$ID"}
                        {if $LOOP_COUNT > 1}-{/if}
                        {$ATTRIBUTE_AVAILABILITY_TITLE}
                        {/loop}
                    </label>
                    <input id="product-radio-{$ID}" type="radio" name="{$name}" value="{$ID}" />
 {/loop}
{/form_field}

Avec cette solution, il vous faudra supprimer l'input hidden pse-id et les selects.

Cordialement,

Last edited by MrGuillou (25-05-2015 12:34:50)

Développeur Web chez OpenStudio
Thelia Module, Thelia School, My GitHub, My Twitter

Offline

#5 Re: Checkbox sur la fiche produit

(25-05-2015 15:07:28)

Merci pour votre aide. J'ai fait avancer le schmilblick :

Coté JS:

for (combinationValueId in PSE_COMBINATIONS_VALUE) {

                    combinationValue = PSE_COMBINATIONS_VALUE[combinationValueId];
                    console.log(combinationValue[1]);

                    $pse.options[combinationValue[1]]
              //            .append("<option value='" + combinationValueId + "'>"
              //          + combinationValue[0] + "</option>");
                .append("<input   name='option-"+combinationValue[1]+"' type='radio' value='" + combinationValueId + "'>"+combinationValue[0]);

                }

Coté Smarty:

<div id="option-{$ID}" name="option-{$ID}" class="form-control pse-option" data-attribute="{$ID}"></div>
 <!--<select id="option-{$ID}" name="option-{$ID}" class="form-control pse-option" data-attribute="{$ID}"></select>-->

Il me reste à appliquer le JS pour le calcul de prix ...

Last edited by xmickaelx (25-05-2015 15:08:08)

Offline

#6 Re: Checkbox sur la fiche produit

(25-05-2015 16:12:55)

Bon c'est réglé, reste qu'a cleaner le code mais voici la solution :

js/script.js 118

 var k=0;
                var checked ="";
                for (combinationValueId in PSE_COMBINATIONS_VALUE) {
                k++;

                    if(k>=2){
                        checked = "checked=checked";
                    }
                    combinationValue = PSE_COMBINATIONS_VALUE[combinationValueId];

                    $pse.options[combinationValue[1]]
              //         .append("<option value='" + combinationValueId + "'>"+ combinationValue[0] + "</option>");
                .append("<input "+checked+" id='option-"+combinationValue[1]+"' name='option-"+combinationValue[1]+"'  type='radio' value='" + combinationValueId + "'>"+combinationValue[0]);

                }

js/script.js
function getFormSelection

//A cleaner, mais vous avez l'idée ;)
var selection = [],
            combinationId;


        var var1 = $('input[name=option-1]:checked').val();
        var var2 = $('input[name=option-2]:checked').val();
        var var3 = $('input[name=option-3]:checked').val();

        selection.push(var1);
         selection.push(var2);
        selection.push(var3);

       // for (combinationId in $pse.options){

        //     selection.push($pse.options[combinationId].val());
        //}
        console.log(selection);

        return selection;

product.html:200

<div class="option-content">
                      <!--  <select id="option-{$ID}" name="option-{$ID}" class="form-control pse-option" data-attribute="{$ID}"></select> -->
                        <div id="option-{$ID}" name="option-{$ID}" class="form-control pse-option" data-attribute="{$ID}"></div>
                    </div>

En espérant que ça serve à quelqu'un ...