How to return result from function that has an $.ajax call - function

I'll say right off the bat that this question seems to address the same situation, but for the life of me I'm not seeing what the solution/answer is there. Perhaps someone just needs to "spell it out" more clearly for me!
I have the following function:
function CheckIfUrlExists(checkUrl) {
var exists = '';
$.ajax({
type: 'POST',
url: '../scripts/branchAdmin.php',
data: {checkUrl: checkUrl},
cache: false,
success: function(response) {
console.log('response: ' + response);
if (response === 'true') {
exists = 'true';
} else if (response === 'false') {
exists = 'false';
}
},
error: function(response) {
// return false and display error(s) from server
exists = 'false';
}
});
console.log('exists: ' + exists); // always displays empty string, regardless of what the php script returns
return exists;
}
And I'm calling it with this:
var exists = CheckIfUrlExists($tr.find('input.editUrl').val());
if (exists === 'false') {
//if (!CheckIfUrlExists($tr.find('input.editUrl').val())) {
// New URL entered, verify user want to save it
$('#confirmAddNewUrlDialog').data('row', $tr).dialog('open');
... // code to handle result
}
How can I get the "CheckIfUrlExist() function to return a true or false (or any value for that matter) so I can use it in the above code?

Make the ajax call async option to false. then you'll get the result.
see the link https://stackoverflow.com/a/1531710/399414
$.ajax({
type: 'POST',
async: false,
url: '../scripts/branchAdmin.php',
...

Related

ajax json parsing to return related values

I am trying to only parse the information related to a certain "market_name" however I cannot seem to figure out how. The api is located at https://stocks.exchange/api2/ticker which displays information related to the entire exchange. I simply need all of the information returned relating to the "market_name" I am searching for such as ETH_BTC
Ajax:
$.ajax({
url: "https://stocks.exchange/api2/ticker",
dataType: 'json',
success: function(data) {
last = data.last;
console.log(last);
$("#btcprice").text(last);
},
error: function() {
//alert("Was unable to get info!");
}
});
That's because data is an array of objects, not a single object.
Try:
$.ajax({
url: "https://stocks.exchange/api2/ticker",
dataType: 'json',
success: function (data) {
// find object
var market = data.find(function (obj) {
return obj.market_name == 'ETH_BTC';
});
$("#btcprice").text(market.last);
},
error: function() {
//alert("Was unable to get info!");
}
});
Use array filter() method to filter out the record having market_name as ETH_BTC.
array.filter(obj => {
return obj.market_name == 'ETH_BTC'
});
DEMO
var jsonObj = [{"min_order_amount":"0.00000010","ask":"0.00000017","bid":"0.0000001","last":"0.00000010","lastDayAgo":"0.00000009","vol":"154955.9586604","spread":"0","buy_fee_percent":"0","sell_fee_percent":"0","market_name":"ATR_BTC","market_id":338,"updated_time":1527789301,"server_time":1527789301},{"min_order_amount":"0.00000010","ask":"0.000032","bid":"0.000012","last":"0.00003200","lastDayAgo":"0.000065","vol":"372.5011152","spread":"0","buy_fee_percent":"0","sell_fee_percent":"0","market_name":"ETH_BTC","market_id":35,"updated_time":1527789301,"server_time":1527789301},{"min_order_amount":"0.00000010","ask":"0.00003595","bid":"0.00003","last":"0.00003000","lastDayAgo":"0.00003001","vol":"26.44435669","spread":"0","buy_fee_percent":"0","sell_fee_percent":"0","market_name":"ARDOR_BTC","market_id":262,"updated_time":1527789301,"server_time":1527789301}];
var res = jsonObj.filter(obj => {
return obj.market_name == 'ETH_BTC'
});
console.log(res);
$.ajax({
url: "https://stocks.exchange/api2/ticker",
dataType: 'json',
success: function(data) {
var results = [];
var searchField = "market_name";
var searchVal = "ETH_BTC";
for (var i=0 ; i < data.length ; i++)
{
if (data[i][searchField] == searchVal) {
results.push(data[i]);
}
}
$("#btcprice").text(results[0].last);
},
error: function() {
//alert("Was unable to get info!");
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Here is a simple code in which you find what you want simply just change searchVal statically or dynamically according to your need......

Nested AJAX call in React redux

So I'm working on some demoware and I have two AJAX calls, the first is just a last modified date, to let me know whether to fetch data from the second. This works, but I feel like there's a smarter way to do this for real applications, and I'm just a UI monkey trying to come up in the world, any advice is much appreciated.
componentDidMount() {
this.getJson();
setInterval(this.getJson.bind(this), 1000);
}
getJson() {
const el = this;
const isModified = (date) => {
let mod = false;
if (this.state.lastModified == date) {
console.log('no change');
} else {
mod = true;
console.log({
'previously modified': this.state.lastModified,
'newly modified': date
});
el.setState({lastModified: date});
}
return mod;
}
this.serverRequest = $.ajax({
url: 'URL_LAST_MODIFIED',
success: function(result) {
const lastModified = $.parseJSON(result).LastModifiedDateTime;
if (isModified(lastModified)) {
$.ajax({
url: 'URL_DATA',
success: function(result2) {
const result2Obj = $.parseJSON(result2);
el.setState({data: result2Obj});
},
error: function(xhr, status, err) {
alert(err.toString());
}
})
}
},
error: function(xhr, status, err) {
}
});
}
I think it is realted to this:
https://github.com/reactjs/redux/issues/1676
The idea is create a action for the first ajax call... and on success dispatch another action to execute the second call.

Passing a parameter along with callback?

This is my code:
var title = 'test'
function onlineStatus(callback){
$.ajax({
url: "https://blabla,
cache: false,
success: callback
});
onlineStatus(function(test) {
// doing stuff with `test`
$('#forTest').attr('title', title);
});
The problem is that the onlineStatus call doesn't see title, which is correct, because it is out of scope. Is there a way to pass it into the function, so that the title is seen?
function statusCheck (test) {
console.log(test);
}
function onlineStatus (callback) {
callback (arguments[1]);
}
onlineStatus (statusCheck, "test");

Javascript: How to test if response JSON array is empty

I'm getting back the following JSON:
{"array":[],"object":null,"bool":false}
And I'm testing it with the following, seemingly exhaustive, if statement:
$.ajax({
type: "GET",
url: "/ajax/rest/siteService/list",
dataType: "json",
success: function (response) {
var siteArray = response.array;
// Handle the case where the user may not belong to any groups
if (siteArray === null || siteArray=== undefined || siteArray=== '' || siteArray.length === 0) {
window.alert('hi');
}
}
});
But the alert is not firing. :[
Use $.isArray() to check whether an object is an array. Then you can check the truthness of the length property to see whether it is empty.
if( !$.isArray(siteArray) || !siteArray.length ) {
//handler either not an array or empty array
}
Two empty arrays are not the same as one another, for they are not the same object.
var a = [];
if (a === []){
// This will never execute
}
Use if (siteArray.length==0) to see if an array is empty, or more simply if (!siteArray.length)

jquery validation onSubmit ajax post JSON response

I have a very complicated post using jquery validation and an AJAX post that gets a JSON response back from the server and puts it in a jqGrid... But it seems as though my onsuccess is never being called at any point...
$(document).ready(function () {
$("#formSearchByMRN").validate({
rules: {
MRN: { required: true, minLength: 6 }
},
messages: {
MRN: 'Please Enter a Valid MRN'
},
submmitHandler: function (form) {
e.preventDefault();
animateLoad();
debugger;
var theURL = form.action;
var type = form.methd;
var data = $(this).serialize();
$.ajax({
url: theURL,
type: type,
data: data,
dataType: "json",
success: function (result) {
debugger;
var data = result;
if (data.split(':')[0] == "Empty record") {
$("#list").unblock();
$('#resultDiv').html('<b><p style="color: #ff00ff">' + data + '</p></b>');
setTimeout(function () {
$('#resultDiv').html("");
}, 10000);
}
else {
binddata(data);
}
}
});
return false;
}
});
});
It would seem I never get into the submmitHandler. Event though I manage to get to my server side function and it does return, it prompts my UI to save a file which contains the JSON results...
No good.
Am I going about validating my form before my AJAX post the wrong way? Does anybody have any advice about best practices in validating AJAX posts?
UPDATE... MARK R. This is what I attempted. It seems as though I never get in to the success function... My suspicion is that I am not really posting via ajax, but instead doing a full post. I don't understand why.
$('#submitMRN').click(function () {
$("#formSearchByMRN").validate({
rules: {
MRN: { required: true, minLength: 6 }
},
messages: {
MRN: 'Please Enter a Valid MRN'
}
});
if ($('#submitMRN').valid()) {
$("#list").block({ message: '<img src="../../Images/ajax-loader.gif" />' });
$.ajax({
url: $('#submitMRN').action,
type: $('#submitMRN').method,
data: $('#submitMRN').serialize(),
dataType: "json",
success: function (result) {
debugger;
var data = result;
if (data.split(':')[0] == "Empty record") {
$("#list").unblock();
$('#resultDiv').html('<b><p style="color: #ff00ff">' + data + '</p></b>');
setTimeout(function () {
$('#resultDiv').html("");
}, 10000);
}
else {
binddata(data);
}
}
});
}
});
$('#SubmitButton').click(function (){
//Check that the form is valid
$('#FormName').validate();
//If the Form is valid
if ($('#FormName').valid()) {
$.post(...........
}
else {
//let the user fix their probems
return false;
}
});//$('#SubmitButton').click(function (){