I am sending an array of arrays a post request through $ajax
ie:
[[1, "25, 25, 25", "pounds", "exercise note 1"],[2, "", "No Weight", "note 2"]]
My ajax:
$.ajax({
type: 'POST',
url: '',
dataType: 'json',
data:{
csrfmiddlewaretoken: csrftoken,
targets:JSON.stringify(targets),
// notes:notes,
// time:time,
// rating:rating
},
success: (res)=>{
console.log(res)
},
error: (error)=>{
console.log(error)
}
})
In django, when I print(request.POST), I get
'targets[0][]':[1, "25, 25, 25", "pounds", "exercise note 1"], 'target[1][0]':[2, "", "No Weight", "note 2"].
I have tried
JSON.stringify([[1, "25, 25, 25", "pounds", "exercise note 1"],[2, "", "No Weight", "note 2"]])
and I get back
'targets': ['[[2,"25, 25, 25","Pounds","note 1"],[1,"","NoWeights","note 2"]]'],
I've also tried:
ts.push(t)
django returns:
'targets[]': ['[2,"25, 25, 25","Pounds","note 1"]', '[1,"","NoWeights","note 2"]
which is what I want. But when I do
targets = request.POST.getlist('targets[])
for target in targets:
print(target[2]) -->I want either "25, 25, 25" or , ""
But all I get is , and when I print(len(target)) the first array returns 34. Why? How do I get the strings? What am I doing wrong? I want to assigned each index in the target array to a varible so I can save to the database
If you send targets as JSON in your request(NOTE: only the targets part is JSON) then you have to decode it when you get it on the server side.
targets = [[1, "25, 25, 25", "pounds", "exercise note 1"],[2, "", "No Weight", "note 2"]];
$.ajax({
type: 'POST',
url: '',
dataType: 'json',
data:{
csrfmiddlewaretoken: csrftoken,
targets:JSON.stringify(targets),
// notes:notes,
// time:time,
// rating:rating
},
success: (res)=>{
console.log(res)
},
error: (error)=>{
console.log(error)
}
}
});
targets_json = request.POST.get('targets')
targets = json.loads(targets_json)
for target in targets:
print(target[2])
Related
So I have a snippet of code that will update a field value if the field has content, although if the field that I'm trying to update is null than the value won't update. Am I doing something wrong?
siteURL = _spPageContextInfo.webAbsoluteUrl;
var apiPath = _spPageContextInfo.webAbsoluteUrl +"/_api/lists/getbytitle('Training%20Copy')/items/getbyid(9)";
$.ajax({
url: apiPath,
type: "POST",
headers: {
Accept: "application/json;odata=verbose"
},
data: JSON.stringify
({
__metadata:
{
type: "SP.Data.Training_x0020_CopyItem"
},
Admin_x0020_Function: "Have content"
}),
headers: {
"Accept": "application/json;odata=verbose",
"Content-Type": "application/json;odata=verbose",
"X-RequestDigest": $("#__REQUESTDIGEST").val(),
"IF-MATCH": "*",
"X-HTTP-Method": "MERGE"
},
async: false, success: function(data) {
console.log("Item updated successfully");
}, eror: function(data) {
console.log("An error occurred. Please try again.");
}
})
There are two headers parameters in your ajax request, it is not clear whether it will affect.
My test code for your reference:
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.9.1.min.js" type="text/javascript"></script>
<script>
$(document).ready(function () {
Update()
function Update(){
$.ajax({
url: _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/GetByTitle('Doc')/items(9)",
type: "POST",
headers: {
"accept": "application/json;odata=verbose",
"X-RequestDigest": $("#__REQUESTDIGEST").val(),
"content-Type": "application/json;odata=verbose",
"IF-MATCH": "*",
"X-HTTP-Method": "MERGE"
},
data: JSON.stringify({__metadata:{'type':'SP.Data.DocItem'},test:'test'}),
/*where Title is column name and add your desired new data*/
success: function(data) {
console.log(data);
},
error: function(error) {
alert(JSON.stringify(error));
}
});
}
})
</script>
I am using typeahead library, it's fetching the data successfully. But not loading the data into the suggestions list, instead its showing the unable to find any company that match current query every time.
Here is my code:
$('#js-typeahead').typeahead({
highlight: true,
minLength: 1
}, {
displayKey: ['title'],
source: function(keywords, result) {
ajaxRequest({
url: '{{ route("admin.companies.auto-complete") }}',
dateType: 'json',
data: {
keywords: keywords,
_token: '{{ csrf_token() }}'
},
success: function(response) {
result($.map(response, function(data) {
return {
'title': data.title,
'token': data.token,
};
}));
}
});
},
templates: {
empty: [
'<div class="empty-message">',
'unable to find any company that match current query',
'</div>'
].join('\n'),
suggestion: function(data) {
return '' + data.title + '';
}
}
});
Here is the fetched data
Please tell me what am I doing wrong here.
[SOLVED]: Here is my final code...
$('.js-typeahead').typeahead({
hint: false,
highlight: true,
minLength: 1
}, {
displayKey: 'title',
source: (new Bloodhound({
datumTokenizer: Bloodhound.tokenizers.obj.whitespace('title'),
queryTokenizer: Bloodhound.tokenizers.whitespace,
remote: {
url: '{{ route("admin.{$parent['route']}.auto-complete") }}',
prepare: function (keywords, settings) {
return $.extend({}, settings, {
type: "POST",
contentType: "application/json; charset=UTF-8",
data: JSON.stringify({
keywords: keywords,
_token: '{{ csrf_token() }}'
})
});
}
}
})),
templates: {
empty: '<div class="empty">No result found</div>',
suggestion: function (data) {
return '<div>' + data.title + '</div>';
}
},
}).on('typeahead:asyncrequest', function(event) {
$('.js-typeahead').before('<i class="fas fa-spinner fa-spin loading"></i>');
}).on('typeahead:asyncreceive', function(event) {
$('.js-typeahead').prev('.loading').remove();
}).on('typeahead:selected', function(event, selection) {
// window.location.href = selection.token;
});
I hope this may come in handy for someone...
You're code is practically correct. And the best thing is that you can also get the result without using bloodhound.
from the initial code you state, you are calling it synchronously. thats why it does not yield any result.from typeahead docs. here is the highlight
Expected to be a function with the signature (query, syncResults, asyncResults). syncResults should be called with suggestions computed synchronously and asyncResults should be called with suggestions computed asynchronously (e.g. suggestions that come for an AJAX request)
so your initial code part
source: function(keywords, result) {
ajaxRequest({
url: '{{ route("admin.companies.auto-complete") }}',
dateType: 'json',
data: {
keywords: keywords,
_token: '{{ csrf_token() }}'
},
success: function(response) {
result($.map(response, function(data) {
return {
'title': data.title,
'token': data.token,
};
}));
}
});
},
are running synchronously, and because you are fetching data from ajax, you should make it asynchronously like this (i added asyncresult)
source: function(keywords, result, asyncresult) {
ajaxRequest({
url: '{{ route("admin.companies.auto-complete") }}',
dateType: 'json',
data: {
keywords: keywords,
_token: '{{ csrf_token() }}'
},
success: function(response) {
asyncresult($.map(response, function(data) {
return {
'title': data.title,
'token': data.token,
};
}));
}
});
},
hope it helps!
Been browsing through SO for the past hours to find a fix for my issue, but no progress yet, I'm getting
No 'Access-Control-Allow-Origin' header is present on the requested resource.
Now typically, this could be fixed with adding appropriate headers to the code, and it would work, however it's not the case for me, since I've tried to configure cors through API Gateway on AWS.
Screenshot:
Some research on google mentioned, that if the function is using lambda proxy integration, we would have to modify the lambda itself, and add the headers by our own, e.g
headers: {
'Access-Control-Allow-Origin': '*',
},
However this doesn't make much difference, is there anything I'm missing?
My actual code for the lambda (forgot to add):
const rp = require('request-promise')
const sendEmail = require('./sendEmail')
module.exports.run = async (event, context, callback) => {
const body = JSON.parse(event.body)
const { name, email, budget, message, attachment } = body
if (!name) {
return callback(null, {
statusCode: 400,
body: JSON.stringify({ message: 'Name is required' }),
})
}
if (!email) {
return callback(null, {
statusCode: 400,
body: JSON.stringify({ message: 'Email address is required' }),
})
}
if (!message) {
return callback(null, {
statusCode: 400,
body: JSON.stringify({ message: 'Message is required' }),
})
}
return Promise.all([
sendEmail({
to: 'Example <user#example.com>',
subject: 'New enquiry received!',
data:
`Name: ${name}\n` +
`Email: ${email}\n` +
`Budget: ${budget || 'n/a'}\n` +
`Attachment: ${attachment || 'n/a'}\n` +
`\n${message}`,
}),
sendEmail({
to: `${name} <${email}>`,
subject: 'Your message was delivered at ',
data:
'Thanks for reaching out!\n' +
'Somebody at our office will get back to you as soon as possible.\n' +
'\n' +
'While you wait, check out our Handbook (/) and get acquainted with how we do things around here.\n' +
'We have a lot of content there so feel free to explore as you please.\n' +
'\n' +
'Speak soon,\n' +
'\n',
}),
rp({
method: 'POST',
uri: `https://hooks.slack.com/services/${process.env.SLACK_PATH}`,
json: true,
body: {
text: `<!channel> New enquiry received`,
attachments: [
{
fallback: 'Information:',
pretext: 'Information:',
color: '#FF5050',
fields: [
{ title: 'Name', value: name, short: false },
{ title: 'Email', value: email, short: false },
{ title: 'Budget', value: budget || 'n/a', short: false },
{ title: 'Attachment', value: attachment || 'n/a', short: false },
{ title: 'Message', value: message || 'n/a', short: false },
],
},
],
},
}),
])
.then(() => {
return callback(null, {
statusCode: 200,
headers: {
'Access-Control-Allow-Origin': '*',
},
body: JSON.stringify({ message: 'Great success' }),
})
})
.catch(err => {
return callback(null, {
statusCode: 500,
body: JSON.stringify({
message: 'Oh no :( Message not delivered',
error: err
}),
})
})
}
No 'Access-Control-Allow-Origin' header is present on the requested resource.
This is saying that the resource you requested, your Lambda via API Gateway, is not returning an Access-Control-Allow-Origin header in its response; the browser is expecting the CORS headers in the response from the API (possibly because of an OPTIONS request), but the response doesn’t have them.
To solve your issue, add a Access-Control-Allow-Origin: * header to the response your Lambda returns. Using the first item you're returning:
if (!name) {
return callback(null, {
statusCode: 400,
headers: {
'Access-Control-Allow-Origin': '*',
// any other required headers
},
body: JSON.stringify({ message: 'Name is required' }),
})
}
Worth noting that you'll have to add those headers to every response.
I am using https://github.com/mauron85/cordova-plugin-background-geolocation. It gives location details in the foreground and gives debug messages when the app is closed but it does not update the location details into the server both foreground and background.
Thanks in advance
const config: BackgroundGeolocationConfig = {
desiredAccuracy: 10,
stationaryRadius: 10,
distanceFilter: 10,
debug: false,
stopOnTerminate: false,
startForeground: true,
notificationTitle: 'location tracking',
notificationText: 'Active',
interval: 60000,
url: localStorage.getItem('api_base_url')+'user/currentlocation',
syncUrl:localStorage.getItem('api_base_url')+'user/currentlocation',
httpHeaders: {
'Content-Type': 'application/json'
},
postTemplate: {
lat: '#latitude',
lon: '#longitude',
user_id: '1',
currentDate: '12-12-2019',
address: 'test',
}
};
this.backgroundGeolocation.configure(config)
.then(() => {
this.backgroundGeolocation.on(BackgroundGeolocationEvents.location).subscribe((location: BackgroundGeolocationResponse) => {
console.log(location);
});
});
this.backgroundGeolocation.start();
Background geo location post template
Keep in mind that all locations (even a single one) will be sent as an array of object(s), when postTemplate is jsonObject and array of array(s) for jsonArray!
In server-side, I changed the JSON object to an array of object.
For example,
{
"user_id": "1",
"lon": "13.2",
"lat": "82.3"
}
I changed the above JSON object to following
[{
"user_id": "1",
"lon": "13.2",
"lat": "82.3"
}]
I'm trying to figure out the best way to send post data to a Django View function.
What I have currently in my jquery code is something like this:
in the jquery:
function ajax_request(type) {
var a="{{parameter}}";
alert(type);
var frm = $('#form1');
form_data=frm.serialize();
alert(form_data);
$.ajax({
type : type,
data: form_data,
url : geturl(a),
dataType : 'json',
)}
i have written i single function called ajax_request. all i need is just access the data i have retrieved in the jquery in my views. how could i get it in my views.
function event_page_load() {
alert("hi");
ajax_request('GET')
}
function click_submit_button() {
ajax_request('POST')
}
function ajax_request(type) {
var a="{{parameter}}";
alert(type);
var frm = $('#form1');
form_data=frm.serialize();
alert(form_data);
$.ajax({
type : type,
data: form_data,
url : geturl(a),
dataType : 'json',
error : function(result) {
alert("error");
// alert("Error occured!!");
},
success : function(result,data)
{
alert("success");
// alert("data");
// $('#container').html(data);
var chart = new Highcharts.Chart({
chart: {
renderTo: 'container',
type: 'line',
marginRight: 220,
marginBottom: 75,
marginLeft:100,
marginTop:80
},
title: {
marginTop:90,
text: 'Power Consumption Vs Generator Consumption'
},
xAxis: {
categories: result[0]
},
yAxis: {
title: {
text: 'Units Of Time'
}
},
series: [{
name: 'Truepower Consumed',
data: result[1]},
{
name: 'Generator Consumed',
data:result[2]}],
});
}
})
}
You can use $.post
$.post({
geturl(a),
{ data: form_data, dataType : 'json' },
// response handler
});
Example :
$.post()
$("#post").click(function(){
$("#result").html(ajax_load);
$.post(
loadUrl,
{language: "php", version: 5},
function(responseText){
$("#result").html(responseText);
},
"html"
);
});
A helpful tutorial is available at http://net.tutsplus.com/tutorials/javascript-ajax/5-ways-to-make-ajax-calls-with-jquery/
Complete list of Django + AJAX examples are available at https://github.com/sivaa/django-jquery-ajax-exmaples