Search code examples
phphtmlprestashopprestashop-1.5prestashop-1.7

Display dropdown field by selecting dropdown list in prestashop helper classes back-office form


I want to display or hide some of fields according to change the drop down list in my back-office form, this is nit html form, its prestashop backoffice helper classes form

for i.e if Select Type is "category" in first dropdown list list then it should display the drop down for (Select category) and should hide other two dropdown(Select product,Select offer).

$this->fields_form = array(
    'legend' => array(
        'title' => $this->l('My Back offie form:'),
        'image' => _PS_ADMIN_IMG_ . 'information.png',
    ),
    'input' => array(
        array(
            'type' => 'select',
            'label' => $this->l('Select Type'),
            'name' => 'slider_type',
            'id' => 'slider_type',
            'options' => array(
                'query' => $slidertypes_option,
                'id' => 'slider_type',
                'name' => 'slider_type'
            )
        ),
        array(
            'type' => 'select',
            'label' => $this->l('Select Category'),
            'name' => 'id_category',
            'id' => 'id_category',
            'options' => array(
                'query' => $category_options,
                'id' => 'id_category',
                'name' => 'category_name'
            )
        ),
        array(
            'type' => 'select',
            'label' => $this->l('Select Offer'),
            'name' => 'id_category',
            'id' => 'id_category',
            'options' => array(
                'query' => $offers_options,
                'id' => 'id_category',
                'name' => 'category_name'
            )
        ),
        array(
            'type' => 'select',
            'label' => $this->l('Select Product'),
            'name' => 'id_product',
            'id' => 'product',

            'options' => array(
                'query' => $products,
                'id' => 'id_product',
                'name' => 'name'
            )
        ),
        //                                                            array(
        //                                                          
        'submit' => array(
            'title' => $this->l('Save'),
            'class' => 'button'
        ),
        'cancel' => array(
            'title' => $this->l('Cancel'),
            'class' => 'button'
        )
    );

so drop down field should display based on first drop down selection any idea please share.


Solution

  • Handle your form using jquery :

    $(document).ready(function(){    
    adminControl();
    $('#slider_type').change(function(){
        adminControl();
    });
    });
    function adminControl(){
    //main value
    var type_value = $('#slider_type').val();
    
    var handle1 = $('select#xxxx').parents().eq(2);
    var handle2 = $('select#yyyy').parents().eq(2);
    
    switch (type_value) {
        case 'category':
            handle1 .show(500);
            handle2 .hide(500);
            break;
        case 'cms':
            handle1 .hide(500);
            handle2 .show(500);
    }
    }