Hide/Show a DataList

[yamilbracho]

I have a DataList inside a accordion and after click a checkbox I want to show the datalist.
Initially, i specify display :none to hide the datalist, so :

Code:

               <div id='especialidadList'
                        class="easyui-datalist"
                        title="Especialidades"
                        style="width:400px; height:200px; display:none"
                        data-options="
                        fit : true,
                        lines : true,
                        checkbox: true,
                        url: './plan/crud_plan.php?action=FC',
                        valueField  : 'id_especialidad',
                        textField   : 'nb_especialidad',
                        selectOnCheck: false,
                        onBeforeSelect: function(){return false;}">
                </div>

When i run my app, the datalist is shown!!!
Also i add the change event code for the checkbox and add this code

Code:

      if (this.checked) {
                $('#cboEspecialidad').prop('disabled', false);
                $('#especialidadList').show();
            } else {
                $('#cboEspecialidad').prop('disabled', 'disabled'); 
                $('#especialidadList').hide();
            }
  

But 'especialidadList' (the datalist) does not set hide/show

TIA,
Yamil

[stworthy]

To show or hide the datalist, you must get the panel object first and then call 'open' or 'close' method.

Code:

var p = $('#especialidadList').datalist('getPanel');
p.panel('close');  // hide the datalist panel
p.panel('open');  // open the datalist panel

[yamilbracho]

Thanks a lot!!!!

[battlezad]

This also helped me, thank you