Ajax call Not Working in Custom plugin - javascript

I am creating a plugin to display all post types in a drop down and another select box to display the corresponding categories (taxonomies) of each post type. When the post type is changed the corresponding categories are selected via an ajax call.
This is my code:
add_action('admin_menu', 'taxonomy_menu');
function taxonomy_menu(){
add_menu_page( 'Taxonomy Plugin', 'Custom Taxonomy Plugin', 'manage_options', 'custom-taxonomy-plugin', 'tax_settings' );
}
function tax_settings(){
$url = plugin_dir_url().'cust-taxonomy/ajax_tax.php';
$taxo = get_taxonomies();
var_dump($url);
?>
<form method="POST" action="">
Post Type<select class="taxonomy">
<?php
foreach ( get_post_types() as $post_type ) {
?>
<option value="<?php echo $post_type;?>"><?php echo $post_type;?></option>
<?php } ?>
</select><br>
Categories<select>
<option value="">Select</option>
</select><br>
No: of posts<input type="text" name="num_posts"><br><span></span>
<input type="submit" name="submit" value="submit">
</form>
<?php
}
?>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery(".taxonomy").change(function(){
var post_type = this.value;
alert(post_type);
jQuery.ajax({
type:'POST',
url:"<?php echo plugin_dir_url().'cust-taxonomy/ajax_tax.php';?>",
data: post:post_type,
success:function(result){
alert(result);
}
});
});
});
</script>
Here no AJAX call is going to the corresponding URL. Why is that?

I could see that there is a syntax error in the call to jQuery.ajax(). The argument that you are passing is not a proper java script object. You need to enclose post: post_type with curly braces as shown below.
jQuery.ajax({
type:'POST',
url:"<?php echo plugin_dir_url().'cust-taxonomy/ajax_tax.php';?>",
data: {post:post_type},
success:function(result){
alert(result);
}
});

You can't use plugin_dir_url without argument.
Use this format instead;
plugin_dir_url(__FILE__).'cust-taxonomy/ajax_tax.php';

Related

POST method in wordpress

I trying to make opening WP posts in popup.
Firts part of code its form in posts loop where I get query of posts what should be opened
<form id="postForm" method="POST">
<input id="postQuery" style="display: none" name="postQuery" value="<?php echo get_the_ID() ?>">
<input id="sendQueryBtn" data-toggle="modal" data-target="#exampleModalLong" type="submit" value="<?php the_title(); ?>">
</form>
Next is my JS, where I do query check by alert
$(document).ready(function () {
$("form").submit(function () {
let xuinya = $(this).serialize();
$.ajax({
type: "POST",
url: '.../footer.php',
data: xuinya,
success: function (data) {
alert(xuinya)
},
error: function (jqXHR, text, error) {
$('#modalBody').html(error);
}
});
return false;
});});
And I final, here is part of HTML with modal, where I try to use POST
<div id="modalBody" class="modal-body">
<?php
echo $_POST["postQuery"];
echo apply_filters( 'the_content', get_post( $_POST["postQuery"] )->post_content );
?>
</div>
My problem is because when I check query in JS - qet alert message with correct value, but in php I always qet simple "1".
I don't get why you posting to footer.php, I think its should be admin-ajax.php
just simply add to youfooter.php
<script>
var ajax_url = "<?php echo admin_url( 'admin-ajax.php' ); ?>";
</script>
Change url value in js to ajax_url, make sure hat with data you posting variable action and then create function in functions.php, something like this(if you sending action value as 'get_pop_posts')
add_action( 'wp_ajax_get_pop_posts', 'get_pop_posts_init' );
add_action( 'wp_ajax_nopriv_get_pop_posts', 'get_pop_posts_init' );
function get_pop_posts_init() {
$data = $_POST;
print_r($data);
die();
}

I have a problem while fetching date in "class in C:\xampp\htdocs\ERP\std.php on line 4" from ajax code

I am new in ajax. i have a problem. i'm selecting value from select tag and sending it into ajax code that give me record at realtime but it display nothing in next select tag. if i tried to open second php file. it diplay error like, "Notice: Undefined index: class in C:\xampp\htdocs\ERP\std.php on line 4". i don't know what to do. help me.
Here is my code of ajax
<script>
function myfunction(datavalue) {
$.ajax({
type: 'POST',
url: 'std.php',
data: { class : datavalue},
success: function(response){
$('#stdName').html(response);
}
});
}
</script>
option from where i am getting value
<select name="std-class" onchange="myfunction(this.value)" id="stdClass">
<?php if(isset($_GET['fee_id'])){?>
<option value="<?php echo $row['std_class']; ?>"><?php echo $row['std_class'];?></option>
<?php }else {?>
<option>Select Class</option>
<?php }
$std=mysqli_query($con, "SELECT class_name FROM classes");
while($row1=mysqli_fetch_array($std)){
?>
<option value="<?php echo $row1['class_name'];?>"><?php echo $row1['class_name'];?></option>
<?php }?>
</select>
And this is the php file code
<?php
$con=mysqli_connect("localhost","root","","sms_db");
$class=$_POST['class'];
$result=mysqli_query($con, "SELECT * FROM students WHERE class='$class' ORDER BY id ASC");
while($rows=mysqli_fetch_assoc($result)){ ?>
<option value="<?php echo $rows['username'];?>"><?php echo ucwords($rows['name']);?></option>
<?php }
?>
I also tried this code but it also not working
<script>
function myfun() {
var select = document.getElementById('stdClass').value;
console.log(select);
$.post("std.php", {
class: select
},
function(response) {
$('#stdName').html(response);
});
}
</script>
<script>
function myfunction(datavalue) {
$.ajax({
type: 'POST',
url: 'std.php',
data: { "class" : datavalue},
success: function(response){
$('#stdName').html(response);
}
});
}
</script>

How to send data via ajax?

I'm trying to learn how does Ajax work and how I can send data by Ajax. I'm getting no error and nothing is being echoed.
index.html
<input id="name" type="text" /><input id="button" type="button" value="Load" />
<div id="feedback"></div>
<script type="text/javascript" src="../js/jquery.js"></script>
<script type="text/javascript" src="ajax.js"></script>
page.php
<?php
if (isset($_GE['name'])) {
$name = $_GET['name'];
}
?>
ajax.js
$('#button').click(function(){
var name = $('#name').val();
$.ajax({
url: 'page.php',
data: 'name='+name,
success: function(data){
$('#feedback').html(data);
}
});
});
I appreciate any help
You are missing an echo in your page php
<?php
if (isset($_GE['name'])) {
$name = $_GET['name'];
echo $name;
}
?>
also in your javascript send an object like this
data : { name : name}
should work
data : { name : 'John'}
you can check the success method is invoked or not invoked.
Also you need to echo something from php.
echo $name

Ajax call after changing the value of a 'option' tag

I am facing a little problem using ajax.
I need when I change the value of 'select' tag's 'option' then it will call ajax and the value which I get from the ajax call will show in 'input' tag named 't_name'. But its not working. What the problem in my code?How can I solve it? thank you.
Below is my code :
<select id="teacher_select" class="teacher_select" name="teacher_select" value="Select Teacher">
<option value="">Select Teacher</option>
<?php
while($row=mysql_fetch_assoc($teacher) ):
?>
<option value="<?php echo $row['t_id'];?>"><?php echo $row['t_name'];?></option>
<?php
endwhile;
?>
</select>
<input type="text" name="t_credit" id="t_credit"/>
Ajax :
$('#teacher_select').click(function(){
$.ajax({
type:'post',
url:'get_taken_credit.php',
data: 't_id='+ $('#teacher_select').val(),
success: function(reply_data){
$('#t_credit').html(reply_data);
}
});
});
get_taken_credit.php :
include('db_connection.php');
$t_id = $_POST['t_id'];
$result = mysql_query("SELECT t_credit FROM teacher WHERE t_id = '$t_id'");
echo $result;
exit();
It seems that the id is wrong, you call #teacher_select instead of #dept_select, and try to use
$('#dept_select').change(function () {
instead of
$('#teacher_select').click(function () {

javascript, ajax to PHP

I have this in my code and it doesnt work, please help me guys, I want to try passing the value when i pull from the dropdown, it process the data by onChange and showing the value in the tag
<label for="headmark" class="lbl-ui select">
<select id="headmark" name="headmark" onChange="getVal(this)">
<?php while (oci_fetch($headmark_parse)){?>
<option value="<?php echo $head_mark ?>" id="headmark">
<?php echo "$head_mark"; ?></option>
<?php } ?>
</select>
</label>
<script type="text/javascript">
function getVal(val){
$.ajax( {
type: 'POST',
url: update_fab_progress.php,
data: "&val=" + val,
success: function(data) {
alert("data");
}
} );
}
</script>
<?php
echo $_POST['val'];
?>
Use chrome developer tool to help you debug. I think your parameter 'val' in javascript is a little strange. May be, you send a request with empty parameter.

Categories

Resources