I have a web service that does work properly when asked directly by url but i cant seem to call it through a Jquery Ajax call.
Here's my code:
jQuery("#field1").focusout(function() {
alert("focusOut");
jQuery.ajax({
type: 'POST',
url: '/motifRes/name',
data: { 'clRef' : document.getElementById("field1") },
datatype: 'text',
success: function(msg) {
$("#nomClient").val(msg);
},
error: function (xmlHttpRequest, textStatus, errorThrown) {
alert(textStatus, errorThrown);
}
});
});
I do enter in the function because i get the "focusOut" alert but then nothing, just nothing. I used the Chrome developper tool and fiddler and I see no request, no error.
Any ideas ?
EDIT:
About your questions :
are you requesting from an external domain? Blockquote
No I am not
Are you sure its a POST request?
Well either way, it doesnt change a thing =/
Here's my HTML
<div class="panel" id="standard">
<form id="test" action="#" method="get">
<fieldset>
<legend>Formulaire de changement du motif d'annulation</legend>
<div class="form-row">
<div class="field-label"><label for="field1">Ref Client</label>:</div>
<div class="field-widget"><input name="field1" id="field1" title="Entrer la référence client" /><input id="nomClient" readonly="readonly" type="text" value=""></input></div>
</div>
Use done(), fail(), and always() instead of success() and error(). Also use document.getElementById("field1").value instead of document.getElementById("field1").
jQuery("#field1").focusout(function() {
alert("focusOut");
jQuery.ajax({
type: 'POST',
url: '/motifRes/name',
data: { 'clRef' : document.getElementById("field1").value },
datatype: 'text',
done: function(msg) {
$("#nomClient").val(msg);
},
fail: function (xmlHttpRequest, textStatus) {
alert(textStatus);
}
});
});
Change your data
attribute to
data: { 'clRef' : $("#field1").val() },
Finally got it. A vicious and well rookie mistake I guess...
url: '/motifRes/name'
=!
url: 'motifRes/name'
The slash does mean an absolute path and without it the root of my webservice does concat with the url...