Trying to pass values from Javascript to Java - javascript

I'm using this Javascript to send x, y values to Java from front-end (Javascript).
Sometimes this code pass the x any y values to Java and sometimes it's doesn't.After pressing the 'save' button, the function saveObjectMovingPath() will be called.
I don't know why it doesn't work sometimes! Can anyone help me to solve this issue?
<script type="text/javascript">
function saveObjectMovingPath() {
var building_Id = $("#building").val();
var floor_Id = $("#floor_level").val();
console.log('building_Id :' + building_Id + ', floor_Id : ' + floor_Id);
var json = {};
json["building_Id"] = building_Id;
json["floor_Id"] = floor_Id;
json["dataset"] = dataset;
$.ajax({
type: "post",
url: "savepath?pathConfig=" + unescape(JSON.stringify(json)),
success: function(data) {
alert("response data : " + data);
var response = JSON.parse(data);
}
});
}
</script>
This is sample data passing on URL:
"http://localhost:8080/Track/savepath?pathConfig={%22building_Id%22:%223%22,%22floor_Id%22:%2224%22,%22dataset%22:[{%22x%22:785.260498046875,%22y%22:624.4688720703125},{%22x%22:783.3544921875,%22y%22:624.4688720703125},{%22x%22:781.4485473632812,%22y%22:624.4688720703125},{%22x%22:779.5425415039062,%22y%22:624.4688720703125},{%22x%22:777.6365966796875,%22y%22:624.4688720703125},{%22x%22:775.7306518554688,%22y%22:624.4688720703125},{%22x%22:773.8246459960938,%22y%22:624.4688720703125},{%22x%22:770.9656982421875,%22y%22:624.4688720703125},{%22x%22:769.0596923828125,%22y%22:624.4688720703125},{%22x%22:767.1537475585938,%22y%22:624.4688720703125},{%22x%22:764.2947998046875,%22y%22:624.4688720703125},{%22x%22:763.341796875,%22y%22:624.4688720703125},{%22x%22:762.3887939453125,%22y%22:623.5159301757812},{%22x%22:760.4828491210938,%22y%22:623.5159301757812},{%22x%22:759.5298461914062,%22y%22:623.5159301757812},{%22x%22:757.6239013671875,%22y%22:623.5159301757812},{%22x%22:756.6708984375,%22y%22:623.5159301757812},{%22x%22:755.7178955078125,%22y%22:623.5159301757812},{%22x%22:754.7649536132812,%22y%22:623.5159301757812},{%22x%22:752.8589477539062,%22y%22:623.5159301757812},{%22x%22:751.9059448242188,%22y%22:623.5159301757812},{%22x%22:750.9530029296875,%22y%22:623.5159301757812},{%22x%22:749.0469970703125,%22y%22:623.5159301757812},{%22x%22:748.0940551757812,%22y%22:623.5159301757812},{%22x%22:747.1410522460938,%22y%22:624.4688720703125},{%22x%22:745.2350463867188,%22y%22:624.4688720703125},{%22x%22:744.2821044921875,%22y%22:625.421875},{%22x%22:743.3291015625,%22y%22:625.421875},{%22x%22:741.423095703125,%22y%22:625.421875},{%22x%22:740.4701538085938,%22y%22:626.3748779296875},{%22x%22:739.5171508789062,%22y%22:626.3748779296875},{%22x%22:738.5641479492188,%22y%22:626.3748779296875},{%22x%22:737.6112060546875,%22y%22:627.327880859375},{%22x%22:736.658203125,%22y%22:627.327880859375},{%22x%22:735.7052001953125,%22y%22:627.327880859375},{%22x%22:734.752197265625,%22y%22:627.327880859375},{%22x%22:733.7992553710938,%22y%22:628.2808227539062},{%22x%22:732.8462524414062,%22y%22:628.2808227539062}]}"

you try to send GET parameters on POST method
first you need to call the error function in your AJAX declaration and console.log it , if there is no error and the problem not resolved please check your java side (server side , maybe you try to save something need to parse ... )
second : make ajax statement look like this :
$.ajax({
type: "post",
data : {
building_Id : $("#building").val(),
floor_Id : $("#floor_level").val()
dataset: dataset;
}
url: "savepath?pathConfig=" + unescape(JSON.stringify(json)),....
....
instead of this :
var json = {};
json["building_Id"] = building_Id;
json["floor_Id"] = floor_Id;
json["dataset"] = dataset;

Related

Push Local File From Electron to Server PHP

js and electron. I have a problem to push my local images file to my remote server. The server is using php. Here's my client side code :
var documentList = [];
var stmtDoc = db.prepare("SELECT * FROM `tb_dokumen_pasien`");
while(stmtDoc.step()) {
var rowDoc = stmtDoc.getAsObject();
var data = fs.createReadStream(__dirname + "/resources/" + rowDoc['id'] + "/" + rowDoc['doc_name']);
var document = {
"document_name" : rowDoc['doc_name'],
"data" : data
}
documentList.push(document);
}
And after that I create an ajax post request to my remote server :
$.ajax({
url: "http://url/web_api.php?action=test_upload",
type: 'POST',
data : { "document_list": documentList },
dataType: "json",
success: function(response) {
console.log(response);
}
});
When I test it, in my developer tools console I've got this message :
internal/streams/BufferList.js:15 Uncaught TypeError: Cannot read property 'length' of undefined
And the file is not sent to the server. Can anyone help me how can I solve this? Thanks
for a while I found the working solution for this problem is use base64 format to send it to the remote server :
var documentList = [];
var stmtDoc = db.prepare("SELECT * FROM `tb_dokumen_pasien`");
while(stmtDoc.step()) {
var rowDoc = stmtDoc.getAsObject();
var data = fs.createReadStream(__dirname + "/resources/" + rowDoc['id'] + "/" + rowDoc['doc_name']);
var base64 = Buffer.from(data).toString('base64');
var document = {
"document_name" : rowDoc['doc_name'],
"data" : base64
}
documentList.push(document);
}
And I still finding the best approach instead of using base64, Thanks

Trouble displaying data from ajax json parse

This is the link to my codepen: http://codepen.io/dsemel/pen/VamEyE
This is the section of code that seems to be the problem:
function success(position){
var WeatherKey = '6068dffce2f44535a07202457162103';
var lat = position.coords.latitude;
var long = position.coords.longitude;
var weatherUrl = "http://api.apixu.com/v1/current.json?key=" + WeatherKey +
"&q=" + lat + "," + long;
$.ajax({
url : weatherUrl,
type: 'GET',
dataType : 'json',
success : function(data) {
var city = data['location']['name'];
var tempFar = data['current']['temp_f'];
var img = data['condition'][0]['icon'];
var desc = data['condition']['text'];
$('#weatherInfo2').text(tempFar);
}
});
}
Make sure you check your developer tools console when you encounter these errors. Your code is throwing this error Uncaught TypeError: Cannot read property '0' of undefined.
The condition object is part of the current object, therefore you have to access the current object before accessing the condition object.
Updated working codepen
I think your code works fine you just missed a small thing in your code i corrected that
http://codepen.io/rahulchaturvedie/pen/RagGdR
$.ajax({
url : weatherUrl,
type: 'GET',
dataType : 'json',
success : function(data) {
console.log(data);
var city = data['location']['name'];
var tempFar = data['current']['temp_f'];
var img = data.current.condition.icon; // correct this
var desc = data.current.condition.text; // correct this
$('#weatherInfo2').text(tempFar);
}
});

how to use returned list in ajax call from controller

i am using ajax call to store the data in to DB and controller is returning the list of commentObject.
how can i access this list in JSP?
my ajax call is:
function StoreCommentAndRefreshCommentList(e) {
var commentData = document.getElementById(ActualCommentTextId).value;
$.ajax({
type : 'POST',
url : 'CommentStoreAndRetrieve',
data : "commentData=" + commentData + "&ImageId=" + commetTextButtonId[1],
success : function(commentList) {
//alert('comments stored successfully');
//alert('comment data is...'+res.CommentDataDoc[0]);
},
error : function(e) {
alert('Error: ' + e);
}
});
}
please let me know how can i access list data here.
function StoreCommentAndRefreshCommentList(e) {
var commentData = document.getElementById(ActualCommentTextId).value;
$.ajax({
type : 'POST',
url : 'CommentStoreAndRetrieve',
data : "commentData=" + commentData + "&ImageId=" + commetTextButtonId[1],
dataType : "xml",
success : function(commentList) {
alert($(commentList).text());
},
error : function(e) {
alert('Error: ' + e);
}
});
}
You can f.e. create <input type='hidden' id='someId'/> in your JSP and then in your success function you can assign data like $("#someId").val(...);
Another idea would be create JS variable inside JSP by putting <script>var myVar = ""</script>. Then in your succes function you can refer to such 'global' variable. Althogh, I believe that usual assignment (myVar = response.yourList) wouldn't work for a response object (which is the case in your problem). The solution would be to create an array var arr = [] and then in for loop you can push some done into it.
I got the solution.
i did used $.each(res, function (key, val) to iterate one by and built the tags dynamically using val field. here key holds the index position and val holds the corresponding object. then i did accessed one by one field by val.filedname(which we did create for pojo).
Thanks everyone.

Why is this $.ajax function successful only the second time it's called?

I'm experimenting with the Rotten Tomatoes API. On a click event, a search returns JSON data for the closest matched movie title and thumbnail image to the search input.
Upon completion of that first $.ajax request, a second $.ajax request is made, using var resultID, which was declared at the top and set upon 'success' of the first $ajax request.
As of now, when I click for the first time, it runs the first request successfully, but it can't run return json.total (upon 'complete') because the resultID is returned as 'undefined'. But the second time I click, resultID has apparently been set, since it will return json.total successfully.
I'm guessing this a simple problem related to how I'm declaring and calling resultID (or the asynchronous firing of ajax), but I'm not sure what it is. Can anyone explain?
var apiKey = '***********';
var resultID = "";
$('#search-submit').click(function(){
var queryText = $('#movie-search').val();
var queryURI = encodeURI(queryText);
var searchApiRequest = "http://api.rottentomatoes.com/api/public/v1.0/movies.json?q=" + queryURI + "&page_limit=10&page=1&apikey=" + apiKey;
var reviewApiRequest = "http://api.rottentomatoes.com/api/public/v1.0/movies/" + resultID + "/reviews.json?review_type=top_critic&page_limit=10&page=1&country=us&apikey=" + apiKey;
$.ajax({
url: searchApiRequest,
type: 'GET',
dataType: 'jsonp',
error: function() {
console.log('there was error in processing the search request.');
},
success: function(json) {
var movieInfo = json.movies[0];
var noResultsMessage = 'your search returned no matches. Please try again.';
var resultTitle = movieInfo.title;
var resultThumb = movieInfo.posters.thumbnail;
var resultDesc = movieInfo.critics_consensus;
var reviewsPublicURL = movieInfo.links.reviews;
var reviewsRequest = reviewsPublicURL;
resultID = movieInfo.id; // supposed to set global var resultID to movieID
$('.search-results').find('img').attr('src',resultThumb).end().find('h1').text(resultTitle).end().find('p').text(resultDesc);
},
complete: function() {
$.ajax({
url:reviewApiRequest,
type: 'GET',
dataType: 'jsonp',
error: function(json) {
console.log('for whatever reason, we could not find any reviews of this movie');
},
success: function(json) {
console.log(json.total);
}
});
}
});
});
You need to not only set a global resultID but also refresh a reviewApiRequest as well. It doesn't magically change its value by itself when you update resultID.

Jquery AJAX function - how can I use a variable for JSON?

I want to be able to supply the JSON variable name and its value via variables, instead of hard-coding it:
data: {
inputVar : inputVal
},
but doing it like that and defining
inputVar = 'myInputVar';
doesn't work, instead entering the POST variable name directly only works:
'myInputVar' : inputVal
In the end, what I'd like to accomplish is to create a function that allows me to just call it to make an AJAX call in the JSON format, by supplying the JSON formatted AJAX variable and value in the function call:
makeAjaxJsonCall(fileName, postVar, postVal) {
$.ajax({
type : 'POST',
url : fileName,
dataType : 'json',
data: {
inputVar : inputVal
},
success : function(data) {
.
.
.
},
error : function(XMLHttpRequest, textStatus, errorThrown) {
.
.
.
}
});
}
Any ideas?
PS. I really don't know too much about JavaScript programming, so please be precise with full code when replying - thanks!
Do you want something like this?:
makeAjaxJsonCall(fileName, postVar, postVal) {
var data = {};
data[postVar] = postVal;
$.ajax({
type : 'POST',
url : fileName,
dataType : 'json',
data: data,
success : function(data) {
.
.
.
},
error : function(XMLHttpRequest, textStatus, errorThrown) {
.
.
.
}
});
}
You can set object values like this.
var obj = {};
//This is the same as...
obj.value1 = 'one';
//This...
var varName = 'value1'
obj[varName] = 'one';
A small explanation of the last two answers:
You can define elements of an object in this way:
var myObj = {};
myObj.element = 1;
// And using a variable just like you want:
var key = 'myKey';
myObj[key] = 2;
console.log(myObj.key); // 2
So, you can build your data object first, and then pass it to the ajax hash:
// ...
var myData = {};
myData[inputVal] = 'my value';
//...
makeAjaxJsonCall(fileName, postVar, postVal) {
$.ajax({
type : 'POST',
url : fileName,
dataType : 'json',
data: myData, // <-------------
success : function(data) {
// ...
Hope this helps.
Regards.

Categories

Resources