Show Posts

1

Help for ParamQuery Select / Refresh the pqSelect list after an update

« on: April 07, 2015, 02:09:23 pm »

Hi,

I need you help again

I need to change the list of options of my element but I can't refresh the pqSelect list

When I load my page I run the function onload with a default list of options :

function onload() {
$("#identification_photographe").pqSelect({
multiplePlaceholder: 'Sélectionner les photographes',
deselect: true,
selectallText: 'Tout cocher',
checkbox: true,
maxSelect: 10,
maxDisplay: 10,
search: true
}).on("change", function(evt){
//var val = $(this).val();
//Sauvegarde_Champs(this.name, val, this.id);
});
}

But later on, I need to change the list of options and to refresh the pqSelect list using :

function update() {
....

var oSelect = document.getElementById('identification_photographe'),
opts = oSelect.getElementsByTagName('option');

while(opts[0]) {
oSelect.removeChild(opts[0]);
}

for(i=0; i<tab['photographe'].length; i++) {
oSelect.options[tab['photographe'].no] = new Option(tab['photographe'].prenom + ' ' + tab['photographe'].nom, tab['photographe'].no);
}

$( "identification_photographe" ).pqSelect( "refreshData" );
}

But the pqSelect is not refreshed...
Something that I did not understand.... but what ??

Thank you
Laurent

******************************* I solved it !
I forgot the # character in $( "#identification_photographe" ).pqSelect( "refreshData" );

Thank you anyway !!

2

Help for ParamQuery Select / [solved] Question about "pqSelect"

« on: March 03, 2015, 10:05:36 pm »

So good !!!

Nice tools and great support !!!

Everything solved !!!

Many thanks
Best regards
Laurent

3

Help for ParamQuery Select / Question about "pqSelect"

« on: March 03, 2015, 06:30:26 pm »

Hello everyone,

Sorry, I did not post at the correct place...

I'm trying to use the new functionality "pqSelect", but I fail.

I get something like the picture attached.
1. The list is by default opened - I would like it close as your example/demo (http://paramquery.com/select), open it only when we click on it.
2. There is a strange blue box (at the bottom of the list)
3. When I include this code in my form, the first click (in another input) gives the focus to this SELECT input... What I do not understand why ?

See below my simplified form :

<!doctype html>
<html lang="fr">
   <head>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
      <title>BioObs</title>
      <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
      <link rel="stylesheet" type="text/css" href="<?php echo $cur_dir; ?>jquery/jquery-ui.css" />
      <link rel="stylesheet" type="text/css" href="<?php echo $cur_dir; ?>jquery/pqselect.dev.css" />

      <script type="text/javascript" src="<?php echo $cur_dir; ?>jquery/jquery.js"></script>
      <script type="text/javascript" src="<?php echo $cur_dir; ?>jquery/jquery-1.11.1.js"></script>
      <script type="text/javascript" src="<?php echo $cur_dir; ?>jquery/jquery-ui.js"></script>
      <script type="text/javascript" src="<?php echo $cur_dir; ?>jquery/jquery-ui.min.js"></script>
      <script type="text/javascript" src="<?php echo $cur_dir; ?>jquery/pqselect.dev.js"></script>

      <script type="text/javascript">
        $(function() {
        $("#id_condition").pqSelect({
        multiplePlaceholder: 'Cliquer ici pour voir la liste',
        deselect: true,
        selectallText: 'Tout sélectionner',
        checkbox: true,
        search: false
        }).on("change", function(evt){
        var val = $(this).val();
        console.log('Sélectionné : ' + val);
        }).pqSelect( 'open' );
        });
      </script>
</head>

<body>
<form action="accueil.php" id="fvn" name="fvn" method="POST">
<section id="content" style="">
<div class="wrap-content">
<div id="box1" class="row box1" style="">
<input class="label" value="Conditions :" disabled="no" >
<select id="id_condition" class="saisie" style="display: inline-block;width:300px" multiple="multiple">
                 <option value="Normal"> Normal </option>
                 <option value="Faible houle"> Faible houle </option>
                 <option value="Forte houle"> Forte houle </option>
                 <option value="Vagues"> Vagues </option>
                 <option value="Courant faible"> Courant faible </option>
                 <option value="Courant fort"> Courant fort </option>
</select>
</div>
<div/>
</section>
</form>
</body>
</html>

What It wrong in my code ?
Is somebody have a simple example to compare/investigate between codes ?

Many thanks

Best regards
Laurent

Messages - windiver

Help for ParamQuery Select / Refresh the pqSelect list after an update

Help for ParamQuery Select / [solved] Question about "pqSelect"

Help for ParamQuery Select / Question about "pqSelect"