Visualizzazione dei risultati da 1 a 10 su 10
  1. #1

    Datatable checkbox selezionati in altre pagine

    Salve a tutti ho una datatable con paginazione automatica ( di default datatable) , alla prima colonna ho un checkbox con value = all'id del record del database , quando seleziono i singoli checkbox su pagine diverse mi riporta solamente quello della pagina visibile .

    Il tutto funziona invece se seleziono tutti i valori con questa funzione :

    codice:
    $( "#seleziona_tutto" ).change(function() {
    
    
                    var checked ;
    
    
                    if($("#seleziona_tutto").is(':checked')){
    
    
                        checked = 1 ;
                    
                    }else{
    
    
                        checked = 0 ;
                    }
    
    
                  
                    table.column(0).nodes().to$().each(function(index) {    
                        if (checked) {
                          $(this).find('.scegli_viaggi').prop('checked', 'checked');
                        } else {
                          //$(this).find('.scegli_viaggi').removeProp('checked');            
                          $(this).find('.scegli_viaggi').prop('checked', false);            
                        }
                      });    
                    table.draw()
    
    
                });
    Come posso fare per i singoli record ?

  2. #2
    Quote Originariamente inviata da pippuccio76 Visualizza il messaggio
    Salve a tutti ho una datatable con paginazione automatica ( di default datatable) , alla prima colonna ho un checkbox con value = all'id del record del database , quando seleziono i singoli checkbox su pagine diverse mi riporta solamente quello della pagina visibile .

    Il tutto funziona invece se seleziono tutti i valori con questa funzione :

    codice:
    $( "#seleziona_tutto" ).change(function() {
    
    
                    var checked ;
    
    
                    if($("#seleziona_tutto").is(':checked')){
    
    
                        checked = 1 ;
                    
                    }else{
    
    
                        checked = 0 ;
                    }
    
    
                  
                    table.column(0).nodes().to$().each(function(index) {    
                        if (checked) {
                          $(this).find('.scegli_viaggi').prop('checked', 'checked');
                        } else {
                          //$(this).find('.scegli_viaggi').removeProp('checked');            
                          $(this).find('.scegli_viaggi').prop('checked', false);            
                        }
                      });    
                    table.draw()
    
    
                });
    Come posso fare per i singoli record ?

    Scusate in realtà la funzione che controlla tutti i checkbox di tutta la datatable è questa :


    codice:
    
    
                $('form').on('submit', function(e){
                   var $form = $(this);
    
    
                    // Iterate over all checkboxes in the table
                    table.$('input[type="checkbox"]').each(function(){
                        // If checkbox doesn't exist in DOM
                        if(!$.contains(document, this)){
                           // If checkbox is checked
                            if(this.checked){
                            
                                // Create a hidden element 
                                $form.append(
                                    $('<input>')
                                        .attr('type', 'hidden')
                                        .attr('name', this.name)
                                        .val(this.value)
                                );
                            
                            }else{
    
    
    
    
                                // remove input type hidden
                                $("input[type='hidden']").remove();
                                
    
    
                            }
                        } 
                    });          
                });
    Ma non funziona con i checkbox selezionati singolarmente ma solo con tutti

  3. #3
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,283
    Ciao, non uso quel plugin. Da quel che posso intuire, ciò che viene mostrato a video è solo un "clone" della parte di contenuto che sta nell'oggetto table. Deduco quindi che i checkbox "cloni" non siano connessi con l'oggetto originario; per tale motivo, anche selezionandoli a video, non risulteranno selezionati in table.

    Bisognerebbe capire come puoi "connettere" l'istanza mostrata a video, con il relativo oggetto originario.

    Il primo script che hai postato, riguardo "seleziona tutto", va a ciclare tutti i nodi della tabella e, per ciascuno, va a cercare l'elemento ".scegli_viaggi" per renderlo checked o no.

    Nel tuo caso, per "fissare" il check agendo sul singolo checkbox, bisogna capire come relazionare ogni checkbox al suo corrispettivo elemento originario che sta dentro table.

    Presumo sia necessario prima di tutto aggiungere un gestore per l'evento "change" dei vari checkbox; eventualmente delegando l'evento sul contenitore dove è mostrata la tabella. Bisogna conoscere il contesto html della tabella per capire come intervenire.

    In secondo luogo, dentro il gestore dell'evento, potrebbe essere necessario recuperare il riferimento della riga relativa al checkbox su cui si sta agendo (potrebbe essere un tr=$(this).closest('tr')), per poi andare a selezionare tale riga nell'oggetto originario (potrebbe essere un table.row(tr)) e beccare il checkbox della prima colonna. A quel punto presumo sia possibile "fissare" il checked su tale elemento.

    Ripeto, non conosco e non ho mai usato tale plugin; se puoi postare un esempio della pagina in azione, potrei provare ad indagare meglio, altrimenti attendi eventuali altre risposte.
    Prima di postare considera che tra i link utili puoi trovare il 75% delle risposte alle tue domande; il 20% tra i post del forum; il 15% sul web. Ti resta... humm spè
    Le cattive domande sono quelle che non meritano risposta, le buone domande sono quelle che non hanno risposta
    L'Itailano non e nu'opnioine. E' improntate uslaro correattemtne sul froum. Garize!

    "Mi son documentato"

  4. #4
    Quote Originariamente inviata da KillerWorm Visualizza il messaggio
    Ciao, non uso quel plugin. Da quel che posso intuire, ciò che viene mostrato a video è solo un "clone" della parte di contenuto che sta nell'oggetto table. Deduco quindi che i checkbox "cloni" non siano connessi con l'oggetto originario; per tale motivo, anche selezionandoli a video, non risulteranno selezionati in table.

    Bisognerebbe capire come puoi "connettere" l'istanza mostrata a video, con il relativo oggetto originario.

    Il primo script che hai postato, riguardo "seleziona tutto", va a ciclare tutti i nodi della tabella e, per ciascuno, va a cercare l'elemento ".scegli_viaggi" per renderlo checked o no.

    Nel tuo caso, per "fissare" il check agendo sul singolo checkbox, bisogna capire come relazionare ogni checkbox al suo corrispettivo elemento originario che sta dentro table.

    Presumo sia necessario prima di tutto aggiungere un gestore per l'evento "change" dei vari checkbox; eventualmente delegando l'evento sul contenitore dove è mostrata la tabella. Bisogna conoscere il contesto html della tabella per capire come intervenire.

    In secondo luogo, dentro il gestore dell'evento, potrebbe essere necessario recuperare il riferimento della riga relativa al checkbox su cui si sta agendo (potrebbe essere un tr=$(this).closest('tr')), per poi andare a selezionare tale riga nell'oggetto originario (potrebbe essere un table.row(tr)) e beccare il checkbox della prima colonna. A quel punto presumo sia possibile "fissare" il checked su tale elemento.

    Ripeto, non conosco e non ho mai usato tale plugin; se puoi postare un esempio della pagina in azione, potrei provare ad indagare meglio, altrimenti attendi eventuali altre risposte.
    Ma perchè ( il secondo script funziona se seleziono tutto tramite checkbox iniziale ) mentre non funziona se seleziono solamente alcuni , non cicla comunque l'intera tabella ?

  5. #5
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,283
    non cicla comunque l'intera tabella ?
    Certo ma penso proprio che il problema sia a monte, cioè l'oggetto table originario che viene ciclato (cioè l'istanza del datatable) non viene aggiornato nel momento in cui tu agisci sugli elementi cloni (cioè la rappresentazione a schermo). Anche se a schermo agisci sui checkbox, in realtà nell'oggetto table non succede proprio nulla.

    Non ne sono sicuro ma mi pare che funzioni più o meno in quel modo.

    Nell'evento change di #seleziona_tutto, puoi notare infatti che vengono ciclati i nodi dell'oggetto table e, trovati i relativi checkbox, ne viene aggiornato il valore.

    Nel submit vengono quindi ciclati i checkbox che stanno dentro table, non quelli che stanno a video, per cui viene creata una copia momentanea dentro il form, in modo che tali dati siano trasmessi al server.

    Nel tuo caso quindi è necessario aggiornare singolarmente il checkbox che sta dentro table, in base al suo clone a video che vai a manovrare. Se le API del plugin non permettono di "collegare" in modo semplice i controlli che sono dentro l'istanza datatable, con quelli rappresentati a video, allora dovrai farlo manualmente. Ti ho già indicato a grandi linee i passi su cui lavorare; non conoscendo il contesto e non avendo un esempio su cui lavorare, personalmente non so dirti di più.
    Prima di postare considera che tra i link utili puoi trovare il 75% delle risposte alle tue domande; il 20% tra i post del forum; il 15% sul web. Ti resta... humm spè
    Le cattive domande sono quelle che non meritano risposta, le buone domande sono quelle che non hanno risposta
    L'Itailano non e nu'opnioine. E' improntate uslaro correattemtne sul froum. Garize!

    "Mi son documentato"

  6. #6
    Quote Originariamente inviata da KillerWorm Visualizza il messaggio
    Certo ma penso proprio che il problema sia a monte, cioè l'oggetto table originario che viene ciclato (cioè l'istanza del datatable) non viene aggiornato nel momento in cui tu agisci sugli elementi cloni (cioè la rappresentazione a schermo). Anche se a schermo agisci sui checkbox, in realtà nell'oggetto table non succede proprio nulla.

    Non ne sono sicuro ma mi pare che funzioni più o meno in quel modo.

    Nell'evento change di #seleziona_tutto, puoi notare infatti che vengono ciclati i nodi dell'oggetto table e, trovati i relativi checkbox, ne viene aggiornato il valore.

    Nel submit vengono quindi ciclati i checkbox che stanno dentro table, non quelli che stanno a video, per cui viene creata una copia momentanea dentro il form, in modo che tali dati siano trasmessi al server.

    Nel tuo caso quindi è necessario aggiornare singolarmente il checkbox che sta dentro table, in base al suo clone a video che vai a manovrare. Se le API del plugin non permettono di "collegare" in modo semplice i controlli che sono dentro l'istanza datatable, con quelli rappresentati a video, allora dovrai farlo manualmente. Ti ho già indicato a grandi linee i passi su cui lavorare; non conoscendo il contesto e non avendo un esempio su cui lavorare, personalmente non so dirti di più.
    Ecco un jsfiddle : https://jsfiddle.net/pa6exwzk/3/

    NOn capisco però l'errore in console

  7. #7
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,283
    Ecco un jsfiddle
    Bene gli do uno sguardo.

    NOn capisco però l'errore in console
    Se intendi questo "$ is not defined" si tratta di jQuery che non è stato trovato.

    Tra le risorse, prima dell'inclusione di jquery.dataTables, devi includere la libreria jQuery
    Prima di postare considera che tra i link utili puoi trovare il 75% delle risposte alle tue domande; il 20% tra i post del forum; il 15% sul web. Ti resta... humm spè
    Le cattive domande sono quelle che non meritano risposta, le buone domande sono quelle che non hanno risposta
    L'Itailano non e nu'opnioine. E' improntate uslaro correattemtne sul froum. Garize!

    "Mi son documentato"

  8. #8
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,283
    Ho dato uno sguardo

    Prima cosa: non tenere conto di quanto ho indicato nei post precedenti. Non conoscendo il plugin ho scritto qualche castroneria facendo supposizioni errate

    In realtà la tabella viene aggiornata regolarmente quando manovri i checkbox. Gli elementi che sono mostrati a video sono esattamente parte di quelli che stanno dentro l'istanza dataTable.

    Il problema sta in quel ciclo del submit, come avevi immaginato tu.

    Analizzando meglio ciò che va a fare quello script, si può rilevare un problemi di logica.

    Traducendo lo script in umanese:

    - Ciclo tutti i checkbox
    - Considero solo quelli che NON sono già mostrati sulla pagina (dal momento che quelli visibili sulla pagina sono già considerati come dati da inviare col form)
    - Per ognuno di quelli non mostrati, verifico se è selezionato
    - Se lo è, allora creo una sua copia hidden nel form (così che sia considerato come dato del form)
    - Se non lo è, allora rimuovo dalla pagina TUTTI gli hidden

    Puoi capire quindi che quest'ultima azione, se l'ultimo box esaminato NON risulta selezionato, va a rimuovere comunque TUTTI gli hidden appena creati dal ciclo stesso.

    Ora, nel caso in cui si usa la funzione "seleziona tutto", l'ultimo checkbox nella tabella risulterà selezionato, e per tale motivo non avverrà quell'ultima azione.

    Invece, selezionando qualche checkbox in una singola pagina della tabella, questi saranno comunque considerati perché sono già presenti nel form; non le copie hidden che invece verrebbero erroneamente rimosse.

    Spero di aver chiarito la causa del problema, o quantomeno di non averti creato maggiore confusione

    Per risolvere, basterà spostare quell'azione prima che sia eseguito il ciclo; per cui, tutti gli hidden del form sono rimossi preventivamente, quindi sono ricreati, attraverso il ciclo, solo quelli relativi ai ceckbox selezionati e non presenti già nel DOM.

    Potrebbe essere una cosa del genere:
    codice:
    $('form').on('submit', function(e){
    
       var $form = $(this);
    
       // Rimuovo TUTTI gli input hidden del form
       $form.find("input[type='hidden']").remove();
    
       // Ciclo SOLO i checkbox selezionati della tabella
       table.$('input:checked').each(function(){
    
          // Se questo checkbox non è già nel DOM
          if (!$.contains(document, this)){
    
             // Creo la copia hidden
             $form.append(
                $('<input>')
                   .attr('type', 'hidden')
                   .attr('name', this.name)
                   .val(this.value)
             );
          }
       });
    });



    Ultima considerazione: dal momento che al submit vengono considerati i checkbox visibili sulla pagina (che siano checked oppure no), mentre gli hidden non posseggono la proprietà "checked", lato server dovrai fare attenzione a come valutare questi elementi; cioè dovrai prendere in considerazione tutti gli hidden come fossero dei checkbox checked, mentre i checkbox (che sono quelli restati visibili nella pagina) vanno verificati considerando solo i checked. Presumo tu abbia già considerato questo, in quanto valeva anche nel caso del "seleziona tutto".

    Fai sapere.
    Prima di postare considera che tra i link utili puoi trovare il 75% delle risposte alle tue domande; il 20% tra i post del forum; il 15% sul web. Ti resta... humm spè
    Le cattive domande sono quelle che non meritano risposta, le buone domande sono quelle che non hanno risposta
    L'Itailano non e nu'opnioine. E' improntate uslaro correattemtne sul froum. Garize!

    "Mi son documentato"

  9. #9
    Quote Originariamente inviata da KillerWorm Visualizza il messaggio
    Ho dato uno sguardo

    Prima cosa: non tenere conto di quanto ho indicato nei post precedenti. Non conoscendo il plugin ho scritto qualche castroneria facendo supposizioni errate

    In realtà la tabella viene aggiornata regolarmente quando manovri i checkbox. Gli elementi che sono mostrati a video sono esattamente parte di quelli che stanno dentro l'istanza dataTable.

    Il problema sta in quel ciclo del submit, come avevi immaginato tu.

    Analizzando meglio ciò che va a fare quello script, si può rilevare un problemi di logica.

    Traducendo lo script in umanese:

    - Ciclo tutti i checkbox
    - Considero solo quelli che NON sono già mostrati sulla pagina (dal momento che quelli visibili sulla pagina sono già considerati come dati da inviare col form)
    - Per ognuno di quelli non mostrati, verifico se è selezionato
    - Se lo è, allora creo una sua copia hidden nel form (così che sia considerato come dato del form)
    - Se non lo è, allora rimuovo dalla pagina TUTTI gli hidden

    Puoi capire quindi che quest'ultima azione, se l'ultimo box esaminato NON risulta selezionato, va a rimuovere comunque TUTTI gli hidden appena creati dal ciclo stesso.

    Ora, nel caso in cui si usa la funzione "seleziona tutto", l'ultimo checkbox nella tabella risulterà selezionato, e per tale motivo non avverrà quell'ultima azione.

    Invece, selezionando qualche checkbox in una singola pagina della tabella, questi saranno comunque considerati perché sono già presenti nel form; non le copie hidden che invece verrebbero erroneamente rimosse.

    Spero di aver chiarito la causa del problema, o quantomeno di non averti creato maggiore confusione

    Per risolvere, basterà spostare quell'azione prima che sia eseguito il ciclo; per cui, tutti gli hidden del form sono rimossi preventivamente, quindi sono ricreati, attraverso il ciclo, solo quelli relativi ai ceckbox selezionati e non presenti già nel DOM.

    Potrebbe essere una cosa del genere:
    codice:
    $('form').on('submit', function(e){
    
       var $form = $(this);
    
       // Rimuovo TUTTI gli input hidden del form
       $form.find("input[type='hidden']").remove();
    
       // Ciclo SOLO i checkbox selezionati della tabella
       table.$('input:checked').each(function(){
    
          // Se questo checkbox non è già nel DOM
          if (!$.contains(document, this)){
    
             // Creo la copia hidden
             $form.append(
                $('<input>')
                   .attr('type', 'hidden')
                   .attr('name', this.name)
                   .val(this.value)
             );
          }
       });
    });



    Ultima considerazione: dal momento che al submit vengono considerati i checkbox visibili sulla pagina (che siano checked oppure no), mentre gli hidden non posseggono la proprietà "checked", lato server dovrai fare attenzione a come valutare questi elementi; cioè dovrai prendere in considerazione tutti gli hidden come fossero dei checkbox checked, mentre i checkbox (che sono quelli restati visibili nella pagina) vanno verificati considerando solo i checked. Presumo tu abbia già considerato questo, in quanto valeva anche nel caso del "seleziona tutto".

    Fai sapere.

    Funziona tutto perfettamente , grazie mille

  10. #10
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,283
    Bene buon proseguimento
    Prima di postare considera che tra i link utili puoi trovare il 75% delle risposte alle tue domande; il 20% tra i post del forum; il 15% sul web. Ti resta... humm spè
    Le cattive domande sono quelle che non meritano risposta, le buone domande sono quelle che non hanno risposta
    L'Itailano non e nu'opnioine. E' improntate uslaro correattemtne sul froum. Garize!

    "Mi son documentato"

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2022 vBulletin Solutions, Inc. All rights reserved.