Ajax POST error in firefox - javascript

I have two PHP files with one posting via ajax to the other one. The post works great in chrome. But it doesnt work in firefox. A debug with firebug shows "POST error" in red color. I am pasting my codes below.
Ajax:
var data_val={'user_name' : response.name,
'user_id' : response.id,
'user_first' : response.first_name,
'user_email' : response.email,
'user_birthday': response.birthday,
'user_location': response.location.name,
'user_hometown':response.hometown.name,
'user_bloodGroup':window.bloodGroup,
'user_bloodRare':window.user_bloodRare,
'user_phone_no':window.user_phone,
};
$.ajax({
type: "POST",
url: "buddha.php",
data: data_val,})
});
The file into which it is being posted, buddha.php.
$name1 = $_POST['user_name'];
$email1 = $_POST['user_email'];
$birthday1=$_POST['user_birthday'];
$location1=$_POST['user_location'];
$hometown1=$_POST['user_hometown'];
$fbbloodgroup=$_POST['user_bloodGroup'];
$fbuserid=$_POST['user_id'];
$user_phone=$_POST['user_phone_no'];
$user_bloodRare=$_POST['user_bloodRare'];
$user_email=$_POST['user_email'];
The above ajax is inside a javascript function,
function fetchUserDetail()
It is called in a buttonclick as follows.
<a class="button_for_me" onclick="checkFacebookLogin()" >Register Me </a>
I have to repeat, this works perfectly and pleasantly in chrome. Initially i thought it was the problem of the success alerts shown at he return of the ajax function, but its not.

Assuming from your question that "response" is an object returned by FB API call, I would like to say that the problem is with the Facebook API. Sometimes, the user doesn't have value for variables like "Hometown" and "CurrentTown". In that case, the following assign operations in your code would fail.
'user_location': response.location.name,
'user_hometown':response.hometown.name,
'user_bloodGroup':window.bloodGroup,

Try changing the ajax from:
$.ajax({
type: "POST",
url: "buddha.php",
data: data_val,})
});
to remove the extra closing tags and comma after data_val like
$.ajax({
type: "POST",
url: "buddha.php",
data: data_val
});
Check out this jsFiddle i created for you with an event binding on the class to trigger the ajax request when clicked.

Related

Data in ajax call not being passed to controller

I have this simple javascript in a Spring MVC with jQuery application:
console.log("POST Variables:",postVariables);
$.ajax({
type: "POST",
url: theUrl,
traditional: true,
data: postVariables,
complete: modelCallback,
fail : errorFunction
});
the console logs this:
POST Variables: applicationId=977
Which is correct. I have this in my controller:
public HashMap<String, Object> getApplication(HttpServletRequest request) {
String applicationId = (String) request.getParameter("applicationId");
logger.error("ApplicationId:"+applicationId);
Iterator<?> it = request.getParameterMap().keySet().iterator();
logger.error("Begining parameters:"+request.getParameterMap().keySet().size());
This produces null for the String applicationId, and a 0 for parameter map size. I originally had the method annotated with #RequestParam, but that failed and I could not figure out why. I removed that, and I see that the ajax call is not sending anything.
I have tried JSON, Javascript Object, and (in this example) a String of request parameters. I have tried with and without the traditional.
I AM using this call inside a callback function from a jQuery get function like this:
$.get(templateUrl).complete(callback);
But why is NOTHING getting to my controller?
UPDATE If I change it to a GET, the parameters are added at the end of the call like they should and everything works fine.
What is even stranger, is that this is in a function, that gets called before, and it works as a POST. same function. (different URL and data of course) but SAME function. Works once, then looks like it fails. Is there like some socket I need to close? I grabbing at straws here.
You should pass the data to the controller as key value pairs.Not with the equals sign in it.
For example, Not,
applicationId=977
it should be,
applicationId:977
add this for the ajax request.
$.ajax({
type: "POST",
url: theUrl,
traditional: true,
data: {applicationId : "Your application ID as a number"},
complete: modelCallback,
fail : errorFunction
});

AJAX post variable to PHP not working

I am trying to get a jQuery variable to a PHP variable. I have looked it up but can't find a solution. I have the following jQuery:
$('.eventRow').click(function(){
var eventID = $(this).attr('id');
$.ajax(
{
url: "index.php",
type: "POST",
data: {'phpEventId': eventID },
success: function (result) {
console.log('success');
}
});
When I console.log te "eventID" it correctly displays the number.
My PHP code is in the index.php. This is also where the .eventRow class is.
<?php
$phpEventId = $_POST['phpEventId'];
echo "<script>console.log('Nummer: ".$phpEventId."')</script>";
print $phpEventId;
?>
However nothing happens. The console.log just displays: "Number: " Is there something wrong with the code? Thanks for your help!
EDIT: Could it be the problem that the index.php is already loaded before I click on the button? Because this php code is in the index.php and thus the $phpEventId is not yet set.
In your Ajax, the type: "POST" is for jQuery prior to 1.9.0. If you're using the latest jQuery, then use method: "POST".
If you're using the latest jQuery and you don't specify method: "POST", then it defaults to method: "GET" and your PHP needs to capture it with $_GET['phpEventId'];.
After reading your update, let's try one thing. Change your PHP to return something meaningful to Ajax:
<?php
$phpEventId = $_POST['phpEventId'];
echo $phpEventId;
?>
Then try to capture the PHP response in your Ajax:
$.ajax({
url: "index.php",
method: "POST",
data: {'phpEventId': eventID },
success: function (result) {
alert("result: " + result);
}
});
This is just a part of your code, and the problem is somewhere else. In this context your code works just fine:
<div class="eventrow" id="1">This</div>
<div class="eventrow" id="2">That</div>
<script>
$('.eventRow').click(function(){
var eventID = $(this).attr('id');
$.ajax(
{
url: "index-1.php",
type: "POST",
data: {'phpEventId': eventID },
success: function (result) {
console.log('success: '+eventID);
}
});
});
</script>
With the matching index-1.php:
<?php
$phpEventId = $_POST['phpEventId'];
echo "<script>console.log('Nummer: ".$phpEventId."')</script>";
print $phpEventId;
?>
Not sure though why do you print javascript code (console.log) into an ajax response here...
Error Is Visible Even Here
According to WebZed round statistic report, this error was visible over 84% of web-developers.
Failed to post data to PHP via JQuery while both frameworks and codes were updated.
Possible Solutions Available Today
Try using other methods for posting because JQUERY and AJAX libraries are not as efficient as shown in the surveys.
New frameworks are available which can do better with PHP.
Alternative method is to create a post request via $_GET method.
Regular HTML5 supports <form></form> try method="post". For security reasons try using enctype="" command.
Try using React Native https://nativebase.io/

Jquery ajax post to php but is saying no value in variable

I am working on an instant search thing and when I submit the form search-form it is going to make an ajax post to PHP. It sends and everything but then the PHP page says that the variable has no value but the data is clearly being posted.
$('#search-form').submit(function(event) {
event.preventDefault();
$.ajax({
type: "POST",
url: "Search.php",
cache: false,
data: $("#search-form").serialize(),
success: function(data) {
alert($("#search-form").serialize());
$("#searched").fadeIn("fast");
$("#results").empty();
$("#results").append(data);
}
});
return false;
});
Make sure you have a console opened up in your browser, Firefox: bugzilla, Chrome and IE have a built-in. It shows you what is happening in asynchronous requests.
in your php file at the top do this:
var_dump($_POST);
//OR DO THIS:
// print_r($_POST);
Then look at your browser console to see what the response is. It should spit out an array. and you can see what the name of your data is. This is the quickest way to debug any ajax request.
Also, don't forget that you serialized the data with .serialize();

AJAX Load Content

Im completely lost on how to work AJAX. Looked up some tutorials and all seemed pretty confusing. I ran into the problem: [ Script only runs once ].
I would use it to reload pages like so: [ http://www.roblox.com/Poison-Horns-item?id=62152671 ] so I could get the latest item prices, without refreshing the page. if anyone could help/tell/point me in the right direction, it'd help TONS.
Im somewhat a beginner scripter, so be a little patient ;)
Thanks for any help,
Alex
AJAX requests are the same as page requests (GET and POST), except that they are handled asynchronously and without leaving the current page. The response data is the source of the page you wanted to fetch. That source is useless until you parse/use it.
A simple jQuery example:
//for example, we are on example.com
$.ajax({
type : 'get', //the METHOD of the request, like the method of the form
url : 'index.php' //the url to fetch
data : { //additional data which is synonymous to:
query1 : 'foo', // - url queries
query2 : 'bar', // - form inputs
query3 : 'baz',
},
success : function(resposeText){ //response text is the raw source of the fetched resource
$(element).html(responseText); //use response as HTML for element
}
});
//this is similar to requesting:
http://example.com/index.php?query1=foo&query2=bar&query3=baz
agree with joseph. You can use ajax by javascript manner or by jQuery, I personally suggest jQuery because it is simple to implement.
$.ajax({
type: 'GET',
url: "URL you want to call" ,
data: 'Data you want to pass to above URL',
cache: true, //to enable cache in browser
timeout: 3000, // sets timeout to 3 seconds
beforeSend: function() {
//when ur ajax call generate then u can set here loading spinner
},
error: function(){
// will fire when timeout is reached
},
success: function(response){
//in response you can get your response data from above called url.
}
});

jQuery now showing the phrased variable value

Stuck on the first stage of a big project. I am trying to display the JSON value that I get from URL shown below. It shows the data when I past the URL on the a browser. But when I put the URL in variable and try to show in html it doesn't show the phrased value.(I will delete the app/key one I get the solution.) Thanks in advance.
http://jsfiddle.net/rexonms/6Adbu/
http://api.flickr.com/services/rest/?format=json&method=flickr.photosets.getPhotos&photoset_id=72157629130565949&per_page=10&page=1&api_key=ccc93a20a1bb9060fa09041fa8e19fb5&jsoncallback=?
Have you tried using the $.getJSON() or the $.ajax() method? This seems to return the data just fine:
$.getJSON(apiCall, function(data) {
console.log(data);
});
Here's a working fiddle.
Additional Information
It seems like you may benefit from a simple tutorial that explains AJAX in relation to jQuery's $.getJSON() and $.ajax() methods.
$("<span>").html(apiCall)
apiCall is a string (containing the URL). All you're doing here is setting a span to have the URL as its content. You need to actually use AJAX to load said URL.
$.ajax({
url: 'http://api.flickr.com/services/rest/',
dataType: 'jsonp',
type: 'GET',
data: {
format: 'json',
method: 'flickr.photosets.getPhotos',
photoset_id: '72157629130565949',
per_page: 10,
page: 1,
api_key: 'ccc93a20a1bb9060fa09041fa8e19fb5'
},
jsonp: 'jsoncallback',
success: function(data){
console.log(data);
}
});
Inside success, data is the JSON object returned by the API.

Categories

Resources