Visualizzazione dei risultati da 1 a 6 su 6
  1. #1
    Utente di HTML.it
    Registrato dal
    Nov 2010
    Messaggi
    340

    un modal statico per ricerca alfabetica

    Salve Ragazzi,
    ho nuovamente bisogno di sentire un vs. parere su un problema che mi assilla.
    Devo poter aprire un modal che non si chiude se non da pulsante "chiudi".
    Apro un elenco in ordine alfabetico che ha un checkbox per selezionare gli id degli utenti elencati, purtroppo nasce l'esigenza di una ricerca degli allievi, sono presenti 300 iscritti e scorrere in una lista cosi lunga è macchinoso. Il modal e la ricerca funzionano, ho messo un form al suo interno per inviare i dati POST ma anche se mi risponde correttamente il Modal si chiude comunque e rende tutto vano.
    Vi posto il codice, spero possiate aiutarmi.

    Grazie in anticipo.

    Codice PHP:

    <div class="modal fade" id="flipFlop" role="dialog" data-backdrop="static">
         
    <div class="modal-dialog modal-lg">
          <div class="modal-content">
               <div class="modal-header">
                        <h4 class="modal-title col-sm-10" id="modalLabel"> Scegli gli iscritti regolari da aggiungere.</h4>
               </div>
        
      <div class="modal-body">
          
          <?php 
                
    if(!isset($_POST['submit']))     
            {
         
    ?>
            <form action='<?php echo $_SERVER['PHP_SELF']; ?>' class="form-inline mt-6 mt-md-6" method="POST"  id="searchForm">

                <?php
                    
    if(isset( $_POST['search'])) {
                          
    $search $_POST['search']; 
                    }else{
                            
    $search='';
                    }
                   
                    
    $users $this->model->ra_users_name($search);
                   
                
    ?>
                   
                
                  <h4 class="modal-title col-sm-10" id="modalLabel"> 
                           <input class="form-control col-sm-4" type="text"  name="search" id="search" value="<?=$search?>" placeholder="Digita">
                           <button type="button" class="btn btn-warning col-sm-2" id="cerca"><i class="fa fa-search"></i></button>
                        </h4>
                
                     <input type="hidden" name="idUser" id="idUser"  value="" />
                            <table class="table table-striped" id="table-users">
                                       <thead>
                                                   <tr>
                                                            <th>ID</th>
                                                            <th>Nome</th>
                                                            <th>Cognome</th>
                                                            <th>Abbonamento</th>
                                                            <th>Località</th>
                                                            <th>Cap Prov</th>
                                                            <th>Telf.</th>
                                                  </tr>
                                           </thead>  
                          <tbody>
    <?php
                
             $pass
    =0;            // uso il pass, se i controlli sono OK pass=1 
             
         
      // $users , metto in array i nominativi trovati e quindi li rileggo 

                 
    foreach ($users as $abbonati) {
                            if (
    $abbonati->id >) {  
                                      
    $pass =0;
                                      
    $pass $this->model->ancora_abbonato($abbonati->id$id_sala);
                                                
                               if (
    $pass===1){
                                 
    $valido' Valido ';
                                      
    ?>
                                   <tr>
                                    <td class="text-left"><input type="checkbox" value="<?=$abbonati->id?>"  name="check"  /></td>
                                                                   
                                    <td class="text-left"><input type="checkbox" value="<?=$abbonati->id?>"  name="check" disabled /></td>
                              
                                    <td class="text-left"><?=$abbonati->cognome?></td>
                                    <td class="text-left"><?=$abbonati->nome?></td>
                                    <td class="text-left"><?=$valido?></td>                                 
                                    <td class="text-left"><?=$abbonati->localita?></td>
                                   <td class="text-left"><?=$abbonati->cap.'/'.$abbonati->prov?></td>
                                   <td class="text-left"><?=$abbonati->cell?></td>                                
                                   <td><?=$abbonati->id?></td>
                                 </tr>    
                                       
                               <?php }
                              
     
                              }   
    // if Abbonati->id >0
                     
    }
                     
    ?>

                         </tbody>
                     </table>
                     
            </form> 
         
           <?php
            
    }
        
    ?>

        </div>  <!-- div class="modal-body" -->
              
              <div id="selez">
                  <input type="text" id="textbox1"/>
              </div>
              
            <div class="col-md-6 text-center"><button  type="button" id="btn_1" class="btn btn-warnig" data-dismiss="modal"> Chiudi </button></div>
            <div class="col-md-6 text-center"><button  type="button" id="btn_2" class="btn btn-primary" data-dismiss="modal">  Invia  </button></div>
        
    </div>
     
        
    </div>
    </div>

  2. #2
    Utente di HTML.it
    Registrato dal
    Nov 2010
    Messaggi
    340
    Ho provato ad usare la classe "modal show" di Bootstrap, questo ti permette di avere un modal sempre in primo piano, il problema e' che lo apre appena viene caricata la pagina, senza chiamata, e poi non si chiude nemmeno con il modal Hide, se lo vuoi chiudere devi cambiare il nome della classe e riesci a chiuderlo ma poi non lo riapri se non ricaricando la pagina......

  3. #3
    Utente di HTML.it
    Registrato dal
    Nov 2010
    Messaggi
    340
    Ok risolto, se puo' servire a qualcuno :
    Il modal inizialmente ha classe modal di base, quando clicchi per aprirlo, cambi la classe in modal show ed esegui modal(show) per aprirlo.
    Lavori su un form che risponde e rimane la finestra modal statica, quando clicchi su chiudi, cambi la class togliendo show dal nome ed esegui
    modal(hide).

  4. #4
    Concettualmente puoi risolvere in altro modo, più "elegante"....
    Usi ajax per fare la richiesta di aggiornamento dei dati a seguito di ricerca e ricarichi la tabella coi nuovi dati.
    La tabella la costruisci usando la jquery.datatable (una classe che trovi facilmente con Google. Lavora in javascript ma è molto potente e customizzabile).Ti crei uno scrippettino per rendere DataTable la tabella, l'importante è che ci sia qualcosa di questo genere
    codice:
    function do_data_table(id_tabella, sorting, section, data_type, filter, total) {
        if (sorting == undefined) {
            sort_order = [ [ 1, "desc" ] ];
        } else {
            sort_order = sorting;
        }
        if (data_type == undefined) {
            dataTypes = [];
        } else {
            dataTypes = data_type;
        }
        if (total == undefined) {
            total = 10;
        }
        data_table_rendered = $("#" + id_tabella).DataTable(
                {
                    bJQueryUI : false,
                    sPaginationType : "full_numbers",
                    aoColumnDefs : dataTypes,
                    iTotalRecords : total,
                    iTotalDisplayRecords : total,
                    scrollX : true,
                    bPaginate : true,
                    bProcessing : true,
                    bDeferRender : true,
                    aaSorting : sort_order,
                    bServerSide : true,
                    sServerMethod : "POST",
                    ajax : {
                        url : "/ajax_requests/ajax_" + section + "/get_" + section
                                + "_tabella" + "/" + filter,
                        dataType : 'json',
                        type : "POST",
                        data : function(d) {
                            d.filtro_utente = $('#filtro_utente').val();
                        }
                    },
                    oLanguage : {
                        sUrl : "/assets/js/dataTable/translate/italian.txt"
                    }
                });
    }
    Lato php/html (dipende se usi dei templates php o direttamente codice html) avrai quindi qualcosa del genere
    codice:
    do_data_table('tabella_utenti', [[ 1, 'desc' ]], 'utenti', [ { 'sType': 'date', 'aTargets': [ 6, 7, 8 ] }, { 'sType': 'numeric', aTargets: [ 1, 4 ] }, { 'sClass': 'dt-body-right', 'aTargets': [ 4 ] }, { 'aTargets': [ 0, 5, 9 ], 'bSortable': false, 'bSearchable': false  }, { 'visible': false, 'targets': 10 } ], null, 1 );
    Nella documentazione di DataTable trovi tutte le indicazioni per i parametri sType, aTargets ecc.
    Quando il form viene inviato (in realtà non è un form, sarà la DataTable a fare il trigger), chiamerà la pagina

    /ajax_requests/ajax_" + section + "/get_" + section + "_tabella" + "/" + filter

    ovvero

    /ajax_requests/ajax_utenti/get_utenti_tabella

    e in post avrai il valore del campo con ID filtro_utente.

    La paginetta ajax_utenti sarà qualcosa del tipo
    codice:
    public function __construct( ) {        
    parent::__construct();        
    // Carico il model        
    $this->load->model( "utenti/utenti_model" );        
    $this->corrispondenza_nomi_colonne = array (               
    0 => "ID",                
    1 => "Nome",                
    2 => "Cognome",                
    3 => "Abbonamento",
            );    
    }
    
    public function get_utenti_tabella( ) {        
    $filtro = array ();        
    $post_dati = $_POST;        
    $sorting = $this->corrispondenza_nomi_colonne [$post_dati ["order"] [0] ["column"]];        
    $sorting_dir = $post_dati ["order"] [0] ["dir"];        
    $search = $post_dati ["search"] ["value"];        i
    f (trim( $sorting ) != "") {            
    $this->model->set_order_by( "`{$sorting}` {$sorting_dir}" );        
    }        
    // Qui faccio eventuale filtro di ricerca, così mi torna bello        
    if (trim( $search ) != "" and strlen( trim( $search ) ) > 3) {            
    $filtro ["ricerca"] = trim( $search );        
    };
    $records = $this->model->get_record( $filtro, "utenti", $post_dati ["start"], $post_dati ["length"] );        
    $total_records = $this->model->get_record( $filtro, "utenti", 0, 999999, true ) [0]->totale;
            // Elaboro il risultato per costruire la risposta alla data table        
    $result = new stdClass();        
    $result->sEcho = $post_dati ["draw"];        
    $result->iTotalRecords = $total_records;        
    if (isset( $filtro ["ricerca"] )) {            
    $result->iTotalDisplayRecords = sizeof( $records );        
    } else {            
    $result->iTotalDisplayRecords = $total_records;        
    };        
    $result->aaData = array ();            
    $progressivo = 0;        
    foreach ( $records as $riga ) {
    $result->aaData [] = array (                                        
    0 => "<div title=\"Seleziona\" alt=\"Seleziona\"><input name=\"check_gruppo\" id=\"check_utente\" value=\"{$riga->ID}\" type=\"checkbox\" rel=\"id_utente_{$riga-ID}\"></div>",                    
    1 => "<div title=\"Nome\" alt=\"Nome\">{$riga->Nome}</div>",
    ......
        );        
    }        
    $coded = json_encode( $result );
    print $coded;    
    }
    Studiati un attimo il codice e la documentazione di DataTable, vedrai che è molto interessante come soluzione

    (perdona la formattazione del codice php ma l'editor non me la mantiene....)

  5. #5
    Utente di HTML.it
    Registrato dal
    Nov 2010
    Messaggi
    340
    Grazie Dascos, mai usato prima, provo a studiare un pò il codice, mi hai incuriosito,
    Poi ti diro', Grazie.

  6. #6
    Utente di HTML.it
    Registrato dal
    Nov 2010
    Messaggi
    340
    Ho conosciuto la DataTale di bootstrap , per fare la stessa cosa in un'altro script avevo speso circa una settimana di lavoro, per questo in 10 minuti ho fatto la stessa cosa, potentissima!!
    Grazie Dascos della segnalazione.

  7. #7
    Quote Originariamente inviata da marcopa Visualizza il messaggio
    Ho conosciuto la DataTale di bootstrap , per fare la stessa cosa in un'altro script avevo speso circa una settimana di lavoro, per questo in 10 minuti ho fatto la stessa cosa, potentissima!!
    Grazie Dascos della segnalazione.
    Prego :-D

    Vedo che usi codeigniter (o almeno mi sembra, vedendo il codice che hai postato). Se posso permettermi, non mescolare database, logica e grafica...
    Usa i controllers per la logica, i models per le query e le views per la grafica; ti risulterà molto più semplice mettere mano al codice tra qualche mese....

    Controller:
    codice:
    ....
    // Carico il modello
    $modello = $this->load->model("cliente);
    // Carico la struttura principale html
    $vista = $this->load->view("Clienti_struttura", null, true);
    // Recupero i record
    $record = $modello->get_record("tipi_cliente", 43);
    // Elaboro i record
    foreach ($record as $id => $riga){
        $righe_html .= $this->load->view("Clienti_riga", $riga, true);
    }
    // Mostro la struttura compilata correttamente
    $html = str_replace("#righe_clienti#", $righe_html, $vista );
    print $html;
    Model
    codice:
    public function get_record_tipi_cliente( $id_tipo = 0){
    $sql = "
            SELECT
                *
            FROM
                `{$this->table}` 
            WHERE
                `ID_Tipo` = {$id_tipo}
            ORDER BY
                {$this->default_order_by}
            ";
    $query_resource = $this->db->query( $sql );
    return $query_resource->result( "object" );
    }
    View Clienti_struttura
    codice:
    if ( ! defined('BASEPATH')) exit('No direct script access allowed');
    $output = <<<EOF
    
    
                   <table id="tabella_clienti" class="col w-100">
                <!-- START Intestazione Tabella -->
                <thead id="thead_tabella_clienti">
                    <tr>
                        <th></th>
                        <th>id</th>
                        <th>nome</th>
                        <th>cognome</th>
                    </tr>
                </thead>
                <!-- END Intestazione Tabella -->
                <!-- START Corpo Tabella -->
                <tbody id="tbody_tabella_clienti">
    #righe_clienti#
                </tbody>
                <!-- END Corpo Tabella -->
                <!-- START Footer Tabella -->
                <tfoot id="tfoot_tabella_clienti">
                    <tr>
                        <td colspan="4" id="footer_righe_clienti" style="display: none"></td>
                    </tr>
                </tfoot>
                <!-- End Footer Tabella -->
            </table>
    EOF
    
    
    ;
    print $output;
    E poi la view Clienti_riga sarà come quella della struttura ma ovviamente conterrà qualcosa del tipo
    codice:
    .....
    <tr>
        <td>{$riga->id}</td>
        <td>{$riga->nome}</td>
        <td>{$riga->cognome}</td>
    </tr>
    ...
    In questo modo sarà molto facile correggere la query (sai esattamente dov'è e usi solo logica Db) o la vista (è SOLO html più qualche sostituzione di variabile, niente logica complicata) ecc ecc

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 © 2024 vBulletin Solutions, Inc. All rights reserved.