jquery- how to run ajax in document ready? - php

I'm trying to load information with ajax when my page loads but no information is displaying, can anyone spot what I'm doing wrong?
$(document).ready(function (){
$.ajax({
url: 'ajax_load.php',
type: "post",
data: "artist=<?php echo $artist; ?>",
dataType: 'html',
beforeSend: function() {
$('#current_page').append("loading..");
},
success: finished(html),
});
});
function finished(result) {
$('#current_page').append(result);
};
ajax_load.php contains:
<?php
if(isset($_POST['artist'])) {
$artist = $_POST['artist'];
echo $artist;
}
echo "test";
?>
the html part of the page is fine

You need to change the value of the success option to be a reference to a function:
$(document).ready(function (){
$.ajax({
url: 'ajax_load.php',
type: "post",
data: "artist=<?php echo $artist; ?>",
dataType: 'html',
beforeSend: function() {
$('#current_page').append("loading..");
},
success: finished //Change to this
});
});
Currently you are setting success to the return value of finished, which is undefined. If you check your browser console you will likely be getting an error along the lines of "undefined is not a function".

Related

Jquery simple Ajax Post PHP not working

I have a simple code but is not working. I want to create a more complex function but I just need the basic structure.
HTML
<span class="cleanreport">Delete Record</span>
Javascript:
$( ".cleanreport" ).click(function() {
var token = "test";
$.ajax({
data: {"data": token},
type: "post",
url: "clean.php",
success: function (data) {
console.log(data);
$('.test').html(data);
}
});
});
PHP clean.php
$data = $_POST['data'];
echo $data;
What I am doing wrong?
This should work for you:
var token = "test";
$.ajax({
type: 'POST',
url: "clean.php",
data: {id: token},
dataType: "json",
success: function(response) {
// some debug could be here
},
error: function(a,b,c) {
// some debug could be here
}
});
If not, please debug success and error parameters using console.log().
Based on jquery documentation setting type is an alias for method so this could not be a problem in you case for sure.
$( ".cleanreport" ).click(function() {
var token = "test";
$.post('clean.php",
{
data: token
},
function (data,status) {
//console.log(data);
$('.test').html(data);
});
});

jquery json request failed

I'm trying to make a json call with jquery but noting happened. My code:
javascript:
<script type="text/javascript" charset="utf-8">
$(document).ready(function()
{
$("#TwImport").click(function()
{
$.ajax({
type: "POST",
url: "https://<?php echo $_conf['siteurl']; ?>/files/connect/import/customers.php",
dataType: 'json',
success: function (data)
{
alert(data.percentage);
}
});
});
});
</script>
PHP
$output = array(
'percentage' => "50"
);
echo json_encode($output);
Any suggestions?
The code looks fine to me,
EDITED
Also try removing the protocol and use url: "//<?php echo $_conf['siteurl']; ?>/files/connect/import/customers.php",
$("#TwImport").click(function()
{
$.ajax({
type: "POST",
url: "https://<?php echo $_conf['siteurl']; ?>/files/connect/import/customers.php",
dataType: 'json',
success: function (data)
{
alert(data.percentage);
},
error: function (jqXHR,textStatus,errorThrown)
{
//Check for any error here
}
});
});
if you add and error callback to the ajax call you should get some error printouts to let you know what is going on
$.ajax({
type: "POST",
url: "https://<?php echo $_conf['siteurl']; ?>/files/connect/import/customers.php",
dataType: 'json',
success: function (data)
{
alert(data.percentage);
},
error : function (e1, e2, e3) {
console.log(e1);
console.log(e2);
console.log(e3);
}
});
EDIT:
i just had a thought, if i remember correctly jquery ajax doesnt like using full url's if possible try using a relative path

ajax is not getting executed

Hi i have ajax in my project, in other files, but for this one particular instance where I call scripts/claim.php and pass in an id parameter via GET it doesn't seem to work.
HTML
<input type="hidden" id="claimid" value =<?php echo $fetch_donate['id'];?>>
<input type="button" onclick="processclaim();" class="btn" value="claim - <?php if($donate_type=='generic'){ echo $ebase;} else { echo $fetch_donate['ebase'];}?> PP"></div>
PHP
if($_SERVER['REQUEST_METHOD'] == 'POST' && isset($_POST['id'])) {
....
}
Javascript
<script>
function processclaim() {
alert("hi");
var id=document.getElementById('claimid').value;
alert(id);
$.ajax({
type: "POST",
url: "scripts/claim.php",
data: {id: id},
dataType: "json",
success: function(data) {
window.location = "profile.php";
}
});
alert(id);
}
</script>
the alerts work, displays "hi" and the correct id that is passed.
You are probably getting an error back from your server, add that state to the Ajax call
$.ajax({
type: "POST",
url: "scripts/claim.php",
data: {id: id},
dataType: "json",
success: function(data) {
window.location = "profile.php";
},
error: function() {
console.error("ERROR!", arguments);
}
});
My guess is you are setting the dataType coming back as JSON and it is not being returned from the server as JSON.

ajax call php code in a file and get result

Some code I want to call from ajax is in a separate file.php:
<?php
session_start();
$email1 = $_POST['email1'];
//some code here processing $email1
$response = 'some text';
?>
This is how I call it from ajax:
$.ajax({ url: 'file.php',
data: {email1: $("#user_email").val()},
type: 'post'
});
I'd like to be able to do something like this after the call to file.php:
alert($response);
How do I do that?
In your PHP you have to echo the $response, and in your JS you have to specify the callback function like so:
$.ajax({
url: 'file.php',
data: {
email1: $("#user_email").val()
},
type: 'post',
success: function(data) {
alert(data);
}
});
Inside the ajax call, include a success.. ex:
success: function(data) {
alert(data);
},
This will pop an alert up with your response.
Try:
$.ajax({ url: 'file.php',
data: {email1: $("#user_email").val()},
type: 'post',
success: function(data) {
alert(data);
}
});
Check out the documentation
You also need to echo out the response in your PHP file:
echo $response;
Something like this?
$.ajax({
type: "POST",
url: "file.php",
data: {email1: $("#user_email").val()},
success: function(data) {
alert(data);
}
});

AJAX POST: echoing posted anchor tag value

HTML/jQuery:
Friends
<script type="text/javascript">
$(document).ready(function() {
$('a#friends').click(function() {
$.ajax({
type: "POST",
url: "data.php",
data: $('#friends').html(),
success: function(data) {
$('#questions').html(data);
},
dataType: "HTML"
});
});
});
</script>
data.php:
<?php
echo $_POST['#friends'];
?>
How do I return this POST value of an id in an anchor tag? The variable is being passed to PHP because I can alert it, but the problem is getting it back.
You need to specify the name of the value you are sending across in your AJAX request. Try this:
$.ajax({
type: "POST",
url: "data.php",
data: { 'friends': $('#friends').html() }, // Note the value is sent in an object with a key of 'friends'
success: function(data) {
$('#questions').html(data);
},
dataType: "HTML"
});
<?php
echo $_POST['friends']; // retrieve the 'friends' value
?>
How you are passing the data to PHP,
please use the following code,
Friends
<script type="text/javascript">
$(document).ready(function() {
$('a#friends').click(function() {
$.ajax({
type: "POST",
url: "data.php",
data: {'friends' : $('#friends').html()},
success: function(data) {
$('#questions').html(data);
},
dataType: "HTML"
});
});
</script>
<?php
echo $_POST['friends'];
?>
Your syntax is wrong for passing friends value to data.php
Try this
$(document).ready(function() {
$('a#friends').click(function() {
$.ajax({
type: "POST",
url: "data.php",
data: "friends="+$('#friends').html(),
success: function(data) {
$('#questions').html(data);
},
dataType: "HTML"
});
});
<?php
echo $_POST['friends'];
?>
First of all you can't send data to the ajax page in this way
data: $('#friends').html(),
A more suitable way would be
data : {'key1':'val1', 'key2':'val2'}
Then on the php page, you can retrieve these values in this fashion
$key1 = $_POST['key1']; // will contain 'val1'
$key2= $_POST['key2']; // will contain 'val2'
alternatively you can use
Friends
<script type="text/javascript">
$(document).ready(function() {
$('a#friends').click(function() {
$.post("data.php",{
friends: $("#friends").html()
},function(data){
$("#questions").html($.trim(data)); // trim to be sure
});
});
});
</script>
and in the php:
<?php
echo $_POST['friends'];
?>
Pass the data variable in data field. For more info see below example
$(document).ready(function() {
$('a#friends').click(function() {
alert("");
$.ajax({
type: "POST",
url: "data.php",
data: "#friends="+$('#friends').html(),
success: function(data) {
alert(data);
$('#questions').html(data);
},
dataType: "HTML"
});
});
});

Categories