Das Hochladen von Dateien in Ajax ist etwas schwierig, da es nicht möglich ist, Dateien mit dem XMLHttpRequest-Objekt des Browsers hochzuladen. Sie müssen daher eine Art Ajax-Upload-Plugin verwenden. Am einfachsten ist das JQuery Form Plugin, das die Dinge viel einfacher macht in WordPress enthalten. Um es zu verwenden, müssen Sie es in die Warteschlange stellen:
add_action('wp_print_scripts','include_jquery_form_plugin');
function include_jquery_form_plugin(){
if (is_page('12')){ // only add this on the page that allows the upload
wp_enqueue_script( 'jquery' );
wp_enqueue_script( 'jquery-form',array('jquery'),false,true );
}
}
Fügen Sie auf dieser Seite Ihr Upload-Formular und die JQuery hinzu, um beispielsweise das JQuery Form-Plugin aufzurufen:
<form id="thumbnail_upload" method="post" action="#" enctype="multipart/form-data" >
<input type="file" name="thumbnail" id="thumbnail">
<input type='hidden' value='<?php wp_create_nonce( 'upload_thumb' ); ?>' name='_nonce' />
<input type="hidden" name="post_id" id="post_id" value="POSTID">
<input type="hidden" name="action" id="action" value="my_upload_action">
<input id="submit-ajax" name="submit-ajax" type="submit" value="upload">
<form>
<div id="output1"></div>
<script>
$(document).ready(function() {
var options = {
target: '#output1', // target element(s) to be updated with server response
beforeSubmit: showRequest, // pre-submit callback
success: showResponse, // post-submit callback
url: ajaxurl // since 2.8 ajaxurl is always defined in the admin header and points to admin-ajax.php
};
// bind form using 'ajaxForm'
$('#thumbnail_upload').ajaxForm(options);
});
function showRequest(formData, jqForm, options) {
//do extra stuff before submit like disable the submit button
$('#output1').html('Sending...');
$('#submit-ajax').attr("disabled", "disabled");
}
function showResponse(responseText, statusText, xhr, $form) {
//do extra stuff after submit
}
</script>
Sie müssen POSTID mit der tatsächlichen Post-ID aktualisieren. Erstellen Sie dann die Ajax-Funktion, um das Hochladen der Datei zu akzeptieren und das Post-Thumbnail zu aktualisieren
//hook the Ajax call
//for logged-in users
add_action('wp_ajax_my_upload_action', 'my_ajax_upload');
//for none logged-in users
add_action('wp_ajax_nopriv_my_upload_action', 'my_ajax_upload');
function my_ajax_upload(){
//simple Security check
check_ajax_referer('upload_thumb');
//get POST data
$post_id = $_POST['post_id'];
//require the needed files
require_once(ABSPATH . "wp-admin" . '/includes/image.php');
require_once(ABSPATH . "wp-admin" . '/includes/file.php');
require_once(ABSPATH . "wp-admin" . '/includes/media.php');
//then loop over the files that were sent and store them using media_handle_upload();
if ($_FILES) {
foreach ($_FILES as $file => $array) {
if ($_FILES[$file]['error'] !== UPLOAD_ERR_OK) {
echo "upload error : " . $_FILES[$file]['error'];
die();
}
$attach_id = media_handle_upload( $file, $post_id );
}
}
//and if you want to set that image as Post then use:
update_post_meta($post_id,'_thumbnail_id',$attach_id);
echo "uploaded the new Thumbnail";
die();
}
hoffe das hilft
add_action(...
für diemy_ajax_upload
Funktion mit Hook ( ) verknüpft ist .$_POST
zum Zeitpunkt meiner Ankunft keine Datenmy_ajax_upload
, obwohlshowRequest
derformData
Parameter im JS-Rückruf alles enthält, was ich erwarte.