[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index]

[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 at 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 at pitt.edu 
> <mailto:bdgregg at 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/