Come attivare a livello di programmazione un clic su un pulsante di invio modulo abilitato AJAX?


25

Sto cercando di attivare a livello di codice (con jQuery) un clic sul pulsante con comportamento AJAX in una forma Drupal, ma finora jQuery('#edit-submit').click()non fa nulla.

Un vero clic del mouse su quel pulsante funziona come previsto. Qualche idea su come farlo funzionare?


Se si tratta di un pulsante # modifica-submit, non puoi semplicemente fare $ ('form'). Submit ()?
— cam8001,

non ha funzionato neanche per me. Pubblica il modulo in modo non AJAX o non fa nulla, dipende da alcune impostazioni nel generatore di moduli.
— Daniel,

Risposte:


40

jQuery('#edit-submit').mousedown() - apparentemente c'è una grande differenza.


3
non funziona per me
— ram4nd

Questa soluzione ha funzionato per me. Facendo clic sul pulsante è stata eseguita la chiamata ajax ma .click () o le varianti non hanno funzionato perfettamente .mousedown ().
— Eric Goodwin,

Eviterei di utilizzare il selettore ID sugli elementi del modulo. Se il modulo viene ricostruito durante il callback AJAX, gli ID di tutti gli elementi cambieranno e il selettore jQuery non funzionerà più.
— Yuriy Babenko,

Esattamente quello che ha detto Eric. Vorrei sapere perché c'è differenza ... sul serio, questo sembra non avere senso.
— Johnathan Elmore,

@JohnathanElmore mousedown()è solo "la prima parte" di un click()evento, che è completo quando si mouseup()verifica. Quando si fa clic su un collegamento e quindi si rilascia il mouse al di fuori dell'area del collegamento, di click()solito non viene attivato e il collegamento non viene seguito. Probabilmente una chiamata Ajax impedisce il mouseup()licenziamento, ma questa è solo una supposizione ...
— pamatt

7

In realtà, non è necessario indovinare.

Dovresti usare comportamenti Drupal

Drupal.behaviors.yourFunctionName = {
    attach:function (context, settings) {

       // Your code goes here....

    }
}

Questo ti darà accesso alla proprietà ajax delle impostazioni,

Drupal.behaviors.yourFunctionName = {
    attach:function (context, settings) {

       console.log(settings.ajax);

    }
}

A seconda della configurazione, dovresti visualizzare un elenco di elementi di attivazione, con varie proprietà come il nome della funzione di richiamata, l'ID del selettore e il nome dell'evento di attivazione.

È quindi possibile utilizzare le informazioni pertinenti per attivare il tuo evento.

// $(selector).trigger(eventName);
// for example...
$('#edit-product-id-15', context ).trigger('change');

2
Mi piace questa risposta perché offre una tecnica interessante per scoprire come interfacciarsi con elementi generati per sviluppatori frontend non Drupal che potrebbero lavorare su un progetto Drupal. +1
— Lester Peabody,

6

Crea ajax submit come il seguente.

 $form['button'] = array(
    '#type' => 'button',
    '#value' => 'Click',
    '#ajax' => array(
      'callback' => '_kf_reading_user_points',
      'wrapper' => 'reading-user-points',
      'method' => 'replace',
      'event' => 'click',
    ),
  );

function _kf_reading_user_points(&$form, &$form_state) {
  // Something within the callback function.
}

Quindi l'evento jquery .click () sarebbe funzionante nella forma ajax drupal.


puoi pubblicare anche la funzione di callback di esempio, quando ho provato, non sta andando alla funzione di callback
— Crazyrubixfan

1
Aggiunta la funzione di richiamata :)
— Leopathu


3

Nel mio caso, le soluzioni sopra indicate non hanno funzionato per me, ma la menzione di .mousedown () ha portato alla seguente idea che ha funzionato per me (Drupal 7):

$('#custom-submit-button').click(function() {
  $('#ajax-submit-button').trigger('mousedown');
});

Ci sono alcune informazioni di base utili sul "perché" questo è il caso nel riferimento API del modulo in #ajax_prevent


Non avevo bisogno del wrapper click (), ma quel link per ajax prevent era il KEY!
— Ryan Hartman,

2

Guardando il modulo Filtri migliori esposti, inviano il modulo AJAX trovando $ (. Ctools-auto-submit-click ') e attivando un clic.

<?php
// ... near line 190 of better_exposed_filters.js

// Click the auto submit button.
$(this).parents('form').find('.ctools-auto-submit-click').click();
?>

l'evento click ha funzionato per me, mentre l'evento mousedown no.
— circa il

0

Devi attivare l' submitevento sul modulo. Clicke gli mousedowneventi sui pulsanti non funzionano.


Questo è quello che ho provato all'inizio, e non sembra funzionare correttamente. Ecco come sono arrivato qui.
— circa il
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.