We Keep Coding

Call Perl script using D3 Xhr

I have a web application with an HTML form. When I press submit I want to submit the values from this form to a perl script, parseDatabaseData_v2.pl, which get's data from a database and creates a JSON string of that data.
Then, I'd like to visualize this JSON data using a D3 graph.
The following code using jquery ajax works, and returns JSON from the perl script as expected.
var runFromDate = $('#runDateSelectBox1').val();
var runToDate = $('#runDateSelectBox2').val();
var barcode = $('#barcodesSelectBox').val();
var dataString = 'runFromDate='+ runFromDate + '&runToDate=' + runToDate + '&barcode=' + barcode;
// ajax command
$.ajax({
type: 'POST',
url: './cgi-bin/parseDatabaseData_v2.pl',
async: true,
data: dataString,
dataType: "json",
success: function(data) {
console.log("succesfully called script");
}
}); // end of ajax command
In the perl script I use cgi->param('runFromDate'); to get the posted parameters.
However, since I'm visualizing the data using NVD3's lineWithFocusChart I want to call the script using d3.xhr.
When I create the following d3.xhr request the script doesn't work (it get's called, but is unable to get the parameters).
var runFromDate = document.getElementById("runDateSelectBox1").value;
var runToDate = document.getElementById("runDateSelectBox2").value;
var barcode = document.getElementById("barcodesSelectBox").value;
var dataString = 'runFromDate='+ runFromDate + '&runToDate=' + runToDate + '&barcode=' + barcode;
d3.xhr("./cgi-bin/parseDatabaseData_v2.pl")
.header("Content-Type", "application/x-www-form-url-encoded")
.post(dataString,function(error, data){
console.log("succesfully called script");
console.log(data);
});
I've tried various ways of formatting the datastring including formatting it as JSON as explained at the D3 API Reference.
I'd be most grateful if someone was willing to help me with this.
Thanks,
Koen

You have a spurious hyphen between url and encoded!
Change
.header("Content-Type", "application/x-www-form-url-encoded")
to
.header("Content-Type", "application/x-www-form-urlencoded")
Looks like you are not the only one as this other recent answer shows. Seems the offending code has been in the d3.js wiki so I have updated it too.

Using Dynamic Scripts to load JSON Data - Cross Domain - CORS not available

I have a ServiceNow instance running and I'm trying to pull all the users using the JSON Library. I can easily see the JSON list of users if I type in the URL that dumps this data, I'm trying to create a webpage that will take this JSON list and make a list of users out of it. I keep encounter cross domain issues, CORS is not available for me to use therefore I'm trying to dynamically load scripts according to the user's information. This is the code that I'm trying to get working.
function test() {
var username = document.getElementById("username").value;
var password = document.getElementById("password").value;
var domain = document.getElementById("domain").value;
var targeturl = "https://" + username + ":" + password + "#"
+ domain + "/sys_user_list.do?JSON&sysparm_action=getRecords";
$.getScript(targeturl + "&callback=dumpData")
function dumpData(data) {
alert(data);
}
}
At this point the script seems to load properly, but it causes a syntax error.
Uncaught SyntaxError: Unexpected token :
How am I supposed to make the getScript call so I can get my JSON Data? Is this even a valid method, I stumbled across when trying to figure this issue out and it seems like its my only option. I've tried YQL but that doesn't work.
EDIT:
I have redone the code to make use of the $.ajax, here is the code
$.ajax({
url: 'https://' + username + ':' + password + "#" + domain + '/sys_user_list.do?JSON&sysparm_action=getRecords&callback=test',
type: "GET",
success: function (data) {
alert("hello");
},
crossDomain: true,
dataType: "jsonp",
jsonpCallback: 'test'
});
function test(data) {
alert("It worked!");
}
I've scoured all the posts relating to this an still can't figure this one out. Anybody have any advice on how to remedy this situation? It still is given the invalid syntax error. Is it just not possible to get this JSON data?
I also have tried YQL to obtain the data but that encounters security issues as well.
Thanks,
Chris

From my experience using the JSON Web Services plugin on Calgary, ServiceNow does not support JSONP, only JSON.
You may need to build a custom scripted webservice to get the right format.. I don't see JSONP coming in Dublin, either.
Link example:
https://<instance>.service-now.com/<table>.do?JSON&sysparm_action=getRecords&displayvalue=true
displayvalue=true swaps sys_id for reference fields to the human-friendly alternative.
To access the data structure, it's as simple as:
function callMe() {
$.getJSON('url.json', function(myData) {
for (n = 0; n < myData.records.length; n++) {
console.log(myData.records[n].<column1> + '\n' +
myData.records[n].<column2> + '\n' +
myData.records[n].<column3> + '\n' +
myData.records[n].<column4> + '\n\n'
);
}
});
};
You might be better off using the CMS/jelly to make this list.

May be you should try $.ajax({}); instead of $.getSrript(); to do the cross domain e.g $.ajax({url: "your_url.php",dataType; "jsonp",success: function(data){ document.write(data);} });

Pass parameter containing `&` with AJAX

I am passing my string to PHP through AJAX using $.Ajax.
I'm trying to pass this string:
action=abc&parameter=C&W
The AJAX splits the C&W on the basis of &, so the request comes in this format:
$action = "abc";
$parameter = "C";
How can I pass it as C&W, without it being split into a different parameter?

You should let jQuery do the encoding for you :
$.ajax({
url: someUrl, // <- no parameter here
data: {action:'abc', parameter:'C&W'},
...

Using bog-standard JavaScript (no jQuery), you can use encodeURIComponent:
var url = "action=" + encodeURIComponent(action) + "&parameter=" + encodeURIComponent(param);

Connecting to Rest Server with jquery and ajax

i am trying to make a call to a rest server using jquery/ajax
The rest Server is built in Codeigniter
The ajax function is as follows:
var req = $.ajax({
type: 'GET',
url: "http://localhost/projects/comp6300Server/index.php/resources/token//username/" + email + "/password/" + pword + "/institution/" + inst,
contentType: "application/json; charset=utf-8",
dataType: "json"
})
The request that is generated is as follows:
http://localhost/projects/comp6300Server/index.php/resources/token//username/etambie#yahoo.com/password/qwerty/institution/BCC
The status returned is '400 Bad Request'
I think the problem may be with the email that is passed in "etambie#yahoo.com". Is there a way for the ajax automatically convert the '#' to '%40', or would i have to convert all special characters in my strings manually?

Two things to check out:
The "_" parameter is probably added to that each request is unique. If this isn't done, then the browser may attempt to get the result of calling the URL from it's cache, which is probably not what you want.
On the bad request ... are you sure you want two slashes after the word 'token' in your url?

Messaging system jquery sends jQuery514109241_1210239812938 when I put :)) in the message

When I put ":))" in my textarea and send via ajax, it inputs into the database a value like
"jQuery172039628539560362697_1345324072488", how can I stop this? Should I parse my text in some way in javascript first to make it recognize it's text, and not part of the javascript coding?
This is how i get my text
var message = $("textarea.message_thread").val();
var dataString = 'id=' + id + '&message=' + message;
// make ajax call
sending with
$.ajax(
{
type: "POST",
url: "/inbox/instsend",
data: dataString,
dataType: 'json',
success: function(results) {}
}

See the comments under the question; the problem is that what has been submitted in dataString is actually a url-encoded string, and not a JSON-izable or JSON literal variable.
Hence:
dataString = {id: id, message: message};
Will fix this problem, here. jQuery will take that object-initialized variable and encode it for you to JSON.

This is done automatically by jQuery when you're using JSONP for cross-domain AJAX calls. It should be sending this string as the value of the callback parameter.

You need to sanitise the input and escape any control codes - e.g. : and )

Since you are doing POST here. This would work
var dataString = '{'+'id:' + id + 'message:' + message +'}'