How to invoke another function using a parameter fetched JSON result of API call from AJAX - ajax

I Have to get ParentId from this function using JSON result and then invoke another function given below after this function:
public fetchLibraryDatafromSharePointList(clientID:string) {
debugger;
const reactHandler = this;
jquery.ajax({
url: `${this.props.siteurl}/_api/web/lists/getbytitle('MSAs')/items?$filter=ClientID eq '${clientID}'&$orderby=Modified desc`,
type: "GET",
headers:{'Accept': 'application/json; odata=verbose;'},
success: function(resultData2) {
reactHandler.setState({
items: resultData2.d.results
});
},
error : function(jqXHR, textStatus, errorThrown) {
}
});
}
Below is the function which has to be invoked on the success of above API and the parameter is coming in the JSON result of the previous call made:-
SetState is done by reactHandler variable
public fetchDatafromSharePointList(ParentID) {
debugger;
const reactHandler = this;
jquery.ajax({
url:`${this.props.siteurl}/_api/web/lists/getbytitle('MSASummaries')/items?
$filter=Parent eq ${ParentID}$top=1&$orderby=Modified desc`,
type: "GET",
headers:{'Accept': 'application/json; odata=verbose;'},
success: function(resultData) {
/*resultData.d.results;*/
reactHandler.setState({
items: resultData.d.results
});
},
error : function(jqXHR, textStatus, errorThrown) {
}
});
}

You can invoke another function in the success response of fetchLibraryDatafromSharePointList(clientID:string) after updating state. i.e:
reactHandler.setState({
items: resultData2.d.results
}, ()=>{
fetchDatafromSharePointList(your_parent_id_goes_here);
});

Related

.NET 6 (Core) MVC application - problem with ajax call

.NET 6 (Core) MVC application. In view I have:
$("#mybtn").click(function () {
$.ajax({
type: "POST",
url: "/MyController/GetCustomer",
data: JSON.stringify({ 'id': 5 }),
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response, textStatus, xhr) {
alert(response);
},
error: function (xhr, textStatus, errorThrown) {
alert(textStatus);
}
});
});
and in controller:
[HttpPost]
public JsonResult GetCustomer(int? id) {
if (id == null) {
Response.StatusCode = (int)HttpStatusCode.BadRequest;
return Json(new { msg = "Error in the request." });
}
var customer = _db.Customers.Find(id);
return Json(customer);
}
It gets to the action method in controller, but the id is always null...
What am I doing wrong?
It gets to the action method in controller, but the id is always
null... What am I doing wrong?
To begin with, you don't need to use JSON.stringify({ 'id': 5 }) as { 'id': 5 } already in json format. In addition, contentType: "application/json; charset=utf-8", is uncessary as well, Instead, you can do as following:
Correct Format:
$("#mybtn").click(function () {
$.ajax({
url: "/MyController/GetCustomer",
type: "POST",
data: { 'id': 5 },
dataType: "json",
success: function (response, textStatus, xhr) {
alert(response);
},
error: function (xhr, textStatus, errorThrown) {
alert(textStatus);
}
});
});
Note: You are getting null in your controller because of using contentType: "application/json; charset=utf-8", and additional, Json parsing here JSON.stringify() these are only valid when you are sending parameter as object fashion. Just get rid of those two part, you are done.
Output:

Ajax - Parse oData Response

I have an ajax call that gets data from a REST api.
$.ajax({
url: "http://localhost:52139/odata/WEB_V_CIVIC_ADDRESS",
data: { enteredText: "'" + $('#addressTextField').val() + "'" },
type: "GET",
dataType: 'json',
ContentType: "application/json",
success: function (data) {
alert(JSON.stringify(data));
response($.map(data.accountaddressList, function (item) {
return {
item: item.civicaddress,
value: item.accountNumber,
label: item.civicaddress
}
}));
},
error: function (data, xml, errorThrown) {
alert('Error loading address list: ' + errorThrown);
}
});
The odata returned from that call looks like:
{
"#odata.context":"http://localhost:52139/odata/$metadata#WEB_V_CIVIC_ADDRESS/AValues.Classes.Entities.AccountAddress","value":[
{
"#odata.type":"#AValues.Classes.Entities.AccountAddress","accountNumber":88887,"rowNumber":0,"civicaddress":"123 Fake St"
},{
"#odata.type":"#AValues.Classes.Entities.AccountAddress","accountNumber":88888,"rowNumber":0,"civicaddress":"321 Faker St"
}
]
}
So the current code throws an 'Undefined' error on the line: response($.map(data.accountaddressList, function (item) {
How do I map the 'civicaddress' and 'accountNumber' from each value in the odata response to 'item'?
Thanks.
I got it, needed to change it to response($.map(data.value, function (item)

Empty data result ajax with codeigniter

I'm trying to retrieve data from my controller function but this very simple example fails and sends me nothing back. The ajax function is successfully executed but the data is empty.
function company_select() {
var data;
var username = $('[name="username"]').val();
var url = base_url+'/admin/user/get_companies2';
alert(url);
$.ajax({
url: url,
type: 'POST',
dataType: 'text',
success: function(data){
alert(data);
},
error: function(jqXHR, textStatus, errorThrown) { alert(textStatus + " " + errorThrown) }
});
}
codeigniter function
public function get_companies2(){
echo 'test';
}
You Should Use "data" instead of "dataType" Or Passed your require variables one by one as into curli braces of data (as data:{variable1:})
function company_select(){
var data;
var username = $('[name="username"]').val();
var url = base_url+'/admin/user/get_companies2';
alert(url);
$.ajax({
url: url,
type: 'POST',
data: {username :username},
success: function(data){
alert(data);
},
error: function(jqXHR, textStatus, errorThrown) { alert(textStatus + " " + errorThrown) }
});
}

How to load a file using AJAX once and use its data multiple times?

I have this code where I load an XML file through AJAX:
$("#list").on("click", "li", function (event) {
$.ajax({
url: 'test.xml',
type: "get",
context: this,
success: function (data) {
alert("success");
},
error: function () {
alert("failure");
}
});
})
The issue is that I have a long list of clickable elements that use this code which is not very efficient. Is there a way to call AJAX function once and then use the data produced for other items on the list?
Just save the return value somewhere
$("#list").on("click", "li", function (event) {
var data = $("#list").data('test');
if (data){
//use data
}
else{
$.ajax({
url: 'test.xml',
type: "get",
context: this,
success: function (data) {
$("#list").data('test', data);
// use data
alert("success");
},
error: function () {
alert("failure");
}
});
}
})

AJAX Internal server error

I couldnt find out what is the error.
<script type="text/javascript">
$(document).ready(function () {
$("#btnsumbit").click(function (e) {
e.preventDefault();
$.ajax({
type: 'POST',
data: '{"username":"' + $("input#txtuser").val() + '","password":"' + $("input#txtpwd").val() + '"}',
url: 'http://localhost:53179/hdfcmobile/WebService.asmx/Login_Data',
contentType: 'application/json; charset=utf-8',
dataType: 'json',
success:
function (data, textStatus, XMLHttpRequest) {
var status = data.Status;
alert(data.d);
},
error:
function (XMLHttpRequest, textStatus, errorThrown) {
alert(textStatus);
}
});
});
});
</script>
I am getting 500 internal server error.How to call this webservice.I have passes the method with the url.Thanks for any help...
First thing, the way you are sending is wrong, send it like this
data: {
"username": $("input#txtuser").val(),
"password": $("input#txtpwd").val()
}
Next make sure, url: http://localhost:53179/hdfcmobile/WebService.asmx/Login_Data is returning JSON output.

Resources