I've just started learning jQuery and PHP, and I encountered a problem when I try to use Ajax. Either the $.ajax() function won't fire, or PHP won't return anything, I cannot tell. I must have forgotten something really stupid, I guess...
Here's the code. There's no reply, no alert, nothing.
js:
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script>
$(document).ready(function() {
$.ajax({
url: "get_profile.php",
type: "GET",
data: {},
done: function(response) {
alert("response");
}
});
});
</script>
PHP:
<?php echo "Something"; ?>
Thanks in advance.
$.ajax({
url: "get_profile.php",
type: "GET",
data: {},
done: function(response) {
alert("response");
}
});
supposed to be
$.ajax({
url: "get_profile.php",
type: "GET",
data: {},
}).done(function(response) {
alert("response");
});
success , error methods are generally declared in the place where you have written done which are now deprecated
You have your done in the wrong place.
Try this instead:
$.ajax({
url: "get_profile.php",
type: "GET",
data: {}
})
.done(function(response) {
alert("response");
});
You can have alternative option for check is there any error in your ajax call. and you can also do some stuff before getting the response of your ajax call like loading image shows to end users until the response result. for this you can use following code:
$.ajax({
url: "get_profile.php",
type: "GET",
data: {},
beforeSend:function(){
//do something like loading image
},
success:function(response){
alert(response);
},
error:function(e){
alert("something wrong"+e);
}
})
Related
I'm trying to make an app where if you click on a div, the data-id will be put into a variable, which will give PHP the select parameters to look for. Here's my code to better explain it.
HTML:
<div class="box" data-id="caption"></div>
JQuery:
$('.box').click(function () {
var caption = $(this).data('id');
});
After Googling I found the best way to do this is through AJAX, which I then proceeded to try:
$.ajax({
url: 'index.php',
type: 'GET',
dataType: 'json',
data: ({ caption }),
success: function(data){
console.log(data);
}, error: function() {
console.log("error");
}
});
However, this doesn't seem to work. If there's a better way to do what I mentioned above, I'm open to new ideas.
EDIT
Here is my PHP code.
if(isset($_GET['caption'])){
echo $caption;
$select = "SELECT * FROM pics WHERE text = '".$caption."'";
}
?>
Look through the api at jQuery.
Your data key should contain a json object -
$.ajax({
url: 'index.php',
type: 'GET',
dataType: 'json',
data: {caption: caption},
success: function(data){
console.log(data);
}, error: function(error) {
console.log(error);
}
});
I have a simple code-form like this:
$.ajax({
url: "http://myurl/test.php",
type: "POST",
dataType: "html",
data: {
action: "login"
},
success: function (data) {
console.log(data)
}
});
When on PHP server page, I try to print $_POST["action"] yet this field is blank. Why does it work fine if I use $.post(url,data,function)?
$.ajax({
url: "http://myurl/test.php",
type: "POST",
dataType: "html",
data: {
method: "login"
},
success: function (data) {
console.log(data);
}
});
login is a php function
You may use method instead of type.
$.ajax({
url: "http://myurl/test.php",
method: "POST", // <-- Use method, not type
dataType: "html",
data: {
action: "login"
},
success: function (data) {
console.log(data)
}
});
Problem is solved.....
There is a problem with the callback on success event...and yesterday I focused my attention only on the request php in the developers tool....when I used Curl (with the right request) all work correctly and I forgot to check client code in success callback....
Never use post method with developers console,it's very easy to lose more time :=)
here is my simple code in trying to get data from php to ajax.
i just wanted to get a simple data pass back to ajax success. i already searched for this but i cant get it properly. my code is really simple.
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<SCRIPT TYPE="text/javascript">
$(document).ready(function(){
$("#1").click(function(){
$.ajax({
type: "POST",
url: "ajax.php",
data: { "txt": "try"},
cache: false,
success: function(html)
{
alert(html.mes);
}
});
});
});
</SCRIPT>
<pre><button id="1">try</button></pre>
Then i load a ajax.php that has a simple code too
$var['mes'] = 'message';
echo json_encode($var);
and its alerting me "undefined". i know this is simple but i cant find it out where do am i wrong
You need to tell jQuery that the script is running JSON:
$(document).ready(function(){
$("#1").click(function(){
$.ajax({
type: "POST",
url: "ajax.php",
data: { "txt": "try"},
dataType: 'json',
cache: false,
success: function(html)
{
alert(html.mes);
}
});
});
});
Simply I would like to load data from two php page using jquery. I put the below code together, however only the one works not both. Any ideas?
$(document).ready(function() {
loadData();
});
var loadData = function() {
$.ajax({
type: "GET",
url: "second.php",
dataType: "html",
success: function(response){
$(".hm_m_un").html(response);
setTimeout(loadData, 1000);
}
});
};
$(document).ready(function() {
loadData();
});
var loadData = function() {
$.ajax({
type: "GET",
url: "test.php",
dataType: "html",
success: function(response){
$(".rx").html(response);
setTimeout(loadData, 1000);
}
});
};
You're overriding your first loadData variable with the second one. Give it a different name and you'll be fine.
As a note, you don't need to call $(document).ready() twice, you can technically call it once. I would write this as something like:
function descriptiveFunctionName() {
$.ajax({
type: "GET",
url: "second.php",
dataType: "html",
success: function(response){
$(".hm_m_un").html(response);
setTimeout(loadData, 1000);
}
});
}
function anotherDescriptiveFunctionName() {
$.ajax({
type: "GET",
url: "test.php",
dataType: "html",
success: function(response){
$(".rx").html(response);
setTimeout(loadData, 1000);
}
});
}
$(document).ready(function() {
descriptiveFunctionName();
anotherDescriptiveFunctionName();
});
Please note though this was a very lazy answer, user Machavity's code is much better for reuse, although you may want to just use a callback sent to loadData for more flexibility in the future.
You've named them all the same. Try some consolidation
$(document).ready(function() {
window.setInterval(function() { loadData('second.php', $('.hm_m_un')); }, 1000);
window.setInterval(function() { loadData('test.php', $(".rx")); }, 1000);
});
var loadData = function(page, ele) {
$.ajax({
type: "GET",
url: page,
dataType: "html",
success: function(response){
ele.html(response);
}
});
};
Very simple....you declared a variable loadData and assigned it to a function.
You then used same variable to assign to another function, thereby wiping out first instance. Use different variable names
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