My API PUT will not work - javascript

I cannot get ajax to do a 'PUT' operation.
$('.thetest').click(function() {
console.log("Script executed");
$.ajax({
url: 'redacted for obvious reasons',
contentType: 'application/json',
success: function(result) {
alert("success?");
},
type: 'PUT',
data: {
"userId": "also redacted",
"data": {
"userSettings": {
"notificationSettings": {
"Marketing": false,
"Newsletters": true
}
}
}
},
});
});
<button class="thetest"> PRESS ME</button>
Once the button is pressed, the console.log does trigger. So I know the script is being used, it just doesn't send to the API.
Any ideas?

change type to method
$('.thetest').click(function () {
console.log("Script executed");
$.ajax({
url: 'redacted for obvious reasons',
contentType: 'application/json',
success: function (result) {
alert("success?");
},
method: 'PUT',
data: {
"userId": "also redacted",
"data": {
"userSettings": {
"notificationSettings": {
"Marketing": false,
"Newsletters": true
}
}
}
},
});
});

Related

Retrieving data from db.json file and adding it into an array using javascript

I'm using ajax and javascript for a game and I created a server using json-server where I keep a db.json file with words that the user can input and become available in the game.
db.json
This is what the json file looks like
{
"words": [
{
"cuvant": "cuvant",
"id": 1
},
{
"cuvant": "masina",
"id": 2
},
{
"cuvant": "oaie",
"id": 3
},
{
"cuvant": "carte",
"id": 4
},
{
"cuvant": "fmi",
"id": 5
},
{
"cuvant": "birou",
"id": 6
},
{
"cuvant": "birou",
"id": 7
},
{
"cuvant": "canapea",
"id": 8
},
{
"cuvant": "pasare",
"id": 9
I managed to get the POST request (adding the words to the db.json) using this:
function addWord() {
var word = document.getElementById("input-name").value;
var info = {
cuvant: word
}
$.ajax({
url:'http://localhost:3000/words',
type: 'POST',
dataType: 'json',
contentType: 'application/json',
data: JSON.stringify(info),
succes: function(info) {
console.log(info)
},
error: function(error) {
console.log(error);
}
})
}
This is what I tried for the GET request
But I'm not sure if it's correct.
And I also need a way to get only the value hold by the cuvant key and add it into an array.
window.onload = function() {
function gett() {
$.ajax({
url: 'http://localhost:3000/words',
type: 'GET',
dataType: 'json',
contentType: "application/json",
succes: function(data) {
console.log(data);
},
error: function(data) {
console.log(data)
}
})
.done(function(){
console.log("Over")
})
}
}
I think your code is correct. It was just missing the "s" on "success":
window.onload = function() {
function gett() {
$.ajax({
url: 'http://localhost:3000/words',
type: 'GET',
dataType: 'json',
success: function(data) {
console.log(data);
},
error: function(data) {
console.log(data)
}
})
.done(function(){
console.log("Over")
})
}
}

How to post data from jquery datatable

I need to bind jquery dataTable using handler and I am sending parameters to that handler which is through object log given below.On button click I am calling the a function in which I have written the below code. On clicking on the button I need to have the datatable.But the problem is that I am unable to bind the jquery datatable. Please help.
Is there anyway to pass log as parameter to jquery datatable call and capture that in handler?
var log = { LogType: logType, InstanceID: instanceId, StartDateTime: StartDateTime, EndDateTime: EndDateTime, UserId: UserId, SearchKey: SearchValue, ProjectID: projectId, ClassID: ClassId, MethodID: MethodId, UserName: UserName, FilePath: FilePath };
$.ajax({
url: "LogManager.ashx",
dataType: "json",
responseType: "json",
data: { searchlog: JSON.stringify(log) },
success: function (data) {
$('#tblLogTable').DataTable({
"data": data,
"columns": [
{ 'data': "stProjectName" },
{ 'data': "stMethodName" },
{ 'data': "stUserName" },
{ 'data': "stFilePath" },
{ 'data': "stClassName" },
{ 'data': "inUserId" },
{ 'data': "dtCreationTime" },
{ 'data': "stLog" },
{ 'data': "stInstance" },
],
"language": {
"emptyTable": "There are no records at present.",
"zeroRecords": "There were no matching records found."
},
processing: true,
serverSide: false,
ordering: true,
paging: true,
searching: true
});
},
error: function (data) {
alert(data);
}
});
It should be the other way around e.g.:
<script type="text/javascript" src="/assets/js/datatables.min.js"></script>
<script type="text/javascript" >
$(document).ready(function () {
$('#mytable').DataTable({
processing: true,
serverSide: true,
ajax: {
type: "POST",
contentType: "application/json; charset=utf-8",
url: "/DataTables.aspx/Data",
data: function (d) {
return JSON.stringify({ parameters: d });
}
}
});
});
</script>

Toggle between ajax data objects

I'd like to toggle between 2 ajax data objects on click of a link. Its not possible to do this with the method below, can anyone suggest a way I can do this? Thanks!
jQuery.ajax({
url: "/somefile.php",
dataType: 'JSON',
type: 'POST',
jQuery(".togglesearch").toggle(
function () {
data: JSON.stringify({
"Name": jQuery("#searchfield").val(),
"Number": ""
}),
},
function () {
data: JSON.stringify({
"Name": "",
"Number": jQuery("#searchfield").val()
}),
}
);
var data = ["Name", "Number"];
var obj = {"Name":"", "Number":""};
var val = jQuery("#searchfield").val();
var n = 0;
var res;
$("button").click(function() {
obj[data[n]] = val;
obj[data[n === 0 ? n + 1 : n- 1]] = "";
res = JSON.stringify(obj);
$("label").text(JSON.stringify(res));
// do ajax stuff
/*
jQuery.ajax({
url: "/somefile.php",
dataType: "JSON",
type: "POST",
data: res
})
*/
n = n === 0 ? 1 : 0
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
</script>
<button>click</button>
<input type="text" id="searchfield" value="123" /><label></label>
I think you'll have to put each different ajax call inside the toggles:
jQuery(".togglesearch").toggle(
function () {
jQuery.ajax({
url: "/somefile.php",
dataType: 'JSON',
type: 'POST',
data: JSON.stringify({
"Name": jQuery("#searchfield").val(),
"Number": ""
})
});
},
function () {
jQuery.ajax({
url: "/somefile.php",
dataType: 'JSON',
type: 'POST',
data: JSON.stringify({
"Name": "",
"Number": jQuery("#searchfield").val()
})
});
}
});
Try this:
jQuery(".togglesearch").toggle(function() {
var data = { "Name": "", "Number": jQuery("#searchfield").val() };
callAjax(data);
}, function(){
var data = { "Name": jQuery("#searchfield").val(), "Number": "" };
callAjax(data);
});
function callAjax(data) {
jQuery.ajax({
url: "/somefile.php",
dataType: 'JSON',
type: 'POST',
data: JSON.stringify(data),
success: function(response) { }
)};
}
In toggle finally call a function with ajax call. Let me know if it works for you.

What's wrong with my data, received through JQuery AJAX request?

I'm making an API call with this code:
$.ajax({
type: "GET",
url: "https://example/example.json",
beforeSend: function(xhr) {
xhr.setRequestHeader("apikey", "user")
},
success: function(data){
alert(data.folder.item);
}
})
That returns nothing, except for an error in the console saying:
"Uncaught TypeError: Cannot read property 'item' of undefined"
The JSON data looks like this when I use the url in the browser:
{
"folder": {
"item": 123123,
"item 2": false,
"item 3": "content",
"item 4": [
{
"subitem": "content"
},
{
"subitem": "content2"
}
]
}
}
I was expecting "123123" in the alertbox, but nope. So what am I doing wrong?
If its a JSON string you are getting it will need to be parsed. Try this:
$.ajax({
type: "GET",
url: "https://example/example.json",
beforeSend: function(xhr) {
xhr.setRequestHeader("apikey", "user")
},
success: function(data){
var parsed = JSON.parse(data);
alert(parsed.folder.item);
}
});
Or to force jquery to parse it for you:
$.ajax({
type: "GET",
url: "https://example/example.json",
dataType: 'json',
beforeSend: function(xhr) {
xhr.setRequestHeader("apikey", "user")
},
success: function(data){
alert(data.folder.item);
}
});

Unsupported Media type error

Hi everyone i am working on phone gap project and using the ajax web services. I am sending request using the following code:
var credentials = {
"name": "nouman",
"email": "noumandilawar#gmail.com",
"mobile_number": 03324412764,
"employee_number": 4556,
"gender": 1,
"password": "1234567891234567",
"language": 1
};
function GetMember() {
$.ajax({
type: 'POST',
url: 'http://192.168.1.103:8080/mazaya_cms/signup.htm',
//data: "{'name': 'nouman','email': 'noumandilawar#gmail.com','mobile_number': 03324412764,'employee_number': 4556, 'gender': 1,'password': '1234567891234567','language': 1}",
data: JSON.stringify(credentials),
//data: '{"id": "nouman","name":"nouman"}',
contentType: "application/json; charset=utf-8",
dataType: 'json',
crossDomain: true,
success: OnGetMemberSuccess,
error: OnGetMemberError
});
}
GetMember();
function OnGetMemberSuccess(data, status) {
alert(data+ " "+status);
}
function OnGetMemberError(request, status, error) {
alert(request+" "+error+ " "+status);
}
I am getting error code:415 that is unsupported media type Please help me!
I have successfully solved this issue
var credentials = {
"name": "nn",
"email": "nn%40gmail.com",
"mobile_number": 03324412764,
"employee_number": 4556,
"gender": 1,
"password": "1234567891234567",
"language": 1
};
$.ajax({
url: "http://192.168.1.103:8080/mazaya_cms/signup.htm",
type: "post",
data: credentials,
dataType : "json",
success: function(request, status, error){
alert("success "+request.status);
},
error:function(jqXHR, textStatus, errorThrown) {
alert("failure"+errorThrown);
}
});

Categories