प्रोग्राम को एक AJAX सक्षम फॉर्म सबमिट बटन पर एक क्लिक से कैसे ट्रिगर किया जाए?

25

मैं प्रोग्रामिक रूप से (jQuery के साथ) एक Drupal फॉर्म में AJAX व्यवहार के साथ बटन पर क्लिक करने की कोशिश कर रहा हूं, लेकिन अभी तक jQuery('#edit-submit').click()कुछ भी नहीं है।

उस बटन पर एक वास्तविक माउस क्लिक का काम करता है। किसी भी विचार यह कैसे काम करने के लिए?

7 ajax javascript

— डैनियल
स्रोत

यदि यह # संपादन-सबमिट बटन है, तो क्या आप केवल $ ('फ़ॉर्म') नहीं कर सकते हैं। सबमिट करें ()?

— कैम 20००१

यह मेरे लिए भी काम नहीं किया। यह या तो फॉर्म को गैर-AJAX तरीके से पोस्ट करता है या कुछ नहीं करता है, फॉर्म बिल्डर में कुछ सेटिंग्स पर निर्भर करता है।

— डैनियल

40

jQuery('#edit-submit').mousedown() - जाहिर है इसमें बड़ा अंतर है।

— डैनियल
स्रोत

3

मेरे लिए काम नहीं करता है

— ram4nd

इस समाधान ने मेरे लिए काम किया। बटन पर क्लिक करने से अजाक्स कॉल को निष्पादित किया जाता है लेकिन .click () या विविधताएं हालांकि .mousedown () पूरी तरह से काम नहीं करती हैं।

— एरिक गुडविन

मैं फार्म तत्वों पर आईडी चयनकर्ता का उपयोग करने से बचूंगा। यदि AJAX कॉलबैक के दौरान फ़ॉर्म का पुनर्निर्माण किया जाता है, तो सभी तत्वों की आईडी बदल जाएगी, और आपका jQuery चयनकर्ता अब काम नहीं करेगा।

— यूरी बबेंको

वास्तव में एरिक ने क्या कहा। मैं जानना चाहूंगा कि अंतर क्यों है ... गंभीरता से, यह समझ में नहीं आता है।

— जॉनथन एलमोर

@JohnathanElmore mousedown()एक click()घटना का सिर्फ "पहला भाग" है , जो तब mouseup()होता है जब पूरा होता है। जब आप एक लिंक पर क्लिक करते हैं और तब आप लिंक के क्षेत्र के बाहर माउस छोड़ते हैं, तो click()आमतौर पर निकाल नहीं दिया जाता है और लिंक का पालन नहीं किया जाता है। संभवत: अजाक्स कॉल से mouseup()आग

— लगने से बचती

7

वास्तव में, अनुमान लगाने की कोई आवश्यकता नहीं है।

आपको ड्रुपल व्यवहार का उपयोग करना चाहिए

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

       // Your code goes here....

    }
}

यह आपको सेटिंग्स की अजाक्स संपत्ति तक पहुंच देगा,

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

       console.log(settings.ajax);

    }
}

आपके कॉन्फ़िगरेशन के आधार पर, आपको ट्रिगर करने वाले तत्वों की एक सूची देखनी चाहिए, जैसे कि कॉलबैक फ़ंक्शन का नाम, चयनकर्ता की आईडी और ट्रिगरिंग इवेंट के नाम के साथ विभिन्न गुण।

फिर आप अपने ईवेंट को ट्रिगर करने के लिए प्रासंगिक जानकारी का उपयोग कर सकते हैं।

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

— Patricks
स्रोत

2

मुझे यह उत्तर पसंद है क्योंकि यह एक दिलचस्प तकनीक की खोज करता है कि गैर-ड्रुपल फ्रंटेंड डेवलपर्स के लिए उत्पन्न तत्वों के साथ कैसे इंटरफ़ेस किया जाए जो कि ड्रुपल प्रोजेक्ट पर काम कर रहे हों। +1

— लेस्टर पीबॉडी

6

निम्नलिखित की तरह अजाक्स सबमिट बनाएं।

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

फिर jquery .click () इवेंट ड्रुपल अजाक्स फॉर्म में काम करेगा।

— Leopathu
स्रोत

क्या आप नमूना कॉलबैक फ़ंक्शन भी पोस्ट कर सकते हैं, जब मैंने कोशिश की थी, तो कॉलबैक फ़ंक्शन पर नहीं जा रहा

— हूं

1

कॉलबैक फ़ंक्शन को जोड़ा गया :)

— Leopathu

3

आप .trigger()jQuery पद्धति का उपयोग भी कर सकते हैं ।$('#element').trigger('click');

— Beebee
स्रोत

3

मेरे मामले में, उपरोक्त अनुशंसित समाधान मेरे लिए काम नहीं करते थे, लेकिन .mousedown () के उल्लेख से मेरे लिए काम करने वाले निम्नलिखित विचार का जन्म हुआ (Drupal 7):

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

"क्यों" के बारे में कुछ उपयोगी पृष्ठभूमि जानकारी है, यह # API_prevent के तहत प्रपत्र API संदर्भ में मामला है

— डेविड न्यूकेर
स्रोत

मुझे क्लिक () आवरण की आवश्यकता नहीं थी, लेकिन अजाक्स को रोकने के लिए लिंक कुंजी थी!

— रयान हार्टमैन

2

बेहतर उजागर फ़िल्टर मॉड्यूल को देखते हुए, वे $ (, ctools-auto-submit-click ') और एक क्लिक ट्रिगर करके AJAX फ़ॉर्म जमा करते हैं।

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

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

— user27147
स्रोत

क्लिक इवेंट ने मेरे लिए काम किया, जबकि मूसडाउन इवेंट नहीं हुआ।

— aross

0

आपको submitफॉर्म पर ईवेंट को ट्रिगर करना होगा। Clickऔर mousedownबटन पर घटनाएँ काम नहीं कर रही हैं।

— कैटालिन मोटतु
स्रोत

यही मैंने पहले प्रयास किया था, और यह सही ढंग से काम नहीं करता है। जो मुझे यहां मिला है।

— aross