jquery ajax isn't working - javascript

I am trying to get user information by using twitter api. The jquery code is below :
<script type="text/javascript">
function GetUser() {
$.ajax({
type: "GET",
url: "http://api.twitter.com/1/users/show.json?user_id=id&include_entities=true&callback=?",
contentType: "application/json; charset=utf-8",
dataType: "jsonp",
cache:true,
timeout:8000,
success: function (json) {
alert("Successfull");
},
error: function (xhr, ajaxOptions, thrownError) {
alert(xhr.responseText);
alert(thrownError);
}
});
}
</script>
xhr.responseText:undefined
thrownError:[object Error]
And html code :
<input type="submit" value="Submit" onclick="GetUser();" />

First your URL is not correct. Instead of
user_id=id
in your URL you have to use a actual value for id (id is just placeholder in your case). For example:
user_id=82193320
which would give you the data for my twitter user (uwe_guenther) back.
You can easily lookup twitter ids here:
http://mytwitterid.com/
If you just want to lookup user data by screen name you could use:
screen_name=uwe_guenther
instead.
The Twitter API description can you find here:
https://dev.twitter.com/docs/api/1/get/users/show
I have attached a working example for looking up screen_name by user_id and user_id by screen_name here:
The jsFiddle with the following example can be found here: http://jsfiddle.net/uwe_guenther/EvJBu/
index.html
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<input id='userIdTextField' type='text' placeholder='user_id'/>
<input id='userIdSubmitButton' type="submit" value="Submit"/>
<div id='screenNameResultView'></div>
<br>
<input id='screenNameTextField' type='text' placeholder='screen_name'/>
<input id='screenNameSubmitButton' type="submit" value="Submit"/>
<div id='userIdResultView'></div>
<br>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src='main.js'></script>
</body>
</html>
main.js
$(document).ready(function (){
$('#userIdSubmitButton').click(function (){
var userId = $('#userIdTextField').val();
$.ajax({
type: "GET",
url: "http://api.twitter.com/1/users/show.json?user_id=" + userId + "&include_entities=true&callback=?",
contentType: "application/json; charset=utf-8",
dataType: "jsonp",
cache:true,
timeout:1000,
success: function (json) {
alert("Successfull: screen_name=" + json.screen_name);
$('#screenNameResultView').text("screen_name=" + json.screen_name);
console.log(json);
},
error: function () {
alert("No Result");
}
});
});
$('#screenNameSubmitButton').click(function (){
var screenName = $('#screenNameTextField').val();
$.ajax({
type: "GET",
url: "http://api.twitter.com/1/users/show.json?screen_name=" + screenName + "&include_entities=true&callback=?",
contentType: "application/json; charset=utf-8",
dataType: "jsonp",
cache:true,
timeout:1000,
success: function (json) {
alert("Successfull: user_id=" + json.id);
$('#userIdResultView').text("user_id=" + json.id);
console.log(json);
},
error: function () {
alert("No Result");
}
});
});
});

Your Url is wrong
<script type="text/javascript">
function GetUser() {
$.ajax({
type: "GET",
url: "http://api.twitter.com/1/users/show.json?user_id=id&include_entities=true&callback=?",//this is wrong
contentType: "application/json; charset=utf-8",
dataType: "jsonp",
cache:true,
timeout:8000,
success: function (json) {
alert("Successfull");
},
error: function () {
alert("cant search");
}
});
}
</script>

Here is a workin example http://jsfiddle.net/kMgES/
$.ajax({
url: 'http://api.twitter.com/1/users/lookup.json?screen_name=noradio&callback=?',
type: 'GET',
dataType: 'json',
timeout: 8000,
success: function (data) {
alert(data[0].name);
},
error: function () {
alert("cant search");
}
});
In this example the search is done by screen name. Take a look at https://dev.twitter.com/docs/api/1/get/users/show for all possible options.
Consider using this for error handdling
error: function(XMLHttpRequest, textStatus, errorThrown){
// error handling
}

Related

Jquery Ajax Post with body value from a form and print responses

i have a ajax request to post data to api and get response. What i want to do is, how to pass a value from input field to the body data on ajax.
here my form
<input type="text" name="serial" />
<input type="submit" />
here my ajax request
$.ajax({ url: "http://www.example.com/api",
beforeSend: function(xhr)
{ xhr.setRequestHeader("Authorization", "Basic " + btoa("username:password")); },
type: 'POST',
dataType: 'json',
contentType: 'application/json',
processData: false,
data: '{"serial":"252625"}',
success: function (data) { alert(JSON.stringify(data)); },
error: function(){
alert("Cannot get data"); }
});
I want to make the this part data: '{"serial":"252625"}' from a serial input filed programatically.
Thanks any suggestions,
Your form:
<input type="text" name="serial" id="serial" />
<input type="submit" id="submit" />
Javascript with Jquery:
$(document).ready(function() {
$('#submit').click(function() {
$.ajax({
url: "http://www.example.com/api",
beforeSend: function(xhr) {
xhr.setRequestHeader("Authorization", "Basic " + btoa("username:password"));
},
type: 'POST',
dataType: 'json',
contentType: 'application/json',
processData: false,
data: {
serial: $('#serial').val()
},
success: function (data) {
alert(JSON.stringify(data));
},
error: function(error){
alert("Cannot get data");
console.log(error);
}
});
});
});

Error function called when I parse the parameters using jquery AJAX function to asp.net behind code

This is my aspx page code
function grid(datas)
{
var datass = {datas: datas};
var myJSON = JSON.stringify(datass);
$.ajax({
url: 'EditCustomerBills.aspx/LoadGrid',
method: 'POST',
contentType: 'application/json; charset=utf-8',
dataType: 'json',
data: myJSON,
success: function (data) {
alert("Success");
},
error:function(error){
alert("failed");
}
});
}
and this is my behind code
[WebMethod]
public static string LoadGrid(string datas)
{
//GetCustomerBillDetail(data);
string datass = datas.ToString();
return datass;
}
I'm using code perfectly, but output is failed. I'm struggling for four days. please help me. thank you.
I don't know what is your "myJSON" is . according to me your code should be sometinhg like this.
[System.Web.Services.WebMethod]
public static string GetCurrentTime(string datas)
{
return "Hello " + datas + Environment.NewLine + "The Current Time is: "
+ DateTime.Now.ToString();
}
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></script>
<script type = "text/javascript">
function ShowCurrentTime() {
$.ajax({
type: "POST",
url: "CS.aspx/GetCurrentTime",
data: '{datas: "Your Data" }', // your data should be here.
contentType: "application/json; charset=utf-8",
dataType: "json",
success: OnSuccess,
failure: function(response) {
alert(response.d);
}
});
}
function OnSuccess(response) {
alert(response.d);
}
</script>
below picture will give you a idea how we can call the server side method.
for more reference please see this.
edit as follows and share with f12 in console output?
error: function (error) {
console.log(error);
}

data in alert box using javascript

I try to populate data in alert box on button click but when I click on button then alert box not populate
I try this
<head runat="server">
<title></title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
<button id="submitchart" runat="server">Show Chart</button>
</div>
</form>
</body>
<script type="text/javascript">
$('#submitchart').click(function() {
//alert("i");
$.ajax({
type: 'POST',
//url: 'WebForm1.aspx / Jqufunc',
//data: JSON.stringify({ yearP: $('#yearValue').val() }),
//data:{},
contentType: 'application/json;charset=utf-8',
dataType: 'json',
success: function() {
//alert(JSON.stringify(response.d));
alert("i");
}
});
});
//});
</script>
when I write alert("i") after this line $('#submitchart').click(function () { then alert box populate but when i write alert ("i") after the success: function() { then alert box not populate
any solution?
$(function () {
$("#submitchart").on("click", function () {
debugger;
alert("i");
$.ajax({
type: 'POST',
//url: 'WebForm1.aspx / Jqufunc',
//data: JSON.stringify({ yearP: $('#yearValue').val() }),
//data:{},
contentType: 'application/json;charset=utf-8',
dataType: 'json',
success: function () {
//alert(JSON.stringify(response.d));
debugger;
alert("i");
},
error: function () {
debugger;
alert("i");
}
});
ajax will be run error,don't run success
Give button type as button.
<head runat="server">
<title></title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
<button id="submitchart" type="button" runat="server">Show Chart</button>
</div>
</form>
</body>
<script type="text/javascript">
$('#submitchart').click(function() {
//alert("i");
$.ajax({
type: 'POST',
url: 'WebForm1.aspx / Jqufunc',
data: JSON.stringify({ yearP: $('#yearValue').val() }),
//data:{},
contentType: 'application/json;charset=utf-8',
dataType: 'json',
success: function() {
//alert(JSON.stringify(response.d));
alert("i");
}
});
});
//});
</script>
This one worked for me.
This happening because when you write alert("i") after $('#submitchart').click(function () { then its not dependent on success of any ajax call and ot works fine as it should but when you write this after success: function() { then it is dependent on ajax call and if there is some errors in ajax it will not run as you have only defined it for successful ajax.
Write this if ajax contains errors also
$('#submitchart').click(function() {
//alert("i");
$.ajax({
type: 'POST',
//url: 'WebForm1.aspx / Jqufunc',
//data: JSON.stringify({ yearP: $('#yearValue').val() }),
//data:{},
contentType: 'application/json;charset=utf-8',
dataType: 'json',
success: function() {
//alert(JSON.stringify(response.d));
alert("i");
},
error: function() {
//alert(JSON.stringify(response.d));
alert("i");
}
});
});

Ajax Response is not defeined

I am quite green when it comes to AJAX and am trying to get an email address from an ASP.Net code behind function
When using the below code I am getting the error as per the title of this issue.
This is the code I am using
$('.txtRequester').focusout(function () {
console.log("textBox has lost focus");
function ShowCurrentTime() {
$.ajax({
type: "POST",
url: "Default.aspx/FindEmailAddress",
data: '{id: "' + $("txtRequester").val + '" }',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: OnSuccess,
failure: function (response) {
alert(response.d);
}
});
}
function OnSuccess(response) {
alert(response.d);
}
});
which is an adaptation of the code from this site.
ASP.Net Snippets
When changing the line
success: OnSuccess to success: alert(response) or success: alert(data)
I get the error up, but if I use success: alert("ok") I get the message saying ok so I suspect that I am getting into the function as below.
<System.Web.Services.WebMethod()> _
Public Shared Function FindEmailAddress(ByVal id As String) As String
Dim response As String = GetEmail(id)
Return response
End Function
I would be extremely grateful if someone to help me and let me know where I am going wrong on this one.
thanks
I think you have can check the state of failure by using this code below as I think there is wrong syntax used by you.
$('.txtRequester').focusout(function () {
console.log("textBox has lost focus");
function ShowCurrentTime() {
$.ajax({
type: "POST",
url: "Default.aspx/FindEmailAddress",
data: JSON.stringify({id: ' + $(".txtRequester").val() + ' }),
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(data, status, header){
console.log(data);
},
error: function (response) {
alert(response.d);
}
});
}
});
then definitely you will get error response, if your success won't hit.
You have not called the function thats why its never get called.
$('.txtRequester').focusout(function () {
console.log("textBox has lost focus");
ShowCurrentTime();
});
function ShowCurrentTime() {
$.ajax({
type: "POST",
url: "Default.aspx/FindEmailAddress",
data: '{id: "' + $("txtRequester").val() + '" }',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
Onsuccess(response);
},
failure: function (response) {
alert(response.d);
}
});
}
function OnSuccess(response) {
alert(response.d);
}
This will help :)
use ajax directly ,
$('.txtRequester').focusout(function () {
console.log("textBox has lost focus");
var cond = $(".txtRequester").val();
$.ajax({
type: "POST",
url: "Default.aspx/FindEmailAddress",
data: {id:cond},
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(response){
alert(response.d);
},
failure: function (response) {
alert(response.d);
}
});
});
Change $('.txtRequester') to $('#txtRequester')
and
Change $("txtRequester").val to $('#txtRequester').val()

Using ajax posting not getting any responce

<script>
function login() {
var postData = {
"UserName": "user#gmail.com",
"Password": "123",
"RememberMe": true
};
$.ajax({
url: "url",
type: "POST",
data: postData,
success: function (Data) {
alert("success");
},
error: function () {
alert("Failure");
}
});
}
</script>
here i am not getting any responce either success message r failure message. please help me
You can try updating these attributes more:
data: JSON.stringify(postData),
dataType: "json",
Try using by the following its works fine.if it not works let me know.
<script src="../Scripts/jquery-1.4.1.js" type="text/javascript"></script>
<script src="../Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
function login() {
var postData = {
"UserName": "user#gmail.com",
"Password": "123",
"RememberMe": true
};
$.ajax({
url: "ChangePasswordSuccess.aspx",
type: "POST",
data: postData,
success: function (Data) {
alert("success");
},
error: function () {
alert("Failure");
}
});
}
</script>
Try This, you might get benefit from xhr.status
$.ajax({
cache: !1,
type: "POST",
data: $.toJSON(c),
contentType: "application/json; charset=utf-8",
url: e,
success: function (a) {
doStuff(a)
},
error: function (xhr, ajaxOptions, thrownError) {
alert(ajaxOptions);
alert(thrownError);
alert(xhr.status);
}
});
Note a is json response of request made to url e While c is data to be posted to the url.
Your URL is not valid !
compelete url property of ajax request and test again.

Categories

Resources