New to Sencha, I am using the following code to try to get JSON data. For some reason, it returns null, yet I know the URL is returning values, as I am using it in another project.
// Make the JsonP request
Ext.data.JsonP.request({
url: 'http://xxx.azurewebsites.net/login',
crossDomain: true,
type: "GET",
dataType: "json",
callbackKey: 'jsoncallback',
callback: function(successful, data ) {
alert( JSON.stringify(data) );
}
});
Can someone please point out what I am missing.
You need to add scope:this property to call callback function, try like this.
Ext.data.JsonP.request({
url: 'http://xxx.azurewebsites.net/login',
crossDomain: true,
type: "GET",
dataType: "json",
callbackKey: 'callback',
scope: this,
callback: function (response, value, request) {
var result = Ext.decode(response.responseText);
alert(result.propertyName);
}
});
Related
I am working on a small web application which simplifies the process of creating and populating USPTO IDS forms by accessing data from another server. For accessing data I am using this API - http://ops.epo.org/3.1/rest-services/published-data/publication/epodoc/US9623902/biblio.js.
I am doing this with angular and hence I used $http but it is throwing error 500 (Internal Server Error). while doing it with ajax-request, its working fine. In fact any other method like $.get() instead of ajax throwing the same error, even I used ng-resource get method but no help. I am not getting what I am doing wrong.
Here are my codes -
$.get( "http://ops.epo.org/3.1/rest-services/published-data/publication/epodoc/US9623902/biblio.js",
function( data ) {
vm.inventors = data['ops:world-patent-data']['exchange-documents']['exchange-document']['bibliographic-data']['parties']['inventors']['inventor'];
console.log(vm.inventors);
});
var req = {
method: 'GET',
url: 'http://ops.epo.org/3.1/rest-services/published-data/publication/epodoc/US9623902/full-cycle.js',
};
$http(req).then(function(response){
console.log(response);
}, function(response){
console.log(response);
});
Both of these codes are throwing error 500. Here is the image
while this code is working fine. But here I am getting an issue of page load, the page is loaded before data is bound to $scope and hence not showing on the page.
$.ajax({
url: 'http://ops.epo.org/3.1/rest-services/published-data/publication/epodoc/' + 'US9623902' + '/biblio.js',
type: 'GET',
dataType: "jsonP",
success: function(data) {
vm.inventors = data['ops:world-patent-data']['exchange-documents']['exchange-document']['bibliographic-data']['parties']['inventors']['inventor'];
console.log(vm.inventors);
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
vm.errorContent = [{
heading: "Error",
description: "Could not load json data "
}];
return false;
}
});
Image of successful result
Any help would be appreciated. Thank you.
if you are using x-www-form-urlencoded as header, you might need to transform your request.
var req = {
method: 'GET',
url: 'http://ops.epo.org/3.1/rest-services/published-data/publication/epodoc/US9623902/full-cycle.js',
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
},
transformRequest: function(obj) {
var str = [];
for(var p in obj)
str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
return str.join("&");
},
};
I didn't get where the problem lies in my "GET" request. But "jsonP" method of $http did solve this issue.
#Sachila - As data is not being sent, the transformation is not required.
I have to send json object as a value with a key.
My Code:
var req = {
method: 'POST',
url: clientAdd_url,
headers: {
'Content-Type': 'application/json'
},
data: {Contact: $scope.clientinfo}
}
Contact is a key and $scope.clientinfo is a json object. But it's not working.
I checked in Postman, the format is like:
{
Contact: {
"BillingDetails": {
"CompanyName": "Shangrila Handicraft Shop",
"Address": "Kamaladi"
},
"ContactDetails": {
"ContactName": "Shyam Shrestha",
"ContactEmail": "shyam#gmail.com",
"ContactPhone": 9808909090
},
"ShippingDetails": {
"ShippingName": "Shangrila Handicraft Shop",
"ShippingAddress": "Kamaladi"
},
"Notes": "Test from Postman"
}
I would be grateful for your help.
place all those in to a obj as below...
$scope.datelvl = { "date": $scope.date, "tanklevel": $scope.Tank_level };
later call to backend controller for method like below:
$.ajax({
type: 'POST',
url: apiUrl + 'yourcontrollername/methodname',
data: datelvl,
contentType: 'application/x-www-form-urlencoded',
dataType: 'json',
success: function (data)
{
}
$scope.clientinfo looks like its a JSON object. By what I understand from your question, looks like you want to send $scope.clientinfo as a string. For that you could convert the JSON object to a string using the JSON.stringify
data: {"Contact": JSON.stringify($scope.clientinfo)}
see: http://www.json.org/js.html
Try this.It might useful.
angular.module('appCtrl1', []).controller('AppCtrl',function($scope,$http){
var tempData = {"Contact": $scope.clientinfo};
$http({
method: 'POST',
url: serverURL,
headers: { "Content-Type": "application/json" },
data: tempData,
}).success(function(data, status, headers) {
console.log(data);
}).error(function(data, status, headers) {
console.log(data);
});
}
Thank you everyone. I was told to send json data with a key as I have stated the original format though it has been little edited. So I was having a hard time. I have used the normal json post of angular in my projects. But since it was not the json, I could not send data through any process. I think many of you didn't get my question. But anyway I am so much thankful for your concern. This problem is solved. They made changes in their end.
My code is as the following:
var response = $http({
method: 'post',
withCredentials: true,
dataType: "json",
data: JSON.stringify(payload),
headers: {
'Content-Type': 'application/json; charset=utf-8',
},
url: url
});
where payload looks like this:
{"CASEID":3,"CASENUMBER":"ANY ","TITLE":"ANY "}
Backend code:
public CL_CASE Post([FromBody]CL_CASE value)
{....
When running it as it's shown value is null.
If I change headers to 'Content-Type': 'application/x-www-form-urlencoded' then I do get value but with properties equal to null/0 . What am I doing wrong?
Thanks
You don't need to call JSON.stringify. This results in sending a string to the server, not an object. And since the WebAPI model binder is expecting a CL_CASE object, it has no way to populate that object from just a string.
Simply send the object itself:
data: payload
To be honest, I don't think you need the headers option at all in this case either. Let the default functionality handle it:
$http({
method: 'post',
withCredentials: true,
dataType: 'json',
data: payload,
url: url
})
On the server side I have a method that accepts an array of integers and returns a Json object:
public JsonResult GetCorrespondingOfficers(int[] categories){
//use `categories`
return Json(model,JsonRequestBehavior.AllowGet);
}
And I have the following script on the client:
var categories=[1,2,3];
$.ajax({
url: url,
type: 'GET',
data: { categories: categories },
contentType: 'application/json; charset=UTF-8',
dataType: 'json',
success: function (data) { alert('Success');},
async: false
});
When I run the above code I get null for the parameter categories on the server side. If I change the method from GET to POST, then it works. Does it mean that I can't send an array or any Json data with GET request? If not, then what's the problem with my code?
You can send array as a string:
...
data: { categories: JSON.stringify(categories) },
...
GET request does not have message body, so you can't use GET with contentType: 'application/json; charset=UTF-8'. When you use json in GET request, browser breaks your json and append each josn key value to the url(even if you use JSON.stringify method). Therefore for using json and REST you need to use POST method.
I am having some trouble fetching a collection. I'm using the console's network inspector to see if I can figure out what's wrong and the only thing I see is the format of the Request Payload.
When making a .fetch() the Request Payload is being sent in this format:
query=this+is+my+query
This returns a 400 Bad Request status from my server. I have tested using:
$.ajax({
contentType: 'application/json',
async : false,
type:'POST',
url: '/search',
data: JSON.stringify({"query":"this is my query"}),
dataType: 'json',
success: function(data) {
alert('yup');
},
error: function(data) {
alert('nope');
}});
which returns my data as expected. In this case the Request Payload is in this format:
{"query":"enterprise search is gonna rock","scope":null}
I've tried passing in headers with my fetch:
my_results.fetch({data:{"query":"this is my query"}, type: 'POST', dataType: 'json', contentType: 'application/json'});
Here is what my Model and Collection look like:
EnterpriseSearch.Result = Backbone.Model.extend();
EnterpriseSearch.Results = Backbone.Collection.extend({
model: EnterpriseSearch.Result,
url: "/search"
});
Any help would be appreciated.
Try using data: JSON.stringify({"query":"this is my query"}) in your fetch options, just like you do when using $.ajax. jQuery will default to application/x-www-form-urlencoded for form data.