Jak programowo uruchomić kliknięcie przycisku przesyłania formularza obsługującego AJAX?

25

Próbuję programowo (za pomocą jQuery) wywołać kliknięcie przycisku z zachowaniem AJAX w formie Drupala, ale jak dotąd jQuery('#edit-submit').click()nic nie robi.

Prawdziwy myszy na który działa przycisk zgodnie z przeznaczeniem. Wszelkie pomysły, jak to zrobić?

7 ajax javascript Daniel
źródło
Jeśli jest to przycisk # edytuj-prześlij, czy nie możesz po prostu zrobić $ („formularz”). Submit ()?
cam8001,
to też nie działało dla mnie. Albo wysyła formularz w sposób inny niż AJAX, albo nic nie robi, zależy to od niektórych ustawień w kreatorze formularzy.
Daniel

Odpowiedzi:

40

jQuery('#edit-submit').mousedown() - najwyraźniej jest duża różnica.

Daniel
źródło
3
nie działa dla mnie
ram4nd
To rozwiązanie działało dla mnie. Kliknięcie przycisku wykonało wywołanie ajax, ale .click () lub odmiany nie działały jednak .mousedown () działa idealnie.
Eric Goodwin,
Unikałbym używania selektora ID w elementach formularza. Jeśli formularz zostanie odbudowany podczas wywołania zwrotnego AJAX, identyfikatory wszystkich elementów zmienią się, a selektor jQuery przestanie działać.
Yuriy Babenko
Dokładnie to, co powiedział Eric. Chciałbym wiedzieć, dlaczego istnieje różnica ... poważnie, to wydaje się nie mieć sensu.
Johnathan Elmore,
@JohnathanElmore mousedown()to tylko „pierwsza część” click()wydarzenia, które jest kompletne, gdy mouseup()nastąpi. Kliknięcie łącza, a następnie zwolnienie myszy poza obszarem łącza, click()zwykle nie powoduje zwolnienia, a łącze nie jest śledzone. Prawdopodobnie wywołanie ajax zapobiega mouseup()zostać zwolniony, ale to tylko przypuszczenie ...
pamatt
7

Właściwie nie trzeba zgadywać.

Powinieneś używać zachowań Drupala

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

       // Your code goes here....

    }
}

To da ci dostęp do właściwości ajax ustawień, 

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

       console.log(settings.ajax);

    }
}

W zależności od konfiguracji powinna zostać wyświetlona lista elementów wyzwalających z różnymi właściwościami, takimi jak nazwa funkcji zwrotnej, identyfikator selektora, a także nazwa zdarzenia wyzwalającego.

Następnie możesz użyć odpowiednich informacji, aby uruchomić wydarzenie.

// $(selector).trigger(eventName);
// for example...
$('#edit-product-id-15', context ).trigger('change');
PatrickS
źródło
2
Podoba mi się ta odpowiedź, ponieważ oferuje ciekawą technikę odkrywania, jak łączyć się z generowanymi elementami dla programistów frontendów innych niż Drupal, którzy mogą pracować nad projektem Drupal. +1
Lester Peabody
6

Utwórz ajax zgłoś jak poniżej.

 $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.
}

Wtedy zdarzenie jquery .click () działałoby w formie drupal ajax.

Leopathu
źródło
czy możesz opublikować przykładową funkcję oddzwaniania, kiedy próbowałem, nie będzie to funkcja oddzwonienia
Crazyrubixfan
1
Dodano funkcję oddzwaniania :)
Leopathu,
3

Możesz także użyć .trigger()metody jQuery.$('#element').trigger('click');

Pszczół
źródło
3

W moim przypadku wyżej zalecane rozwiązania nie działały dla mnie, ale wzmianka o .mousedown () doprowadziła do następującego pomysłu, który zadziałał dla mnie (Drupal 7):

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

Istnieje kilka pomocnych informacji na temat „dlaczego”, tak jest w formularzu Dokumentacja interfejsu API pod #ajax_prevent

David Newkerk
źródło
Nie potrzebowałem opakowania click (), ale ten link do strony ajax zapobiegał KEY!
Ryan Hartman
2

Patrząc na moduł Better Exposed Filters, przesyłają formularz AJAX, znajdując $ (. Ctools-auto-upload-click ”) i uruchamiając kliknięcie.

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

// Click the auto submit button.
$(this).parents('form').find('.ctools-auto-submit-click').click();
?>
użytkownik27147
źródło
zdarzenie kliknięcia działało dla mnie, a zdarzenie mousedown nie.
aross
0

Musisz uruchomić submitzdarzenie w formularzu. Clicki mousedownzdarzenia na przyciskach nie działają.

Catalin Motatu
źródło
Właśnie tego próbowałem na początku i wydaje się, że nie działa poprawnie. Tak się tu dostałem.
aross