Skip to content

Categories:

CakePHP + plugin jQuery toCheckList

Si voleu fer servir el plugin de jQuery, toCheckList que coverteix els selects múltiples en quelcom més usable i que us funcioni correctament amb el CakePHP, haureu de fer el següent:

  • Al inicialitzar el plugin, fer-ho amb la opció ‘preferIdOverName‘ a false, ja que si no envia les dades al fer el submit sota l’id en lloc del nom del select que és el que espera el CakePHP:

    echo $this->Html->script(‘jquery.toChecklist.min’);
    echo $this->Html->css(‘jquery.toChecklist.min’);
    echo $this->Html->scriptBlock(“jQuery(function()
                   {
                        jQuery(‘#GroupGroup’).toChecklist({ preferIdOverName : false});
                   });
    “);

  • Editar el codi del plugin (fitxer jquery.toChecklist.min.js) i cercar la cadena:
    var checklistDivId='#'+checklistId;
  • Un cop trobada, la substituirem per la cadena:
    var checklistDivId='#'+checklistId.replace(/(\[|\])/g, '\\$1');

    Aquest petit canvi farà que el jQuery no tingui problemes amb els ids de camps que contenten cortxets ‘[]’, com ara els camps que genera el CakePHP que organitza els camps del formulari agrupant els diferents models del formulari en arrays. Un exemple seria aquest data[Group][Group].

Si tot ha funcionat correctament, ja tindrem el plugin reemplaçant els nostre select múltiple per un conjunt de checkboxs amb els estils correctes.

Actualització (10/08/2010):

Si volem fer servir la funcionalitat de cerca (addSearchBox) que proporciona el plugin del toCheckList (molt recomanable si tenim moltes opcions al desplegable), amb el CakePHP, novament haurem de tocar el codi del plugin per fer-ho funcionar:

  • Cercarem aquestes dues línies:

    $(‘#’+jSelectElemId+’_findInList’).css(‘width’,w);
    $(‘#’+jSelectElemId+’_findInList’)

  • I les subtituirem, com ja havíem fet anteriorment, per:

    $(‘#’+jSelectElemId.replace(/(\[|\])/g, ‘\\$1′)+’_findInList’).css(‘width’,w);
    $(‘#’+jSelectElemId.replace(/(\[|\])/g, ‘\\$1′)+’_findInList’)

Posted in Personal, Php.

Tagged with , , , .


0 Responses

Stay in touch with the conversation, subscribe to the RSS feed for comments on this post.



Some HTML is OK

or, reply to this post via trackback.