2017-09-15 9 views
5

मैं इस पल में सेट अप किया है:Wordpress + अजाक्स पेज लोड हो रहा है + गुरुत्वाकर्षण रूपों + गुरुत्वाकर्षण रूपों पृष्ठ विराम

एक WordPress साइट, मैं http://barbajs.org/ को कुछ इसी तरह का उपयोग कर रहा हर पेज की सामग्री ajax के माध्यम से भरी हुई है तो <main></main> टैग पर।

पृष्ठों में से एक (संपर्क पृष्ठ) में, मेरे पास गुरुत्वाकर्षण रूप है और पेज ब्रेक का उपयोग कर रहा है। फॉर्म चरणों में बनाया गया है और पृष्ठ के अंदर प्रत्येक चरण लोड किया गया है। सब कुछ काम कर रहा है यदि मैं जो पेज लोड करता हूं वह पृष्ठ (संपर्क पृष्ठ) है, लेकिन जैसे ही मैं एक अलग पृष्ठ पर जाता हूं और वापस आ जाता हूं, या यदि मैं पिछले पृष्ठ से संपर्क पृष्ठ पर जाता हूं तो फॉर्म अब और काम नहीं करता है ।

इसे ठीक करने के तरीके पर कोई भी विचार।

Wordpress: इस कोड हिस्सा है शोर्ट साथ WYSIWYG

[gravityform id="2" title="false" description="false" ajax="true"] 

प्रस्तुत होने पर, मैं इस है: jQuery('#gform_wrapper_2').show() (यह केवल बात यह है कि काम करता है), तो मैं एक काले रंग की नहीं मिलता है पृष्ठ।

अगर मैं अगले कदम पर क्लिक करें (यह अगले कदम लोड नहीं करता है) और मैं इस की कोशिश की है: यह मैं onclick = "..."

jQuery(document).trigger('gform_post_conditional_logic', [2, null, true]) 
jQuery(document).bind('gform_post_conditional_logic', function(event, formId, fields, isInit){}) 
jQuery(document).trigger('gform_post_render', [2, 1]) 
jQuery("#gform_target_page_number_2").val("2"); 
jQuery("#gform_2").trigger("submit",[true]); 
तहत प्रलेखन पर या अगला बटन में पाया

मैं की आवश्यकता होगी कुछ gform.init() आदर्श रूप से: डी या ऐसा कुछ जो मुझे फ़ॉर्म को दोबारा बांधने देता है।

बहुत बहुत धन्यवाद!

+1

क्या यह कहीं रहता है? – shramee

+0

आपका विवरण पर्याप्त सभ्य है लेकिन मुझे यह लाइव देखने की ज़रूरत है ताकि मैं कोड डीबग कर सकूं और देख सकूं कि क्या गलत हो रहा है। या, कम से कम, क्या आप जावास्क्रिप्ट लोडिंग कोड स्निपेट पोस्ट कर सकते हैं और यह कैसे ट्रिगर किया जाता है? –

+0

आप अपने गुरुत्वाकर्षण रूपों दस्तावेज़ों में वर्णित विषय/प्लगइन विवादों की जांच करने पर भी विचार कर सकते हैं https://docs.gravityforms.com/testing-for-a-themeplugin-conflict –

उत्तर

0

गुरुत्वाकर्षण फॉर्म प्लगइन में थोड़ा सा खोदने के बाद मैं इसे ठीक करने में सक्षम था।

तो "मुख्य" विचार यह है कि बार्बा या जो भी आप उपयोग कर रहे हैं (यह है:

तो यहाँ मैं क्या किया .. आशा है कि यह भविष्य में किसी को मदद करता है (यकीन नहीं करता है, तो सबसे अच्छा समाधान है, लेकिन यह काम करता है) है मेरे मामले में biggie) एक नए पेज के लिए AJAX कॉल कर रहा है और आपके पास एक तैयार/नया पेज रीडी फ़ंक्शन जैसा कुछ होगा, यहां आप अपना फॉर्म प्राप्त करने के लिए एक नया AJAX कॉल करें।

जे एस: (कि gform को देखते हुए jQuery का उपयोग करता है आप इसका इस्तेमाल कर सकते हैं)

ready(done) { 

    ajax.get(APP.AJAX_URL + '?action=get_form', { 

     success: (object) => { 

     //console.log(object.data) 

     jQuery('.main-content-wrapper').append(object.data) 
     jQuery('body #gform_wrapper_2').show() 

    } 
    }) 
} 


addEvents() { 

    // this will check everytime a form is loaded 

    jQuery(document).bind('gform_page_loaded', this.gform) 

} 


gform(event, form_id, current_page) { 

    //Here the form is loaded but not showed.. you can do something like this 

    TweenMax.fromTo('.gform_wrapper', 1.2, {autoAlpha: 0}, {autoAlpha:1}) 
} 

functions.php

add_action('wp_ajax_nopriv_get_form', 'get_form'); 
add_action('wp_ajax_get_form', 'get_form'); 

function get_form() { 

    gravity_form(id_of_your_form,false, false, false, false, true); 

    die(); 
} 
0

सुनिश्चित नहीं हैं कि अगर यह सही समाधान है, लेकिन मैं द्वारा gform.init() की तरह कुछ करने के लिए प्रबंधित eval() के साथ फॉर्म के तहत स्क्रिप्ट टैग को कॉल करना। प्लगइन द्वारा प्रत्येक फॉर्म के बाद थीस स्क्रिप्ट डाली जाती है।

उदाहरण के लिए, के बाद आप ajax के साथ अपने पृष्ठ बदलने के लिए, कुछ इस तरह करते हैं:

// After changing page with ajax : 

var scripts = myNewForm.querySelectorAll('script'); // where "myNewForm" is the container including the new form added after an ajax call 

for (var i = 0; i < scripts.length; i++) { // "For" loop in case there is more than one script added by the plugin 

    eval(scripts[i].innerHTML); // --> this will init the new form 
} 

केवल एक ajax कॉल के बाद इस फोन करने के लिए सुनिश्चित करें।

संबंधित मुद्दे