jQuery Code for make ajax request -
This code is just copy and past in your js file.
jQuery(document).ready(function($) {
var data = {
'action': 'my_action',
'content': "Hi I am WordPress Ajax Responce", // We pass php values differently! id pass kiya hai
};
// We can also pass the url value
//separately from ajaxurl for front end AJAX implementations
jQuery.post(ajax_object.ajaxurl, data, function(response) {
// alert(response);
console.log(response);
});
});
My Popular Post- Note-Pad tool using javascript
And Now you Need to make a response in functions.php file like this
function task_enqueue_scripts() {
/*
JavaScript Localizetion For call the url in js “admin_ajax.php”;
*/
wp_enqueue_script( 'Your_jsFilename', get_stylesheet_directory_uri().'/yourjsfilename.js', array('jquery'), null, true );
wp_localize_script( 'Your_jsFilename', 'ajax_object',
array( 'ajaxurl' => admin_url( 'admin-ajax.php' )));
}
add_action( 'wp_enqueue_scripts', 'task_enqueue_scripts' );
// handel req of wpadmin request here and send a respons
add_action('wp_ajax_my_action', 'my_callback_function');
add_action( 'wp_ajax_nopriv_my_action', 'my_callback_function' );
function my_callback_function() {
$content = $_POST['content'];
echo $content;
wp_die();
}
Note - : //must you need to use wp_die(); other wise it's return with 0 and error in response .
अगर आप यहां तक आ गए है तो please Subscribe कर जाना 🙏।
1 Comments
simple file upload in media library in wordpress ----
ReplyDeletefunction short_code(){
ob_start();
?>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
<script src="https://unpkg.com/dropzone@6.0.0-beta.1/dist/dropzone-min.js"></script>
<link href="https://unpkg.com/dropzone@6.0.0-beta.1/dist/dropzone.css" rel="stylesheet" type="text/css" />
<form enctype="multipart/form-data" id="image-upload-form">
<input type="file" id="image-file" accept="image/*" />
<button type="button" id="upload-button">Upload Image</button>
</form>
<script>
jQuery(document).ready(function ($) {
$('#upload-button').on('click', function () {
var formData = new FormData();
var fileInput = $('#image-file')[0].files[0];
if (fileInput) {
formData.append('file', fileInput);
formData.append('action','image_upload');
$.ajax({
url: 'http://testingdemo.great-site.net/wp-admin/admin-ajax.php', // Replace with your WordPress admin-ajax.php URL
type: 'POST',
data: formData,
contentType: false,
processData: false,
success: function (response) {
console.log(response);
var myObj = JSON.parse(response);
if(myObj['status']=='success'){
alert('success');
}
}
});
} else {
$('#message').html('Please select an image file.');
}
});
});
</script>
<?php
return ob_get_clean();
}
add_shortcode( "upload_img","short_code" );
//php handlig code here =
function handle_image_upload() {
if (isset($_FILES['file'])) {
$file = $_FILES['file'];
// Upload the image and get the attachment ID
$filename = sanitize_file_name($file['name']);
$attachment_id = media_handle_upload('file', 0);
echo json_encode(array('post_id'=>$attachment_id,'status'=>'success'));
} else {
echo json_encode(array('error'=>'not uploaded'));
}
die();
}
add_action('wp_ajax_image_upload', 'handle_image_upload');
add_action('wp_ajax_nopriv_image_upload', 'handle_image_upload');