AJAX 삽입 후 TinyMCE 편집기 / 비주얼 편집기 초기화


11

사용자 정의 옵션 페이지에 "반복자"스타일 필드 그룹이 있습니다. 숨겨진 상태의 활성 시각적 편집기가 있으며 사용자가 "새로 추가"를 클릭하면 전체 행이 복제됩니다. 그런 다음 복제 된 행에서 시각적 편집기를 초기화해야합니다. 내 코드 :

$('.repeater-add-new').click(function(event) {
    event.preventDefault();
    var target = $(this).data('repeater');
    $( '#' + target).find('.repeater-row:not(.clone) .repeater-content.in').collapse();
    var newRow = $( '#' + target + ' .repeater-row.clone' ).clone().appendTo( '#' + target + ' .repeater-row-wrapper' ).removeClass('clone');
    rebuildIndex(target);

    // Initialize editors if needed
    newRow.find('.wp-editor-wrap').each(function(index, el) {
        var ed_id = $(this).find('textarea').attr('id');

        tinymce.init(tinyMCEPreInit.mceInit[ed_id]);
        tinymce.execCommand('mceAddEditor', false, ed_id); 
        quicktags({id : ed_id});
    });
});

인터페이스 스크린 샷 :

스크린 샷

페이지가로드되면 콘솔 오류가 발생합니다.

잡히지 않은 TypeError : 정의되지 않은 'onpageload'속성을 읽을 수 없습니다

물론 편집기는 작동하지 않습니다. 페이지를 저장 한 후 물론 잘 작동하지만 행을 추가 할 때 작동해야합니다.


'onpageload'문제에 대한 해결책을 얻었습니까?
Kvvaradha

빠른 태그로 일부 항목을 등록해야 할 수도 있습니다. 로컬로 이것을 테스트 할 수 없기 때문에 100 % 확신 할 수는 없지만 stackoverflow.com/questions/21519322/… 로 시작하여 도움이되는지 확인할 수 있습니다.
phatskat

이봐, 다시 이리로 왔어. OP, 이러한 입력란 중 하나를 게시물 편집기에 추가하는 방법에 대한 스 니펫을 추가 할 수 있습니까? 나는 이것을 로컬로 시도하고 재현 할 수 있으며, 이것을 스스로 설 수있는 방법을 제공 할 수 있다면 파헤칠 수 있습니다.
phatskat

@phatskat 감사합니다. 실제로는 완전히 다른 방향으로 나아가게되었습니다. 고객은이 시스템을 상용 판매용으로 패키지하고 싶어서 ACF없이 사용자 정의 인터페이스를 사용하여 모든 것을 다시 작성했습니다. 도움을 주셔서 감사합니다!
Jack Arturo

답변:


1

자바 스크립트를 포함하지 않고 편집기를 작동 시켰습니까? 그렇다면 작동하는 tinymce 편집기가 포함 된 템플릿을 만든 다음 WithDataAndEventsjQuery clone()함수 의 인수 를 true로 설정 하여 해당 템플릿을 복사하도록 자바 스크립트를 다시 작성하십시오 .

예를 들면 다음과 같습니다.

$('.cloner').click(function(){
  $('.container').append($('.template').clone(true).removeClass('hidden'));
});
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.