I’ve examine greater than 10 solutions that recommends utilizing motion in knowledge and including echo and die on the finish of perform. However nonetheless I get error of dangerous request. If I immediately open the URL “http://localhost/wpdemo/wp-admin/admin-ajax.php” in browser it returns 0.
Right here is my ajax code:
jQuery(doc).prepared(perform($) {
$('#submit').on('click on', perform(e){
e.preventDefault();
let title = $('#title').val();
let content material = $('#content material').val();
var formData = new FormData();
var formData = {
picture: doc.getElementById('image-input').recordsdata[0],
var1: title,
var2: content material
};
$.ajax({
url: "/wpdemo/wp-admin/admin-ajax.php",
kind: 'POST',
knowledge: { motion : 'my_ajax_handler', chosen : formData },
processData: false,
contentType: false,
success: perform(response) {
console.log(response);
}
});
})
});
I’ve added a php file to deal with ajax request. Right here is my PHP code.
<?php
perform my_ajax_handler() {
if (isset($_FILES['image'])){
$post_title = $_POST['var1'];
$picture = $_FILES['image'];
$post_content = $_POST['var2'];
$new_post = array(
'post_title' => $post_title,
'post_content' => $post_content,
'post_status' => 'publish',
'post_name' => 'pending',
);
$pid = wp_insert_post($new_post);
add_post_meta($pid, 'meta_key', true);
if (!function_exists('wp_generate_attachment_metadata'))
{
require_once(ABSPATH . "wp-admin" . '/consists of/picture.php');
require_once(ABSPATH . "wp-admin" . '/consists of/file.php');
require_once(ABSPATH . "wp-admin" . '/consists of/media.php');
}
if ($_FILES)
{
foreach ($_FILES as $file => $array)
{
if ($_FILES[$file]['error'] !== UPLOAD_ERR_OK)
{
return "add error : " . $_FILES[$file]['error'];
}
$attach_id = media_handle_upload( $file, $pid );
}
}
if ($attach_id > 0)
{
//and if you wish to set that picture as Publish then use:
update_post_meta($pid, '_thumbnail_id', $attach_id);
}
}
echo json_encode('success');
die();
}
add_action("wp_ajax_my_ajax_handler", "my_ajax_handler");
add_action("wp_ajax_nopriv_my_ajax_handler", "my_ajax_handler");
?>
My kind comes from a brief code I’m creating in my important plugin file.
My plugin file code is right here.
<?php
/*
Plugin Title: Notification Plugin Beta Model
Plugin URI: https://www.amirsandila.com/
Description: My first ever plugin n historical past of know-how. You'll love this plugin.
Model: 1.0
Writer: Amir Sandila
Writer URI: https://www.amirsandila.com
License: GPL2
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Textual content Area: amirsandila
Area Path: /languages
*/
outline("model", strtotime(date("Ymd")));
perform my_theme_enqueue_scripts() {
wp_enqueue_script( 'custom-jquery', 'https://code.jquery.com/jquery-3.5.1.min.js', array(), model, true );
wp_enqueue_script('ajax-script', '/wp-content/plugins/wp-plugin-demo/js/script.js',array(), model, true );
wp_localize_script( 'ajax-script','ajaxurl', admin_url( 'admin-ajax.php' ) ) ;
}
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_scripts' );
perform form_shortcode_func() {
$output="<fashion>
.form-container {
width: 70%;
margin: 0 auto;
border: 1px strong #ccc;
padding: 20px;
}
.form-container enter[type="text"], .form-container textarea {
width: 100%;
border: 1px strong #ccc;
padding: 10px;
margin-bottom: 10px;
}
.form-container enter[type="submit"] {
background-color: #333;
colour: #fff;
border: 0;
padding: 10px 20px;
cursor: pointer;
}
</fashion>
<h2> Sumit Your Article! </h2>
<div class="form-container">
<kind technique="POST" enctype="multipart/form-data">
<enter kind="textual content" id="title" identify="title" placeholder="Publish Title">
<textarea identify="message" id="content material" rows="20" cols="30" placeholder="Publish Physique"></textarea>
<enter kind="file" id="image-input" identify="picture">
<button id="submit"> submit </button>
</kind>
</div>";
return $output;
}
add_shortcode('kind', 'form_shortcode_func');