Find definition of the 'action' inside 'data' object in jquery - javascript

I'm a back-end dev that inherited code that looks like this
xhr = jQuery.ajax({
type: 'POST',
url: ajax_url, // ERROR!!
dataType: "json",
data: {
action: 'properties', <---------------------------------
data: url_vars,
url: document.URL
},
I know that the action called properties has to be defined somewhere, but I'm not sure how to find it.
I read multiple threads on SO, but this is not a form action, so I'm not sure how one would go about finding it. If an experienced front-end dev saw this name, what would they look for specifically inside the code?
Apologies for the newbie question, but this is a bit confusing.
Closest answer I found is the data.action is an attribute action of the object data is a value that you known cos we haven't any reference, unfortunately I'm not even sure where to look for any reference apart from analyzing 1000+ times the word 'properties' is mentioned in the framework's code.
Any help is greatly appreciated.

Related

Insert Python's mpld3 images to HTML without saving them

I have a Python script, which does some computations and makes a figure. Then, I am using mpld3 to generate an HTML version of this figure and save it (e.g., figure.html). The Python computations are launched via the AJAX request to the HTTP server. In my JS file, I use the jQuery.load() method to insert the plot into HTML:
$("#includedContent").load('/figure.html');
In this way, everything seems to work fine. The question is can I do the same thing without saving the figures? I tried to return a figure as a response, here is my modified AJAX request:
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
dataType: "json",
url: "/main.py",
data: JSON.stringify({ 'sim_dur': input }),
success: function (response) {
figure = response.figure;
var child = document.createElement('div');
child.innerHTML = figure;
child = child.firstChild;
document.getElementById('includedContent').appendChild(child);
}
});
If I assign an HTML-like string to child.innerHTML, the code works correctly. But when I try to assign it a figure (which has a string type as well), it is not showing on the HTML page. I'm new to JS, so I apologize if it is something basic. I did some research and it seems that people usually save the results in other answers, so maybe it is a common way to do it and what I am trying to do is not right.
In my experience, mlpd3 will only work when the client (browser) is loading the page. Once the page is loaded, updating or creating an mpld3 figure using an ajax call won't create the figure for you. I personally struggled with that for some time and then gave up. I am sure one can patch things up but then you'll be stuck to your own mpld3 patched version

js-routes adding (::format) to urls

I have a simple rails project that I've been playing around in with reactjs. To add some basic navigation, I brought the js-routes library in and it works great for urls that have a path parameter such as "localhost:3000/addresses/1".
The problem I am facing is I am trying to call a "new" resource method and it adds the (::format) literally to the url which of course bombs as localhost:3000/addresses/new(.:format) is an invalid path.
I reference the "new_address_path" path as specified in the routes-js docs. The rake output for this url is below:
new_address_path GET /addresses/new(.:format) addresses#new
The HTML snippet utilizing the above path looks like this:
<a href={Routes.new_address_path}>Create am address</a>
ENV:
-Ruby: 2.2.4
-Rails: 4.2.6
-js-routes: 1.2.8
Route in question:
resources :addresses
What am I missing here? It seems like it is not interpreting the rails route file properly.
I am not sure if I got your question. If you want to generate url with format suffix you can use format option in the helper method. For example:
Routes.new_address_path(format: 'js')
will generate something like this:
/addresses/new.js
Sorry I thought I posted my solution in here.
The problem wasn't js-routes but rather my AJAX call, I was setting the content type to JSON and I assumed that it was converting my object to JSON using the built in methods. This is not true, you need to manually convert the object to JSON via JSON.stringify(obj).
Old ajax call:
....
url: Routes.feedback_path(),
dataType: 'json',
contentType: 'application/json',
type: 'POST',
data: obj,
....
New ajax call:
....
url: Routes.feedback_path(),
dataType: 'json',
contentType: 'application/json',
type: 'POST',
data: JSON.stringify(obj),
....
You might have found a solution, but your original problem is one with js-routes, or rather your use of it.
You have to provide the parens to get the correct output from js-routes.
Original: Routes.new_address_path
Fixed: Routes.new_address_path()
As smefju posted, you can specify the format in the parens, but completely leaving them off is not an option.

Updating a Rails Model From JS Event

I have been looking around and cannot seem to find out if it is common practice to update a Rails model attribute from a JS callback.
In one of my views I have a datepicker that sends a callback once the value has been changed. I would like to save this date to the current model "date" attribute.
$('#datetimepicker4').on('dp.change', function (e) {
// SAVE THIS VALUE TO SPECIFIED MODEL ATTRIBUTE HERE
});
Any suggestions would be very much appreciated. Thanks!
Edit: This is common practice, Ended up getting it working with the following ajax put request.
$.ajax({
type: "PUT",
dataType: "script",
url: '/thread/27',
contentType: 'application/json',
data: JSON.stringify({ thread:{id:27, title:"blaaahhh title"}, _method:'put' })
}).done(function( msg )
{
alert( "Data Saved: " + msg );
});
});
I'm not sure if you've done much research beforehand, because this is a very common thing to do.
Your terminology is also wrong. You're not changing anything in the model. You're simply POSTing a value to your database. Do some research on AJAX and then ask a more detailed, but concise question.
There's nothing wrong with being a beginner, but please do research beforehand, and then create a Stack Overflow question only if that research has led to dead ends. Then create a question featuring what you already know and where you're stuck.

Post a variable to json format in Ember.js

I apologize if this question seems basic as I am new to both stackoverflow and javascript in general.
My goal here is to store the user's dropdown menu selection as well as some other user inputs into variables, then I want to post the json file that contains the variables into a specific route where my serve-side javascript can read from. I have the variable part and user selection part covered, however, I am having trouble posting the variables to the specified route.
So in my app.js file in my ember framework, I tried the below code to test out if I can post {12345} to address:port/api/iwantmyjsonhere/ but when I run it and go to that specific page (address:port/api/iwantmyjsonhere/), it says cannot GET.
$(document).ready(function() {
$.ajax({ url : "/api/iwantmyjsonhere/",
type: 'POST',
dataType : "json",
data: "12345"
});
});
I understand that this question is lower level, so if you guys are too busy to answer, point me to any resources that might help me would be greatly appreciated too! Thanks in advance!
I guess this is not related to ember anywhere.
You are just using jQuery for ajax call and as per jQuery standards "Data" Object must be Key/Value pairs.
Means you should do something like -
$(document).ready(function() {
$.ajax({ url : "/api/iwantmyjsonhere/",
type: 'POST',
dataType : "json",
data: {id:"12345"}
});
});
You can read more on this one at -
http://api.jquery.com/jquery.ajax/
And if you want to implement it in ember way the you can use something like -
return Ember.$.ajax({
url: '/api',
method: 'POST',
dataType: 'json',
data: {//key value pairs}
}).then(function(result){
//After ajax is successful.
}

IIS6 javascript routing issues

I currently have the following within my view
function loadData() {
var url = "/Testx.mvc/GetData";
var id = "111111";
var format = "html";
$.ajax({
url: url,
type: "POST",
dataType: format,
data: "id=" + id,
success: populateResults
});
}
function populateResults(result) {
$('#results').html(result);
}
I also have a controller called TestxController with an action method called GetData(int? id).
Now the ajax call above works on Visual Studios 2008's built-in development server, but when i switch it to use IIS webserver it doesn't. It seems like the route isn't being found because I tried putting a break point on GetData but it doesn't even reach there.
Does anyone know what i would need to do to fix this?
Edit: I've also tried the wildcard mapping method discussed at http://haacked.com/archive/2008/11/26/asp.net-mvc-on-iis-6-walkthrough.aspx and it worked perfectly. (Of course I had to remov the .mvc from the url)
Is there any way to get this to work with the .mvc extension?
Thanks
Is Testx.mvc at the root of your webserver? If your application is running in a virtual directory on IIS then the correct path would be something like /YourApp/Testx.mvc/GetData.
The Visual Studio built-in webserver might be placing Testx.mvc at root, which is why it works within VS.
If that is the case, then try using the relative path Testx.mvc/GetData rather than /Testx.mvc/GetData.
Is there an actual function called 'callback'? Just asking because it seems like you might mean to be calling 'populateResults' with a successful response.
Try this perhaps:
$.ajax({
url: url,
type: "POST",
dataType: format,
data: "id=" + id,
success: function(results){$('#results').html(result)}
});
Did you check your ISS setup to see if it supports the POST action? It might only be specifying the GET action... see http://haacked.com/images/haacked_com/WindowsLiveWriter/07de283cb368_B754/application-mappings_3.png

Categories