Visualizzazione dei risultati da 1 a 4 su 4
  1. #1
    Utente bannato
    Registrato dal
    Jul 2013
    Messaggi
    290

    Chiamare la stessa funzione da più bottoni

    Lavorando su un progettino ho trovato una situazione "strana", almeno per me.

    Su una finestra ci sono N bottoni diversi
    codice:
     <button value="Primo contatto" id="getselected" type="button" class="btn btn-primary">Primo contatto</button>
          <button value="Fatto sopralluogo"  type="button" class="btn btn-primary">Fatto sopralluogo</button>
    Dentro un componente di terzi c'è questo (praticamente nel file HTML principale - che contiene i bottoni - c'è un include a un file php il quale, a sua volta, aggiunge questo pezzo di codice ad un oggetto griglia)

    codice:
    jQuery("#getselected").click(function(){
        var selr = jQuery('#grid').jqGrid('getGridParam','selrow');
        if(selr) 
     {
     
       var valore = $(this).attr('value');
     alert(this.id+"  ciaaooo "+selr+"     "+valore);
     
     elenco="id="+selr+"&testo=ciao&note=pippo";
     
       $.ajax({
        url : 'dati2.php',
        data : elenco, 
     dataType : 'html',
        complete: function (data) {
     alert("successo");
             }
        
    });
    In sostanza il primo bottone, con id=getselected, funziona.
    Cliccandolo viene chiamata la funzione la quale mostra il valore (ho tagliato le parti non importanti)

    Gli altri bottoni, invece, non possono avere ovviamente il medesimo id, e quindi non chiamano la funzione.

    Come si può fare?

    Riassumendo: dati N bottoni uguali (si differenziano per delle proprietà "nascoste"), cliccandoli va richiamato lo stesso script php prendendo dinamicamente i valori.

  2. #2
    Moderatore di Annunci siti web, Offro lavoro/collaborazione, Cerco lavoro L'avatar di cavicchiandrea
    Registrato dal
    Aug 2001
    Messaggi
    26,133
    Rendi id dinamico aggiungendo un numero sequenziale getselected_1, getselected_2, etc... e ti riferisci alla classe btn-primary jQuery(".btn-primary").click....
    Cavicchi Andrea
    Problemi con javascript, jquery, ajax clicca qui

  3. #3
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,771
    Non capisco cosa trovi strano. Intuisco che ti mancano giusto delle nozioni fondamentali riguardo jQuery.

    Oltre a quanto ti ha indicato Andrea, partiamo dal fatto che un selettore jQuery, a grandi linee, funziona analogamente ad un selettore CSS.
    Questo significa che puoi selezionare degli elementi in svariati modi. Vedi la documentazione.

    Nel tuo script viene usato l'id in questo modo jQuery("#getselected"), il quale seleziona chiaramente solo l'elemento con tale id.

    Però, per ciò che ti serve potresti usare una classe (che dovrà essere specificata sui vari tag button che vuoi selezionare) e quindi il selettore diventerà, ad esempio, jQuery(".nomeClasse").
    Ora, nello scorcio di codice che hai postato, posso solo notare che gli elementi interessati (i due button) hanno entrambe due classi (btn e btn-primary), potresti quindi usare uno di questi nomi-classe per selezionare tali elementi, ad esempio, in questo modo: jQuery(".btn").
    Bisogna però verificare se in questo modo non si vada a selezionare altri elementi che utilizzano la stessa classe ma che non ti serve selezionare.
    Se puoi modificare il codice HTML, una soluzione potrebbe essere quella di inventarti tu una classe da applicare a quegli elementi e quindi selezionarli in questo modo.

    Puoi comunque selezionare specifici elementi del DOM (nel tuo caso i due button) specificandone un percorso (così come si fa per i CSS) che possa filtrare e restringere in qualche modo la selezione fino ad identificare solo gli elementi interessati.
    Se ad esempio i tuoi button stanno dentro un elemento con un id, allora puoi restringere la selezione con una stringa del genere: "#idElementoContenitore button" o, per filtrare maggiormente, "#idElementoContenitore button.btn"

    Chiaramente non c'è un unico modo per fare ciò che chiedi, ma devi valutare tu, in base a tutto il resto del contesto (che conosci tu), quale sia il migliore selettore per identificare solo gli elementi che ti serve selezionare.
    Installa Forum HTML.it Toolset per una fruizione ottimale del Forum

  4. #4
    Utente bannato
    Registrato dal
    Jul 2013
    Messaggi
    290
    Quote Originariamente inviata da KillerWorm Visualizza il messaggio
    Non capisco cosa trovi strano. Intuisco che ti mancano giusto delle nozioni fondamentali riguardo jQuery...
    Cerco di riformulare la domanda.
    Dati N bottoni bootstrap, ognuno di classe diversa (btn-primary, btn-danger e così via), qual è il modo più "furbo" per far trovare a jquery tutti quei bottoni, anziché ad esempio iterare con each su "tutto" (o quasi) il dom (cosa molto lenta e che vorrei evitare)?

    In sostanza posso mettere (come?) dei "tag" nei bottoni, e poi selezionare con jQuery solo quelli?
    La selezione delle classi, come accennato, non è che mi entusiasmi (nel mio caso)

    L'unica alternativa che mi è venuta in mente, per limitare la ricerca, è quella di "incapsulare" i bottoni "da qualche parte" (ad esempio una div class "pippo"), per poi prendere tutti i figli di "pippo", e le relative proprietà.

    Per capirci
    codice:
      $(".btn-primary").each(function (i,el) 
      {
       alert($(el).attr('value'));
      });
    non funziona, cioè non riesco a leggere l'attributo "value" che ho messo nel DOM.


    E sì, non sono certo un esperto di jquery.

    EDIT: ...e si vede... direi di aver (forse) risolto

    A futura memoria ho creato due funzioni:
    una che opera su .btn-primary, e che prende i valori da $(this).attr('value') per poi chiamare una pagina PHP.
    una seconda che opera specificamente su un id ben preciso, che chiama un'altra pagina PHP.

    Grazie per le dritte, mi son state utili!
    Ultima modifica di brancomat; 06-09-2015 a 12:32

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