I have the following definition:
params.require(:sets).permit(:name, zones_attributes: [:latitude, :longitude])
And i would like to send them by ajax with jQuery, thing is I think i'm constructing it wrong because I keep getting this error:
Unpermitted parameters: 0, 1
This is what I'm sending:
{
"sets"=>{
"name"=>"America",
"zones_attributes"=>{
"0"=>[
"49.95121990866204",
"-117.861328125"
],
"1"=>[
"-33.578014746143985",
"-55.986328125"
]
}
},
"action"=>"create",
"controller"=>"sets"
}
I think the problem is the "key" value being added before the latitude/longitude value.
This is how I'm adding those values:
this.zones.push([marker.position.lat(), marker.position.lng()]);
Is there a way to add them without the keys? Or am I going through the wrong way?
UPDATE
ajax code:
$.ajax({
type: "POST",
url: '/zone_sets',
data: { zone_sets: { name: map.markerListName ,zones_attributes: map.zones } },
success: function (data) { $("input[name=zone_set]").append(data) },
});
Change your current ajax code to:
$.ajax({
type: "POST",
dataType: 'json',
headers: {
'Content-Type': 'application/json'
},
url: '/zone_sets',
data: JSON.stringify({ zone_sets: { name: map.markerListName ,zones_attributes: map.zones } }),
success: function (data) { $("input[name=zone_set]").append(data) },
});
As you can see the actual problem is how the Rails handle and parse a request.
You should be adding them like this:
this.zones.push({'latitude': marker.position.lat(), 'longitude': marker.position.lng()});
Yes, the "key" looks like it's the problem.
params.require(:sets).permit(:name, zones_attributes: [:latitude, :longitude]) is expecting your request to be in the format:
{
"sets"=>{
"name"=>"America",
"zones_attributes"=>[
{
"latitude": "49.95121990866204",
"longitude": "-117.861328125"
},
{
"latitude": "-33.578014746143985",
"longitude": "-55.986328125"
}
]
},
"action"=>"create",
"controller"=>"sets"
}
i.e. the "0" and "1" the error is referring to are like array indices.
Related
I have the following input name: dynamic[elements][1][slider][image1]
When performing an ajax call, a json response with settings and its value is returned.
$.ajax({
url: '/get/settings',
type: 'POST',
data: formData,
async: false,
success: function (data) {
});
How can i get the value of dynamic[elements][1][slider][image1] the easiest way? It works to get the value like this:
data.dynamic.elements[1].slider.image1
So:
$.ajax({
url: '/get/settings',
type: 'POST',
data: formData,
async: false,
success: function (data) {
console.log(data.dynamic.elements[1].slider.image1);
});
But isn't their any better way of getting the value? The only identifier I have to get the value, is the name of the input field which is dynamic[elements][1][slider][image1]. So i would need to extract this string and put it together as data.dynamic.elements[1].slider.image1 to then make it a dynamic variable somehow (to finally get the value)?
Example ajax response:
{
"success": 1,
"dynamic": {
"elements": [
{
"title": {
"title": "Our beautiful topic"
}
},
{
"slider": {
"image1": "5zw3ucypzp3qham.png",
"image1_link": "hellor"
}
}
]
}
}
You may choose to write a generic function for the purpose of retrieving data from object. The function should look something like below. Though the function may not be foolproof but should be enough for proof-of-concept.
function getObjectData(target, path) {
// if the path is not in dot notation first convert
if (path.indexOf(".") == -1)
path = path.replace(/\[/g, ".").replace(/\]/g, "");
var parts = path.split(".");
return parts.reduce(function (acc, currentVal) {
return acc ? (acc[currentVal] || undefined) : acc;
}, target);
}
//usage
getObjectData(data, "dynamic.elements.0.slider.image1"); //undefined
getObjectData(data, "dynamic.elements.1.slider.image1"); //5zw3ucypzp3qham.png
getObjectData(data, "dynamic[elements][1][slider][image1]"); //5zw3ucypzp3qham.png
Hope this helps.
I have following hangout button js code, I expect callback when user clicks on hangout button. Its not working, is anything wrong ?
gapi.hangout.render('hangout-button', {
'render': 'createhangout',
'topic': 'hangout_test',
'invites': "[{'id': 'xxx#gmail.com', 'invite_type': 'EMAIL'}]",
'initial_apps': [{
'app_id': "google_app_id",
'app_type': 'ROOM_APP',
'start_data': {
"user_id": "user_id",
"user_email": "user_email",
"token": "token",
"callback_url": "abc.com/hooks/hangout",
"host": "abc.com",
"callback_data": "user_data"
}
}],
'hangout_type': "normal",
'widget_size': 130
});
You need to listen for the onApiReady event from Hanogut and then call getHangoutUrl on gapi.hangout. As explained in their documention here:
https://developers.google.com/+/hangouts/api/gapi.hangout.html#gapi.hangout.ApiReadyEvent
Adding the same code below:
gapi.hangout.onApiReady.add(function(eventObj) {
var hangoutUrl = gapi.hangout.getHangoutUrl();
// After saving the url to a variable, pass it using an Ajax call
$.ajax({
type: "POST",
url: callbackUrl,
success: successFunc,
dataType: 'json',
data: JSON.stringify({
"hangoutUrl": hangoutUrl,
})
});
});
Reference: https://stackoverflow.com/a/30609147/2545197
I have this application where I'm going to update a database using jQuery and the HTTP PUT method.
There's some code before this, and some more after it. I'm having issues with the part where it has id: {...
The id variable is equal to: 9j6bddjg7fd6ee0df09j0989
I need it to end up looking something like this: "9j6bddjg7fd6ee0df09j0989"
The rest (path, http, etc.) work because they don't have quotes around them.
Is there a way that I can have the id surrounded by quotes right before it is sent off to /api/routes?
password = $('#password-' + i).val();
id = $('#id-' + i).html();
jQuery.ajax({
url: "/api/routes",
type: "PUT",
data: {
"routes": [
{
id : {
"path" : path,
"httpMethod": http,
"ensureAuthenticated": password,
"route": route
}
}
If you want the "id" key to be dynamic ( to have the value of your id variable ) you need to use a different notation:
var id = "9j6bddjg7fd6ee0df09j0989",
newRoute = {},
jsonData = {
"routes": []
};
newRoute[id] = {
"path" : "path",
"httpMethod": "http",
"ensureAuthenticated": "passwd",
"route": "route"
}
jsonData.routes.push(newRoute);
$.ajax({
type: 'POST',
dataType: 'json',
url: '/echo/json/',
data : { json: JSON.stringify( jsonData ) },
success: function(data) {
console.log("data > ", data);
}
});
Check this fiddle for a working copy and check your js console for the output.
I've encounted a strange problem with Ko mapping.
I use this piece of code:
var PList = [{ "Region": { "RegionName": "SomeRegion" }, "CDetails": {}, "Category": { "Name": "SomeCategory" }, "PSource": 1, "PDate": "0001-01-01T00:00:00"}];
var PViewModel = ko.mapping.fromJS(search('someSearch', 'True'));
var PViewModel2 = ko.mapping.fromJS(PostList);
function search(queryString, isFirst) {
$.ajax({
type: 'POST',
url: 'url',
data: { 'searchQuery': queryString },
dataType: 'json',
success: function (dt) {
if (isFirst != 'True') {
ko.mapping.fromJS(dt, PostsViewModel);
}
return dt;
}
});
};
Strangely I see 2 outcomes:
When I go to PViewModel (the one populated by ajax) I see it as undefined
When I go to PViewModel2 (the one with static data) I can see the objects as expected
*The static data of PViewModel2 is just a copy of the data returned by the ajax post.
My questions are:
Does anyone know why is this so? And how to fix it?
Furthermore, is the if (isFirst != 'True') clause the right way to init the ko view model?
You are dealing with an asynchronous operation (an Ajax request). These operations do not have return values. Therefore, this can never work:
ko.mapping.fromJS(search('someSearch', 'True'));
That's what the success callback is for. Incoming data can only be handled there.
function search(queryString, targetObservable) {
$.ajax({
type: 'POST',
url: 'url',
data: { 'searchQuery': queryString },
dataType: 'json',
success: function (dt) {
ko.mapping.fromJS(dt, targetObservable);
}
});
};
search('someSearch', PostsViewModel);
I'am doing a jquery call to API website, which returns me the results in JSON format:
{
"results":[
{
"user":{
"gender":"female",
"name":{
"title":"mrs",
"first":"linda",
"last":"diaz"
},
"location":{
"street":"2333 oak lawn ave",
"city":"red bluff",
"state":"maryland",
"zip":"49309"
},
"email":"linda.diaz55#example.com",
"password":"blackman",
"md5_hash":"3c64b82d048c8754a30e292a1359fa39",
"sha1_hash":"d5095cf146dda75865d348f4ce4820b11b58b9fd",
"phone":"(880)-878-1658",
"cell":"(183)-179-1598",
"SSN":"425-55-1070",
"picture":"http:\/\/api.randomuser.me\/0.2\/portraits\/women\/8.jpg"
},
"seed":"2d589586d34c1c5",
"version":"0.2.1"
}
]
}
How can I access (or get values of) the items, for example: I want to console.log() the first name and the last name, get a phone number ?
Using a .(dot) not working for me, maybe i'am doing something wrong ?
Here is a javascript code
$.ajax({
type: 'POST',
url: url + resultsQuery,
dataType: 'json',
success: function(data){
console.log(data);
}
});
data.results[0].user.name.first
data.results[0].user.name.last
data.results[0].user.phone
For your JSON Structure, try
data.results[0].user.name.first
data.results[0].user.name.last //etc