워드프레스 + Ajax 페이지 로딩 + Gravity 폼 + Gravity 폼 페이지 브레이크

워드프레스 + Ajax 페이지 로딩 + Gravity 폼 + Gravity 폼 페이지 브레이크

제가 지금 이 설정을 해두었습니다.

WordPress 사이트, 저는 http://barbajs.org/ 와 비슷한 것을 사용하고 있습니다. 그래서 모든 페이지 콘텐츠는 ajax를 통해 ajax로 로드됩니다.<main></main>꼬리표를 매다

페이지 중 하나(연락처 페이지)에 중력 양식이 있어서 페이지 브레이크를 사용하고 있습니다.양식은 단계로 만들어지며 각 단계는 페이지 내부에 로드됩니다.처음 로드하는 페이지가 해당 페이지(연락처 페이지)이면 모든 것이 작동하지만 다른 페이지로 이동한 후 다시 돌아오거나 이전 페이지에서 연락처 페이지로 이동하면 양식이 더 이상 작동하지 않습니다.

어떻게 고쳐야 할지에 대한 아이디어가 있습니까?코드 부분입니다.

워드프레스: 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()이상적으로 :D 또는 양식을 다시 바인딩할 수 있게 해주는 유사한 것.

정말 고마워.

중력 형태의 플러그인을 조금 파고든 후에 이것을 고칠 수 있었습니다.

제가 한 일은 이렇습니다.미래에 누군가에게 도움이 되기를 바랍니다(최선의 해결책은 확실하지 않지만 효과는 있습니다).

따라서 "주요" 아이디어는 바바나 사용 중인 다른 것(비기의 경우)이 새 페이지에 대한 아약스 호출을 수행하고, 여기서 양식을 얻기 위해 새로운 아약스 호출을 수행하는 것입니다.

JS: (그 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})
}

기능들.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();
}

이게 올바른 해결책인지는 모르겠지만 저는 어떻게든 다음과 같은 일을 해냈습니다.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
}

아약스 호출 후에만 호출하십시오.

언급URL : https://stackoverflow.com/questions/46237749/wordpress-ajax-page-loading-gravity-forms-gravity-forms-page-break