EPrints Technical Mailing List Archive

Message: #04601


< Previous (by date) | Next (by date) > | < Previous (in thread) | Next (in thread) > | Messages - Most Recent First | Threads - Most Recent First

[EP-tech] Re: Advanced Search Page render of large number of choices (such as language).


Hi,

(Sorry for my previous mail... accidently sent empty)

What we did on http://agritrop.cirad.fr/cgi/search/advanced was based on jQuery and the Chosen plugin.

First, we added the "search_input_style" option vith value "select" to our fields definition (cfg.d/eprint_fields.pl).

        # Pays de publication
        {
                name => 'pays_publication',
                type => 'namedset',
                set_name => 'pays_publication',
                input_style => 'short',
                search_input_style => 'select',
        },

It should be enough to get rid of the check boxes and replace them by a selection list.

But we also added a bit of jQuery on top of the selection list to make them easier to use. We chose Chosen (http://harvesthq.github.io/chosen/) but there exist alternatives like Selectivity (http://arendjr.github.io/selectivity/).

BTW, I don't know prototype.js but Chosen seems to be compatible with it (http://harvesthq.github.io/chosen/index.proto.html)

And eventually we added the code to replace select boxes by Chosen improved versions :

       --- In static/javascript/auto/xxxxx.js

       /*
       ** Autocomplétion dans les formulaires de recherche...
       **
       ** Chosen (http://harvesthq.github.io/chosen/)
       */

       jQuery(document).ready(function($){

          var $fields = $('table.ep_search_fields');

          //
          // Chosen - Amélioration de l'ergonomie des <select>
          //

          // On ajoute le "filter" juste pour être sûr qu'on traite
       bien des "select"
          $fields.find('#crd_titre_langue, #subjects, #axe_strategique,
       #congres_pays, #langue_resume, #pays_publication')
          .filter('select').chosen({
            allow_single_deselect: true,
            no_results_text: 'Oops, pas trouvé !',
            width: "95%",
            disable_search_threshold: 5,
            placeholder_text_multiple: 'Vous pouvez sélectionner une ou
       plusieurs valeurs',
            placeholder_text_single: 'Vous pouvez sélectionner une valeur'
          });

       });


Hope this helps,

Best regards,
GF


Le 31/08/2015 18:48, Brian D. Gregg a écrit :
>
> All,
>
>
>
> I’ve been asked to find out if there is a “better way” to render a field that has a large number of choices such as the language field that may have upwards of 140 languages all listed on the advanced search page as each individually with a check box. What I understand we are looking for is if there is a way to have this as a single select drop-down box or a multi-select drop-down box so that the languages field doesn’t take up so much real estate on the page.
>
>
>
> Any hints suggestions would be welcome.
>
>
>
> Thanks.
>
>
>
> Brian D. Gregg
>
> Solutions Architect | Manager Systems Development
>
> University of Pittsburgh | University Library System
>
> Address: 7500 Thomas Blvd.  Room 129 Pittsburgh, PA 15208
>
> Tel: (412) 648-3264 | Email: bdgregg@pitt.edu | Fax: (412) 648-3585
>
>
>
>
> *** Options: http://mailman.ecs.soton.ac.uk/mailman/listinfo/eprints-tech
> *** Archive: http://www.eprints.org/tech.php/
> *** EPrints community wiki: http://wiki.eprints.org/
> *** EPrints developers Forum: http://forum.eprints.org/



Le 31/08/2015 18:48, Brian D. Gregg a écrit :

All,

I’ve been asked to find out if there is a “better way” to render a field that has a large number of choices such as the language field that may have upwards of 140 languages all listed on the advanced search page as each individually with a check box. What I understand we are looking for is if there is a way to have this as a single select drop-down box or a multi-select drop-down box so that the languages field doesn’t take up so much real estate on the page.

Any hints suggestions would be welcome.

Thanks.

*Brian D. Gregg*

/Solutions Architect /|/Manager Systems Development/

University of Pittsburgh | University Library System

Address: 7500 Thomas Blvd. Room 129 Pittsburgh, PA 15208 <https://maps.google.com/maps?q=7500+Thomas+Blvd,+Pittsburgh,+PA&hl=en&sll=41.117935,-77.604698&sspn=7.662465,13.73291&oq=7500+Tho&t=h&hnear=7500+Thomas+Blvd,+Pittsburgh,+Pennsylvania+15208&z=17>

Tel: (412) 648-3264 | Email: bdgregg@pitt.edu <mailto:bdgregg@pitt.edu> | Fax: (412) 648-3585



*** Options: http://mailman.ecs.soton.ac.uk/mailman/listinfo/eprints-tech
*** Archive: http://www.eprints.org/tech.php/
*** EPrints community wiki: http://wiki.eprints.org/
*** EPrints developers Forum: http://forum.eprints.org/