I have a simple form submission with ajax, but it keeps giving me an error. All the error says is "error". No code, no description. No nothing, when I alert it when it fails.
Javascript with jQuery:
$(document).ready(function(){
$(".post-input").submit(function(){
var postcontent = $(".post-form").val();
if (postcontent == ""){
return false;
}
$(".post-form").attr("disabled", "disabled");
$.ajax({
url: '/post',
type: 'POST',
data: {"post-form": postcontent},
dataType: json,
success: function(response, textStatus, jqXHR) {
alert("Yay!");
},
error: function(jqXHR, textStatus, errorThrown){
alert(textStatus, errorThrown);
}
});
});
});
HTML:
<form class="post-input" action="" method="post" accept-charset="utf-8">
<textarea class="post-form" name="post-form" rows="1" cols="10" onFocus="this.value='';return false;">What are you thinking about...</textarea>
<p><input class="post-submit" type="submit" name = "post.submitted" value="Post"></p>
</form>
and if there are no problems there, then the server-side (pyramid):
def post(request):
session = Session()
user = authenticated_userid(request)
postContent = request.POST['post-form']
if not postContent == '':
session.add(Activity(user.user_id, 0, postContent, None, None))
return {}
return HTTPNotFound()
UPDATE:
After some more debugging with firebug, I discovered that the post request body contains only post.submitted=Post, instead of the intended result of {"post-form": postcontent}.
According to jQuery documentation, you must declare the data type:
$.ajax({
type: 'POST',
url: url,
data: data,
success: success,
dataType: dataType
});
Also, looking at your server-side code, you don't actually want to post JSON formatted data. This {"post-form":postcontent} is JSON formatted data. What you actually want to do is send TEXT or HTML. Seeming as it's form data, I would guess at TEXT.
Try this:
$.ajax({
url: '/post',
type: 'POST',
data: 'post-form='+postcontent,
dataType: 'text',
success: function(response, textStatus, jqXHR) {
alert("Yay!");
},
error: function(jqXHR, textStatus, errorThrown){
alert(textStatus, errorThrown);
}
});
Since you are posting JSON-data you have to declare the dataType "JSON":
$.ajax({
url: '/post',
type: 'POST',
dataType: "json",
data: {"post-form": postcontent},
success: function(response, textStatus, jqXHR) {
alert("Yay!");
},
error: function(jqXHR, textStatus, errorThrown){
alert(textStatus, errorThrown);
}
});
I think the problem is that the data that you are passing is not properly written.
Try to change this:
data: {"post-form": postcontent},
To this:
data: 'post-form='+ $('.post-form').val(),
Related
I have the below ajax call and sometimes the request stops the page from loading as the data being passed is undefined.
I there a way to put a condition to handle the request if it has values that are undefined?
Can it be wrapped with a if condition?
newuser is not defined
$.ajax(
{
url: 'sample.aspx,
data: newuser,
type: 'POST',
dataType: 'html',
success: function(data){
...
} ,
error: function(XMLHttpRequest, textStatus, errorThrown) {
}
});
});
Simplest way would be to use a pipe:
$.ajax({url: 'sample.aspx',
data: newuser || {},//continue here...
If your variable was not initialized, empty object will be sent instead.
That's if and only if you can handle empty "newuser" for some reason.
I'm assuming that not closed URL is just a mistake in copy-paste, and not actually part of your code.
how about
if(newuser)
{
$.ajax(
{
url: 'sample.aspx,
data: newuser,
type: 'POST',
dataType: 'html',
success: function(data){
...
} ,
error: function(XMLHttpRequest, textStatus, errorThrown) {
}
});
});
}
If you are unable to handle an empty newuser you can try something like this:
if (newuser) {
$.ajax({
url: 'sample.aspx',
data: newuser,
type: 'POST',
dataType: 'html',
success: function(data) {
...
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
}
});
}
I can't understand why this is not working.
I have an input in my site which is filled by an ajax request.
I would like to fill it with htmlCode, but it's empty when tried.
<form name="form" id="form" method="post" action="secondpage" />
<input type="hidden" name="htmlCode" id="htmlCode"/>
</form>
$.ajax({
url : url,
type: "POST",
async: true,
data : {
"requestData": JSON.stringify(request)
},
success: function(data, textStatus, jqXHR){
var response = data.methodResult;
alert(response.htmlCode);
document.getElementById("htmlCode").value = response.htmlCode;
},
error: function (jqXHR, textStatus, errorThrown) {
}
});
the alert shows the htmlCode, so, I'm sure it exists.
I read the variable in jsp:
System.out.println("htmlCode Value - " + request.getParameter(htmlCode));
And this is empty.
If I change the REST server, and returns "hello" instead of htmlCode it is filled.
Is there any forbidden character I'm trying to set or something?
I got the solution, I should encode UTF-8 the html text
Does it work when you use JSON.stringify?
document.getElementById("htmlCode").value = JSON.stringify(response.htmlCode);
Documentation: https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify
Try this one
$.ajax({
url : url,
type: "POST",
async: true,
data : {
"requestData": JSON.stringify(request)
},
success: function(data, textStatus, jqXHR){
document.getElementById("htmlCode").value = data;
},
error: function (jqXHR, textStatus, errorThrown) {}
});
i'm trying to get only the returned URL from ajax request
like this
$.ajax({
type: "GET",
dataType : "jsonp",
async: false,
url: $('#FaceBookProfileLink').attr('href'),
success: function(response) {
console.log(response);
},
error: function (jqXHR, textStatus, errorThrown) {
console.log(jqXHR);
console.log(textStatus);
console.log(errorThrown);
}
});
but i can't.
the returned URL showing in the console as js file but i can't get it
please any help and many thanks in advance.
As you are using 'GET' method, retrieve them with $_GET[], ie:
echo $_GET['code']
In javascript how can I write a function that if string is 'Select client' then address and contact number fields should be null or blank. I have already this function that if client name is selected then address and contact number fields are entered automatically using the populator gem of rails.
$('#client_id').change(function(){
$.ajax({
url: "/fetch_client",
type: "POST",
data: "id="+$(this).attr('value'),
dataType: "json",
success: function(data, textStatus, xhr){
$('#client_address').attr('value',data.client_address);
$('#client_contact_number').attr('value',data.client_contact_number);
},
error: function(xhr, textStatus, errorThrown){
}
});
});
Can some one please help me as I am new to javascript?
$('#client_id').change(function(){
if ($(this).val() == "Select client") {
$('#client_address').attr('value', "");
$('#client_contact_number').attr('value', "");
} else {
$.ajax({
url: "/fetch_client",
type: "POST",
data: "id="+$(this).attr('value'),
dataType: "json",
success: function(data, textStatus, xhr){
$('#client_address').attr('value',data.client_address);
$('#client_contact_number').attr('value',data.client_contact_number);
},
error: function(xhr, textStatus, errorThrown){
}
});
}
});
The code is listed below:
$.ajax({
type: "POST",
url: "http://localhost:3000/rcm/global_config/update",
data: {k: 'sdfa', v: 'dsfas'},
success: function(data, textStatus, XMLHttpRequest){
alert("数据更新成功");
},
error: function(xhr,textStatus, errorThrown){
alert("数据更新失败，请刷新回滚");
}
});
In the server i can not get post parameters, and then i tamper the request sent by ajax, it doesn't send the data params at all. i don't know where i am wrong.
thank you in advance.
This issue has been asked and aswered before in SO jquery-ajax-post-sending-options-as-request-method-in-firefox
This is because the same origin policy on FF. It only allows you to do XMLHTTPRequests to your own domain.
Maybe your script is loaded from domain "localhost" and your ajax request to "localhost:3000"
Please try this
$.ajax({
type: "POST",
url: "http://localhost:3000/rcm/global_config/update",
data: "{'k': 'sdfa', 'v': 'dsfas'}", // Change are here in this line
success: function(data, textStatus, XMLHttpRequest){
alert("数据更新成功");
},
error: function(xhr,textStatus, errorThrown){
alert("数据更新失败，请刷新回滚");
}
});
$.ajax({
type: "POST",
url: "http://localhost:3000/rcm/global_config/update",
data: $.param({k: 'sdfa', v: 'dsfas'}),
success: function(data, textStatus, XMLHttpRequest){
alert("数据更新成功");
},
error: function(xhr,textStatus, errorThrown){
alert("数据更新失败，请刷新回滚");
}
});
Wrapping the data object in $.param should do it. It will convert that object to the string "k=sdfa&v=dsfas"
hi
please try somthing like this:
$.ajax({
type:"POST",
url:"student/info/ajax.php",
data:({type:'test', r:which}),
success:function(data){
if((data.result)=='true')
$('#result_popup').html(data.output);
},
dataType:"json"});
return false;