Develop Reference

Fix Ajax call not binding the result to a HTML id

I am writing some jQuery and Java code that sends an ajax call to my Java backend to do a procedure and then sends the results back to my jQuery. However, when I run a debug I notice that the information is being sent from Java to jQuery successfully, the issue is the jQuery is cutting off the remaing words after the first space. Below is my code and the result.
Jquery:
function fillInGPData() {
$.ajax({
type : "POST",
contentType : 'application/json; charset=utf-8',
dataType : 'json',
url : "/ajax/getGPdata",
data : JSON.stringify(""),
success : function(result) {
console.log("Result Selector: " + result);
console.log(result == null);
$.each(result, function(i, obj) {
console.log("Object: " + obj);
console.log("Tier: " + obj.tier);
console.log( "Selname: " + obj.selname);
console.log("Query: " + obj.query);
console.log("Description: " + obj.description);
console.log("Comment: " + obj.comments);
$(".tableBody1").append(
"<tr id=" + obj.selname + ">"
+ "<td class='sm-width-td'>"
+ obj.selname + "</td>" + "</tr>");
});
},
error : function(err) {
console.log(err);
}
});
}
Result:
<tr id="Windows" file="" share=""><td class="sm-width-td">Windows File Share</td></tr>
So its the obj.selname that is giving the issue. For example, if I pass Windows File Server, it will only show Windows for the ID. That where the problem is. I just need help figuring out why that is the case.

Ajax character encoding changed after send to server

I have an ajax like this:
$.ajax('../EditUser?userId=' + editingId + '&full_name=' + name + '&position=' + position + '&office=' + office
+ '&office_address=' + office_address + '&age=' + age + '&user_login_name=' + user_login_name + '&email=' + email
+ '&user_type=' + usertype + '&password=' + password + '&meetingIds=' + selectedmeetingid, {
type: 'POST',
success: function (data) {
if (data.indexOf('error://') < 0) {
$('#tbl_meetings').html(data);
} else {
$('#errorMessage').html(data);
}
},
error: function (jqXHR, textStatus, errorThrown) {
alert("error " + errorThrown);
alert("error " + textStatus);
alert("error " + jqXHR.status);
}
}
);
and my server received data with wrong encoding,example: "Hà Thị Minh Thắng" became "H? Th? Minh Th?ng" after received on server side.I tried adding
contentType: "application/x-www-form-urlencoded;charset=ISO-8859-15",
and
beforeSend: function(jqXHR) {
jqXHR.overrideMimeType('text/html;charset=iso-8859-1');
}
to my ajax but it didn't works. So, anyone know how to fix this?

Try specifying content type to the ajax request & you have to add header to the server side to receive the charset.
$.ajax({
data: parameters,
type: "POST",
url: your-url,
timeout: 20000,
contentType: "application/x-www-form-urlencoded;charset=ISO-8859-1",
dataType: 'json',
success: callback
});
// Server Side... (This is an example in php which I have used in my app)
header('Content-Type: text/html; charset=ISO-8859-1');
Hope this helps you!

Windows Translator: "ArgumentOutOfRangeException: 'to' must be a valid language

Im trying to use Bing Translator...
Already Have a token (I think), but when try to get the translation, the same Error is always poping:
"ArgumentOutOfRangeException: 'to' must be a valid language\u000d\u000aParameter name: to : ID=5217.V2_Json.Translate.5FEAF805"
The next is the url that i am using, and I dont see where the error is...
https://api.microsofttranslator.com/V2/Ajax.svc/Translate?
&appId=Bearer%20http%3a%2f%2fschemas.xmlsoap.org%2fws%2f2005%2f05%2fidentity%2fclaims%2fnameidentifier=TranslateHelper000&http%3a%2f%2fschemas.microsoft.com%2faccesscontrolservice%2f2010%2f07%2fclaims%2fidentityprovider=https%3a%2f%2fdatamarket.accesscontrol.windows.net%2f&Audience=http%3a%2f%2fapi.microsofttranslator.com&ExpiresOn=1439307776&Issuer=https%3a%2f%2fdatamarket.accesscontrol.windows.net%2f&HMACSHA256=xGQ7LMehBDHJLY2Xq7jN8PXOhRCYqs%2boUb2V4Ic4XLI%3d
&from=en
&to=pt
&text=Home
&oncomplete=mycallback
(pt is defined as language in translator... it doesn't work either with to=en...
My question are, if you could help me on this:
1. Is that a normal Token?
2. Is it is normal, what is wrong with code? (I dont have any more hair to take off...)
This is the code I use to send the url (mycallback isn't being called either):
$.ajax({
type: "POST",
url: 'getTranslatorToken',
contentType: "application/json; charset=utf-8",
dataType: "json"
}).done(function (token) {
var languageFrom = "en";
var languageTo = "pt";
var textToTranslate = "Home";
var strToken = token["access_token"];
var s = document.createElement("script");
//s.src = "http://api.microsofttranslator.com/V2/Ajax.svc/Translate?oncomplete=mycallback&appId=Bearer " + token + "&from=" + languageFrom + "&to=" + languageTo + "&text=" + $('#txtMsg').val();
s.src = "https://api.microsofttranslator.com/V2/Ajax.svc/Translate?&appId=Bearer " + strToken +
"&from=" + encodeURIComponent(languageFrom) +
"&to=" + encodeURIComponent(languageTo) +
"&text=" + encodeURIComponent(textToTranslate) +
"&oncomplete=mycallback";
document.getElementsByTagName("head")[0].appendChild(s);
console.log(s)
}).fail(function (xhr, ajaxOptions, thrownError) {
alert("Error:"+xhr.responseText);
console.log(xhr.responseText);
//$("#msg").text('Error');
});
Thank

This question is answered here (in C#):
How to translate specific content in website
Working example here (PHP): http://www.johndimm.com/FunWithSpeech/BingTranslator/

Uncaught Type Error: Object `function()` has no method 'call'?

I have an AJAX request that utilizes beforeSend, success, and failure, yet when the beforeSend gets hit it treats it as an object instead of a method call.
Here's the AJAX:
$.ajax({
url: "#Url.Action("DeleteUser", "DataFeeds")/" + id,
method: 'post',
beforeSend: "deleting('" + id + "')",
success: "deleted('" + full + "','" + id + "')",
failure: "failed('" + id + "')"
});
Just for kicks, here's the deleting() method:
function deleting(id) {
$('#btnDelete-' + id + ' span').html('Deleting...');
$('#btnDelete-' + id + ' span').prop('disabled', 'disabled');
}
It's pretty simple stuff, but I can't figure out why it's treating my function as an object.
Halp!

You need to pass an extra anonymous function there, otherwise you're just assigning a string:
beforeSend: function(){ deleting(id) },
// same with the other methods...

I could be mistaken, but I don't think you're allowed to give JQuery a string there. You can give it a function instead by currying deleting:
function deleting(id) {
return function() {
$('#btnDelete-' + id + ' span').html('Deleting...');
$('#btnDelete-' + id + ' span').prop('disabled', 'disabled');
}
}
And:
beforeSend: deleting(id),

Error: $.ajax is not a function

Am getting a error like that, $ajax is not working
<script type="text/javascript">
$(document).ready(function () {
$("#btnsubmit").click(function () {
$.ajax({
type: "POST",
url: "loginform.aspx/getdataval",
data: "{'uname':'" + $("#TextBox1").val() + "','passwod':'" + $("#TextBox2").val() + "'}",
contentType: "application/json;charset=utf-8",
dataType: "json",
success: function (msg) {
alert("welcome");
AjaxSucceeded(msg);
},
error: function (xhr, ajaxOptions, thrownError) {
alert("what is the problem")
}
});
});
});
function AjaxSucceeded(result) {
alert(result.d);
var Emp = result.d;
$("#output").append('<p>' + Emp.Sname + ' ' + Emp.Sno + '</p>');
}
</script>
$ ajax not a function why? When I run this script I get error, it not running, what is the problem?
Thanks

You may have an issue with the single/doule quotes on the data string as the JSON standard says double quotes.
You can also simplify the contentType.
I tend to simplify my use of the .d in asp.net by including a converter and the ajax itself using ajaxSetup like so: (Note that using a converter like this works in jQuery 1.5 forward due to that syntax. Feel free to refactor out the ajaxSetup if you prefer but I find it helps me as I only have to do it once when I have multiple ajax calls.)
$(document).ready(function() {
$.ajaxSetup({
data: "{}",
dataType: "json",
type: "POST",
contentType: "application/json",
converters: {
"json jsond": function(msg) {
return msg.hasOwnProperty('d') ? msg.d : msg;
}
},
error: function(xhr, textStatus, errorThrown) {
var errorMessage = "Ajax error: " + this.url
+ " : " + textStatus + " : " + errorThrown
+ " : " + xhr.statusText + " : " + xhr.status;
alert(errorMessage);
if (xhr.status != "0" || errorThrown != "abort") {
alert(errorMessage);
}
}
});
$("#btnsubmit").click(function() {
var pString = '{"uname":"'
+ $("#TextBox1").val() + '","passwod":"'
+ $("#TextBox2").val() + '"}';
$.ajax({
url: "loginform.aspx/getdataval",
data: pString,
success: function(msg) {
alert("welcome");
AjaxSucceeded(msg);
}
});
});
});
// converter gives us the result instead of the .d here
function AjaxSucceeded(result) {
alert(result);
var Emp = result;
$("#output").append('<p>' + Emp.Sname + ' ' + Emp.Sno + '</p>');
}
EDIT: as of jQuery 1.9, you should bind the ajax setup as such:
$(document).ajaxSetup({..more code