เปิด Thickbox ด้วย AJAX รางเนื้อหา


11

ฉันเพิ่มปุ่มที่กำหนดเองลงในตัวแก้ไข TinyMCE และฉันต้องการเปิด Thickbox ของ WP เมื่อฉันคลิกที่มัน

ฉันจะทำให้tb_show()ฟังก์ชั่นโหลดเนื้อหาที่ฉันต้องการด้วย ajax ได้อย่างไร

// the ajax
add_action('wp_ajax_getTheContent', 'getTheContent');
function getTheContent(){
  echo 'weqwtegeqgr'; // <- this should be displayed in the TB
  die();
}

นี่คือรหัสปลั๊กอินสำหรับแก้ไขที่ฉันใช้อยู่:

init : function(ed, url) {
  ed.addButton('do_stuff', {
    title : 'Do Stuff',
    image : url + '/icon.gif',
    onclick : function() {
        OpenMyThickbox('do_stuff');
    }
  });
...

ดังนั้นOpenMyThickboxฟังก์ชั่นจาวาสคริปต์ควรทำสิ่งที่ฉันต้องการ:

function OpenMyThickbox(tag){
  tb_show(tag, '...'); // <- how to load content trough ajax here ?
}

ใช้ admin_url ('admin-ajax.php'); สำหรับ url
Bainternet

ฉันได้รับหน้าว่าง แม้ว่าฉันจะป้อน google.com
onetrickpony

คำตอบ:


6

พารามิเตอร์ที่สองสำหรับ tb_showคือ URL ดังนั้นคุณจะต้องใช้สิ่งที่ชอบ ..

<?php 
$ajax_url = add_query_arg( 
    array( 
        'action' => 'getTheContent', 
        'query_var1' => 'value1', 
        'query_var2' => 'value2' 
    ), 
    admin_url( 'admin-ajax.php' ) 
); 
?>
tb_show(tag, '<?php echo $ajax_url; ?>' );

ฉันเดาว่าคุณต้องผ่านการดำเนินการและ vars แบบสอบถามเพิ่มเติมใด ๆ ด้วยตนเอง (ตามข้างบน) มิฉะนั้นคำขอของคุณเป็นเพียงสำหรับ admin-ajax.phpเมื่อสิ่งที่คุณกำลังมองหาเป็นสิ่งที่ตามสายของ ... admin-ajax.php?action=getTheContent&someothervar=someothervalueดังนั้นการadd_query_argใช้งานข้างต้น .

สำหรับการชี้แจง:

สายต่อไปนี้เพื่อadd_query_arg...

add_query_arg( 
    array( 
        'action' => 'getTheContent', 
        'query_var1' => 'value1', 
        'query_var2' => 'value2' 
    ), 
    admin_url( 'admin-ajax.php' ) 
);

เทียบเท่าและจะผลิต ...

http://example.com/wp-admin/admin-ajax.php?action=getTheContent&query_var1=value1&query_var2=value2

แต่!

ตอนนี้มีการอธิบายตัวเองฉันได้ตระหนักว่าเราไม่ต้องการ URL ที่สมบูรณ์และดังนั้นจึงไม่จำเป็นต้องโทรไปที่admin_urlนั่น รหัสควรเป็น

<?php 
$ajax_url = add_query_arg( 
    array( 
        'action' => 'getTheContent', 
        'query_var1' => 'value1', 
        'query_var2' => 'value2' 
    ), 
    'admin-ajax.php'
); 
?>
tb_show(tag, '<?php echo $ajax_url; ?>'); 

ดังนั้น URL ที่ได้จะเป็นแบบนี้ ..

admin-ajax.php?action=getTheContent&query_var1=valu1&query_var2=value2

ฟังก์ชั่นอ้างอิงในตัวอย่างรหัสข้างต้น:


จะไม่เป็น$_get['action']เพราะการโทร WordPress ajax มองหา$_post['action']? หรือฉันผิด
Bainternet

โดยปกติจะเป็น$_POSTหรือ$_REQUESTอยู่ภายในการติดต่อกลับ ajax เว้นแต่คุณจะตั้งค่าฟังก์ชันการร้องขอ ajax ของคุณให้ใช้getแทนในบริบทของการโทร thickbox เราจะใช้สตริงการสืบค้นซึ่งควรจะปรากฏใน$_REQUEST(เพราะมักจะเก็บทั้งสอง$_GETและ$_POST) ..
t31os

ไม่สิ่งที่ฉันถามคือถ้าฉันใช้add_query_argจะเพิ่ม args ถูกส่งเป็นโพสต์หรือรับ?
Bainternet

ไม่ต้องต่อadd_query_argท้ายสตริง (ของ url) ด้วยพารามิเตอร์การสืบค้น แต่จะไม่ทำการส่งใด ๆ ดังนั้นฉันไม่แน่ใจว่าฉันเข้าใจคำถามของคุณหรือไม่
t31os

อัปเดตคำตอบของฉัน ..
t31os

3

ล้อเล่น javascript และ PHP นั้นไม่ค่อยฉลาดเท่าไหร่ คำตอบนี้สับสนเท่านั้น

tb_show คือ javascript add_query_arg คือ PHP

ดังนั้นวิธีนี้จะใช้ได้เฉพาะใน PHP และรหัสที่เหมาะสมคือ

...
?>
tb_show(
  'whatever',
  <?php echo add_query_arg( array(
    'action' => 'getTheContent',
    'query_var1' => 'value1',
    'query_var2' => 'value2',
  ), 'admin-ajax.php'); ?>
);
<?php
...

และในจาวาสคริปต์นั้นใช้ไม่ได้เลยเพราะเราไม่สามารถใช้ add_query_arg


แตกต่างจากโซลูชันนอกเหนือจากที่มี<?php ?>แท็กอยู่หรือไม่ หากนั่นคือทั้งหมดที่คุณต้องการชี้ให้เห็นโปรดแก้ไขเพื่อแก้ไขปัญหา ไม่จำเป็นต้องเพิ่มคำตอบแยกต่างหากเพื่ออธิบายสิ่งที่ผิดกับคำตอบอื่น นั่นเป็นเหตุผลว่าทำไมการแก้ไขโดยชุมชนจึงได้รับการชื่นชม
ไกเซอร์

@kaiser การแก้ไขการเปลี่ยนความหมายของโพสต์นั้นไม่สามารถทำได้ ในฐานะที่เป็นคำตอบที่แยกต่างหากนี้ก็โอเค
fuxia

@toscho และสิ่งนี้เปลี่ยนความหมายได้อย่างไร? Imo ก็แก้ไขหรือเพิ่มบิตที่ขาดหายไป
ไกเซอร์

Bayen ถูกต้องเพื่อชี้ให้เห็นข้อผิดพลาดที่นี่ฉันกำลังผสม PHP และ Javascript ฉันควรจะเห็นว่าไม่ช้าก็เร็ว ฉันได้ทำการเปลี่ยนแปลงที่จำเป็นสำหรับคำตอบของฉันและขอบคุณสำหรับคำติชม bayen (ฉันชอบที่จะรู้ว่าเมื่อฉันทำผิดพลาด)
t31os
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.