Return the whole file with AJAX/JSON - javascript

I have one file with a long script which has a variable "period" in it. I will send the value of that variable via the front page of the site to that file. The value will be filled into the file and return it to the front page.
So I want the code <code period="x"> placed in the front page as something like <code period="1">
I want to do that multiple times with different values.
Does someone know how this can be done?
I saw this script, but it didn't work:
if($error === false) {
alert($error);
$.ajax({
url: '\get.php',
type: 'POST',
dataType: "json",
data: {
period: "1"
},
success: function(data){
alert(JSON.stringify(data));
}
});
Thanks

You have a syntax error. See the inline comment:
if($error === false) {
alert($error);
$.ajax({
url: '/get.php',
type: 'POST',
dataType: "json",
data: {
period: "1"
},
success: function(data){
alert(JSON.stringify(data));
}
});
} // << this was missing

you missed a } for the callback to success.

if($error === false) {
alert($error);
$.ajax({
url: '/get.php',
type: 'POST',
dataType: "json",
data: {
period: "1"
},
success: function(data){
alert(JSON.stringify(data));
}
});
}// **This was missing**

Related

jQuery AJAX POST method not working

I am trying to execute the AJAX operation. the call is working fine but the problem I am having is that I am getting an empty string as a response. There is no error in the console. all I get is an empty string. Even when I change the dataType to JSON, I still get the same response.
JavaScript Code:
$.ajax({
url: "data/saveCart.php",
method: "POST",
data: {
cartItem:item
},
dataType: "text",
success: function(data){
console.log(data);
}
});
PHP code:
if(isset($_POST['cartItem'])) {
echo "AJAX successful";
} else {
echo "AJAX failed";
}
It seems like it was caused by not stringifying your data.
var item = {
toothbrush: {
price: 1
}
};
$.ajax({
url: "data/saveCart.php",
method: "POST",
data: {
cartItem: JSON.stringify( item )
},
dataType: "text",
success: function(data){
console.log(data);
}
});

How to pass the text field value to C# page using ajax

I want to pass the parameter to another page using ajax.Actually i have one popup dialog box,in that dialog box i have one text field,i have to send that value to another page to save into db.not getting how to do it.
Here is my code
$(function() {
$("#button").click(function() {
$("#popup").dialog({
title: "Add",
width: 430,
height: 250,
modal: true,
buttons: {
Add: function() {
var t = ($('#user').val());
$.ajax({
type: "POST",
url: "Details.aspx.cs/getData",
data: {
"test1": t
},
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(data) {
alert(data);
}
});
$(this).dialog('close');
}
}
});
});
})
The ajax call seems fine. There could be a possibility that the json string is not formed correctly from the textbox javascript value. try using JSON.stringify:
function() {
var t = ($('#user').val().trim());
var payload = { "test1" : t };
$.ajax({
type: "POST",
url: "Details.aspx.cs/getData",
data: JSON.stringify(payload),
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(data) {
alert(data);
}
});
You are not transferring the data correct. if you want to do it this way, you have you use JSON.stringify of JSON.parse.
You can also try to use
data: "{'test':'" + t+ "'}",
or something of this sort, I used to do it in the past, but don't have the example in front of my eyes now. Will have it clearly later on though.

Ajax redirect on error

I'm calling php file through ajax call and if it returns nothing i want to redirect user to another page (It's for error reports, if it doesn't return anything it means that user logged in). Tried to add error section but it doesn't work. Any suggestions will help. Thanks! Btw, I have small jQuery function at the top of the ajax function, why it breaks my whole ajax call?
ajax.js
function loginAjax() {
//$("#email_errors").empty(); //This function doesnt work and kills whole ajax call. Here is loginAjax function call line - <button type = "submit" id = "push_button" onclick = "loginAjax(); return false">PushMe</button>
$.ajax({
url: "Classes/call_methods_login.php",
type: "POST",
dataType: "json",
data: {
login_email: $("#login_email").val(),
login_password: $("#login_password").val(),
},
success: function(data) {
$("#login_error").html(data.login_message);
}
});
}
$.ajax({
url: "Classes/call_methods_login.php",
type: "POST",
dataType: "json",
data: {
login_email: $("#login_email").val(),
login_password: $("#login_password").val(),
},
success: function(data) {
$("#login_error").html(data.login_message);
},
error: function(){
window.location.replace("http://stackoverflow.com");
}
});
}
To redirect using javascript all you need to do is override the location.href attribute.
function loginAjax() {
$.ajax({
url: "Classes/call_methods_login.php",
type: "POST",
dataType: "json",
data: {
login_email: $("#login_email").val(),
login_password: $("#login_password").val(),
},
// the success method is deprecated in favor of done.
done: function(data) {
$("#login_error").html(data.login_message);
},
fail: function(data) {
location.href="path/to/error/page";
}
});
}

Jquery set HTML via ajax

I have the following span:
<span class='username'> </span>
to populate this i have to get a value from PHP therefor i use Ajax:
$('.username').html(getUsername());
function getUsername(){
$.ajax({
type: 'POST',
url: myBaseUrl + 'Profiles/ajax_getUsername',
dataType: 'json',
data: {
},
success: function(data){
document.write(data);
}
})
}
Now when i debug i see that the returned data (data) is the correct value but the html between the span tags stay the same.
What am i doing wrong?
Little update
I have tried the following:
function getUsername(){
$.ajax({
type: 'POST',
url: myBaseUrl + 'Profiles/ajax_getUsername',
dataType: 'json',
data: {
},
success: function(data){
$('.username').html('RRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRRr');
}
})
}
getUsername();
Still there is no html between the tags (no text) but when i look at the console the method is completed and has been executed.
Answer to the little update
The error was in my Ajax function i forgot to print the actual response! Thank you for all of your answers, for those of you who are searching for this question here is my Ajax function:
public function ajax_getUsername(){
if ($this->RequestHandler->isAjax())
{
$this->autoLayout = false;
$this->autoRender = false;
$this->layout = 'ajax';
}
print json_encode($this->currentClient['username']);
}
Do note that i am using CakePHP which is why there are some buildin methods. All in all just remember print json_encode($this->currentClient['username']);
The logic flow of your code is not quite correct. An asynchronous function cannot return anything as execution will have moved to the next statement by the time the response is received. Instead, all processing required on the response must be done in the success handler. Try this:
function getUsername() {
$.ajax({
type: 'POST',
url: myBaseUrl + 'Profiles/ajax_getUsername',
dataType: 'json',
data: { },
success: function(data){
$('.username').html(data); // update the HTML here
}
})
}
getUsername();
Replace with this
success: function(data){
$('.username').text(data);
}
In success method you should use something like this:
$(".username").text(data);
You should set the html in callback
function getUsername() {
$.ajax({
type: 'POST',
url: myBaseUrl + 'Profiles/ajax_getUsername',
dataType: 'json',
data: {
},
success: function(data){
$('.username').html(data);
}
})
}
Add a return statement for the function getUsername
var result = "";
$('.username').html(getUsername());
function getUsername(){
$.ajax({
type: 'POST',
url: myBaseUrl + 'Profiles/ajax_getUsername',
dataType: 'json',
data: {
},
success: function(data){
document.write(data);
result = data;
}
})
return result;
}
You can use .load()
Api docs: http://api.jquery.com/load/
In your case:
$('.username').load(myBaseUrl + 'Profiles/ajax_getUsername',
{param1: value1, param2: value2});

How to update js object type variable via ajax?

I have a javascript variable that is created in php
echo "var".$locallist."=".create_js_variable($locallist,$db2_list_all,'db2');
and it looks in html page source code like
var locallist={
'CARINYA':[['2011-08-24-09-22 - w','20110824092216w'],['2011-08-18-13-15','20110818131546']],
'COVERNAN':[['2011-03-02-12-28','20110302122831']],
'DAVID':[['2010-12-22-19-43','20101222194348'],['2010-12-08-14-10','20101208141035']]};
Now I want to update the variable on button click via ajax
jQuery.ajax({
type: 'get',
dataType: 'text',
url: url,
data: {
what: 'db2list',
t: Math.random()
},
success: function(data, textStatus){
locallist = data;
console.log(locallist);
}
});
and the ajax calls this php code (note that it's the same php function that is called)
if($what == 'db2list') {
$db2_list_all = get_db2_database_list();
echo create_js_variable($locallist,$db2_list_all,'db2');
}
Console.log reports that
before update the variable is an object
after update it is a text
How can I fix that? So my other javascript code works again?
Well, look at your ajax call:
jQuery.ajax({
type: 'get',
dataType: 'text',
url: url,
data: {
what: 'db2list',
t: Math.random()
},
success: function(data, textStatus){
locallist = data;
console.log(locallist);
}
});
Notice you've got the dataType as text? It's going to bring the data in and treat it as text. Try changing the dataType to 'json'. That will convert the data that was brought in to a regular 'ol object, just like what you already have.
Your AJAX-request has a type dataType: 'text',
Change it to JSON :)
Use dataType: 'json'.
jQuery.ajax({
type: 'get',
dataType: 'json',
url: url,
data: {
what: 'db2list',
t: Math.random()
},
success: function(data, textStatus){
locallist = data;
console.log(locallist);
}
});

Categories