Laravel: I have some problem posting data with Ajax - javascript

Im new to using ajax and I have another post here about my code and they said it was correct.
However Im still facing issues
My code:
body[circle.id] = {id: currentid-1, x: event.offsetX, y: event.offsetY};
// Ajax
for(let i = 0;i < body.length;i++){
$.ajax({
url: 'get.php',
type: 'post',
data : {
data: body[i],
},
dataType: 'json',
});
}
The error:
[Error][1]

I cannot comment.
From the title I guess you are using Laravel.
I see you are hitting the file directly, but looks like you are showing only half the setup. In case Laravel.
What is the route setup?
And if the setup is like Route::get try Route::any.
How are you debugging the issue? Do you have any logs?
Can you check the logs of "web server"?
Either artisan serve or php -S should give at least some hints what your ajax is hitting.

According to the error image you have posted, The error says that the method only accepts the GET request but you are trying to make POST request in your AJAX method, Change your request type to GET like this,
$.ajax({
url: 'get.php',
type: 'get',
data : {
data: body[i],
},
dataType: 'json',
});

I fixed it.The problem was in url and routes

Related

Jquery: Probably a syntax Issue in ajax() method - Value not getting sent

I'm able to dump value of the variable message in console .
But im not able to send it off in POST Request.
AJAX call:
chat.throwmsg = function(message) {
if ($.trim(message).length != 0) {
console.log(message);
$.ajax({
url: 'ajax/chat.php',
type: 'post',
data: { method: 'throw', message: message} ,
success: function(data) {
chat.fetchmsgs();
$('textarea#entry').val('');
}
});
}
}
This maybe due to wrong syntax, but I've tried both single and double quotes, and combination as well .
With a wild assumption, you are not having any error messages in developer console and chat.php has a post handler forthese parameters
Since your data is JSON, please change the code as this way and have a try..
var temp={ method: 'throw', message: message};
var param=JSON.stringify(temp);
$.ajax({
url: 'ajax/chat.php',
type: 'post',
data: param ,
dataType: "json",
success: function(data) {
chat.fetchmsgs();
$('textarea#entry').val('');
}
});
after reviewing the code I could not find any issues that restrict the data to be sent along with ajax request,if you are having any syntax errors you should have been warned prior the request initialization, however I recommend you to check the request header in the network tab of browser console and see your sending data along with the request if it's there you probably need to check the code of getting the post data in your server-side implementations

Wikipedia API. File not found Error

I'm trying to make a wikipedia search bar. The idea is to send a new AJAX request every time search input is changed. I'm using https://www.mediawiki.org/wiki/API:Search_and_discovery as a guideline.
var search = $('#search');
search.keyup(function() {
if (search.val() === '') {
result.html('');
}
$.ajax({
url: '//en.wikipedia.org/w/api.php',
data: {
action: 'query',
list: 'search',
format: 'json',
srsearch: search.val()
},
dataType: 'jsonp',
success: function(response) {
console.log("success!");
}
});
});
However, success function is not even triggered.
On any keypress the error I get is this ("d" pressed):
jquery-2.1.1.min.js:4 GET file://en.wikipedia.org/w/api.php?>callback=jQuery21107844703783826772_1484403407494&action=query&list=search&srse>arch=d&format=json&_=1484403407495 net::ERR_FILE_NOT_FOUND
Thank you in advance for any help or guidance!
Well, you're probably trying to do a AJAX request without a local server (opening your file directly in the browser).
First of all, your url options starts with //en... (without the protocol). It indicates that it'll construct your full url using the same protocol you're using. In this case: file://. That's because your browser is trying to reach file://en.wikipedia.org/....
So, you can set your url to https://en.wikipedia.org/w/api.php to make it work.
Just replace:
url: '//en.wikipedia.org/w/api.php',
with:
url: 'https://en.wikipedia.org/w/api.php',
Looks like you're running it from a simple html file located in your filesystem, in other words not running it from a web server (even local).
Try calling the api with
url: 'https://en.wikipedia.org/w/api.php'
or run the file from a web server (can be a local one).

JavaScript URL issue with Permalinks enabled

I am using the following JavaScript function to fetch the data using ajax call
function findName() {
var name = "Jhon";
$.ajax({
method: "POST",
url: "oc-content/themes/bender/ajax-test.php",
data: { name : name },
success: function (data) {
alert(data);
},
})
}
It calls the following php file and works fine.
http://127.0.0.1/osclass/oc-content/themes/bender/ajax-test.php
But when I enable SEO friendly Permalinks in my CMS current page URL is appended in start of link and I get the following error in Chrome Console.
GET http://127.0.0.1/osclass/fashion-beauty/oc-content/themes/bender/ajax-test.php?name=Jhon 404 (Not Found)
Anybody tell me how to solve this issue?
The url you've provided in the ajax call is document relative. When you changed the server's url generation scheme, you also caused the url pointed at by the ajax call to change.
Adjust the ajax url, changing:
url: "oc-content/themes/bender/ajax-test.php",
To:
url: "/osclass/oc-content/themes/bender/ajax-test.php",
Why don't you make the URL server-relative? Something like this:
function findName() {
var name = "Jhon";
$.ajax({
method: "POST",
url: "/osclass/oc-content/themes/bender/ajax-test.php",
data: { name : name },
success: function (data) {
alert(data);
},
})
}
As you have not posted the php code. I would mention that any url directly navigated through addressbar of browser causes in the GET request and i can see you have a POST request in the ajax, so, it can't work.
Workaround would be to use $_REQUEST super globals at php end. $_REQUEST would work for $_GET/$_POST requests.

POSTing JSON data to Server URL

I am facing problem when I am posting a JSON data to the server using Ajax call in jQuery the function does not enter success mode. When I post using the POSTER Plugin of Firefox it gets posted successfully. Sharing the code snippet and screenshot of the same:
function showSubscribeContent()
{
alert("*1*------- SUB CLICKED");
var myJSONData = '{"data":{"mode" : "subscribe","technologyareas":[1],"assettypes":["podcast","documents"]}}';
alert("*2*------- POSTING--------->"+myJSONData);
$('#subscribePage').html('<h1>POSTING...</h1>');
$.ajax({
type: 'POST',
url: 'https://tt.s2.acc.com/tt/subscribe-service/uid=sagar_mate',
data: myJSONData,
dataType: 'application/xml',
success: function(data) {
alert("*3*------- POSTED SUCCESSFULLY TO THE SERVER");
$('#subscribePage').html('<h1>POSTED</h1>');
} // Success Function
}); // Ajax Call
}
I am getting alert number 1 and 2 but not 3.
Also when I post using POSTER plugin of Firefox, it gets posted easily.
The Response is success.
I am unable to post the same data using AJAX call.
Thanks,
Ankit
Unless and until the URL in your AJAX call is of the same Domain, I don't think it will get posted successfully. POSTER plugin of Firefox doesn't put any such restriction on the domain, but browser will put this restriction on the application.
Try checking in the error: function(){alert(4);}
to see if it reaches the error handler atleast
Please clearify what you want, when using POSTER Plugin of Firefox you have specified datatype as json where as when using ajax you are using xml.
If you what to post data as JSON use JSON.stringify which accepts JSON object and convert it to string.
Try with this code
function showSubscribeContent()
{
alert("*1*------- SUB CLICKED");
var myJSONData = {"data":{"mode" : "subscribe","technologyareas":[1],"assettypes":["podcast","documents"]}};
alert("*2*------- POSTING--------->"+myJSONData);
$('#subscribePage').html('<h1>POSTING...</h1>');
$.ajax({
type: 'POST',
url: 'https://tt.s2.acc.com/tt/subscribe-service/uid=sagar_mate',
data: myJSONData,
dataType: 'application/json',
success: function(data) {
alert("*3*------- POSTED SUCCESSFULLY TO THE SERVER");
$('#subscribePage').html('<h1>POSTED</h1>');
} // Success Function
}); // Ajax Call
}
Here I have changed the following lines
Converted myJSONData to a JSON object from string
var myJSONData = {"data":{"mode" : "subscribe","technologyareas":[1],"assettypes":["podcast","documents"]}};
Note: try with the string(the way you were doing) if this is not working for you
Changed datatyle to JSON
dataType: 'application/json',
Adding a header in beforeSend Function worked fine for me. Security reasons of CORS.

Hidden HTTP Post in Javascript

I'm trying to do an HTTP Post using Javascript.
I'm using the code reported here:
JavaScript post request like a form submit
and it works fine.
But I need to remain in the same page while the HTTP Post is sent.
How can I do?
Thx
AJAX?
do it inside of an iframe.
do it as an AJAX post
I know it seems to be the perpetual hammer (Because it is) but try using jQuery. then you can do a real simple jQuery post
http://api.jquery.com/jQuery.post/
$.ajax({
type: 'POST',
url: url,
data: data,
success: success
dataType: dataType
});
or
the shortest method if you don't need a return..
$.post("postTo.php", { name: $('#name').val(), data: $('#data').val(); } );
AJAX
$('.button').click(function() {
$.ajax({
type: "POST",
url: "whateveryourphpfileis.php",
data: { whatyouare: "sending" }
})
});
How to Call a PHP Function on the Click of a Button

Categories

Resources