We Keep Coding

How can I check if there are changes in my database

What I want is a technique to refresh my div if there are changes in my database. Here is the point,
What i want: How can i condition to know if the first value from my database is lesser than the upcomming value.
In my situation, i put my ajax function to be run every 5secs here is it:
lastcountQueue is declared as global in javascript
function check_getqueue() {
$.ajax({
url: siteurl+"sec_myclinic/checkingUpdates/"+clinicID+"/"+userID,
type: "POST",
dataType: "JSON",
success: function(data) {
lastcountQueue = data[0]['count'];
}
});
}
Q:where would i put the condition something if lastcountQueue < data[0]['count]; condition means something if the data is lesser than lastcountQueue it means there was a change in my database portion.
Another Clear Situation for my question:
I want to make a function like these: the ajax will run every 5 seconds where it query a value to count my no. of queues in database. If my first query is giving me 5 value, and the second is giving me again another 5, then there must be nothing change happens, then if my third value gives me 4, where it is not equal to the last query, then i would do something

Probably something like this:
function check_getqueue() {
$.ajax({
url: siteurl+"sec_myclinic/checkingUpdates/"+clinicID+"/"+userID,
type: "POST",
dataType: "JSON",
success: function(data) {
var tmpCountQ = data[0]['count'];
if (tmpCountQ < lastcountQueue) {
// Process the change
}
lastcountQueue = tmpCountQ;
}
});
}

Here is the updated answer:
function check_getqueue() {
$.ajax({
url: siteurl + "sec_myclinic/checkingUpdates/" + clinicID + "/" + userID,
type: "POST",
dataType: "JSON",
success: function(data) {
if (data[0]['count'] != lastcountQueue) {
//Your logic here
lastcountQueue = data[0]['count'];
}
}
});
}

JQuery UI Autocomplete sometimes doesn't show all the results

I am using JQuery UI for autocompletion where I take input and ping a server with that input and end create an array to be given to the source of autocomplete. Right now it works perfect sometimes, but when i print the people array sometimes not all the source data shows up on the screen that is shown in console.
let input =$("<input type='text'/>")
.appendTo('#dynamic-form-elements');
input.autocomplete({
source: [] // Initially empty
}).on('input', function () {
$.ajax({
url: "https://lookmeup/json/person/" + input.val(),
dataType: "json",
success: function (parsed_json) {
let people = [];
let results = parsed_json.data;
for (i = 0; i < results.length; i++) {
people.push(results[i][1])
}
console.log(people)
input.autocomplete('option', 'source', people);
}
});
})

You need to include the "minLength:" attribute in the autocomplete so it waits til you hit the minimum length before it performs the ajax.
You can see this in use here:
https://jqueryui.com/autocomplete/#remote-jsonp
The final code should look like this:
input.autocomplete({
source: function(req, response) {
$.ajax({
url: "https://lookmeup/json/person/" + req.term,
dataType: "json",
success: function (parsed_json) {
// do the stuff here and call response callback
}
});
},
minlength: 3
})

You should do this, use source as function: https://jqueryui.com/autocomplete/#remote
input.autocomplete({
source: function(req, response) {
$.ajax({
url: "https://lookmeup/json/person/" + req.term,
dataType: "json",
success: function (parsed_json) {
// do the stuff here and call response callback
}
});
}
})

Javascript scope when using ajax post and functions in general

I'm relatively new to javascript, and I have a restful api I'm connecting to that returns me a json string, which I can parse properly like so:
$.ajax({ url: './php/bandwidth.php',
data: { prop_id : "1" },
type: 'post',
success: function(output) {
var json = $.parseJSON(output);
for( var i = 0 ; i < json.response.length; i++ ){
times.push (json.response[i].time);
}
}
});
Inside of the success callback the variables in the array exist. I also have times array instantiated outside the ajax call function. But outside of the ajax call the array is empty. I'm sure it's a scoping issue. Can anyone give me a way to get the data from inside the array? Does the construct $.ajax({url:... , data:... , success: function(){}}); returns callback return value?

$.ajax({ url: './php/bandwidth.php',
data: { prop_id : "1" },
type: 'post',
dataType: 'json',
success: function(output) {
times = [];
for( var i = 0 ; i < output.response.length; i++ ){
times.push (output.response[i].time);
}
},
complete: function(){
if(times.length > 0){ console.log(times); } else { console.log("times empty"); }
}
});

Proper way to loop jQuery ajax and pass arguments

I want to solve once for all the problem of looping ajax request and passing 'index' into it (the problem below):
for (var index = 0; index < 4; index++) {
$.ajax({
url: 'http://graph.facebook.com/',
dataType: 'jsonp',
success: function(json) {
console.log(json[index]);
}
});
}
in this code within every 'success' callback 'index' will be 3. But I want to invoke callback with 0, 1, 2, 3. Many people are placing ajax request within a closure:
for (var index = 0; index < 4; index++) {
(function(index){$.ajax({
url: 'http://graph.facebook.com/',
dataType: 'jsonp',
success: function(json) {
console.log(json[index]);
}
});
})(index);
}
what in my opinion is a huge mistake - what if the request won't be there at the time? Than 'json' variable will be 'undefined'.
Does any of You guys have some proper way to solve this issue?

Actually the JSON will not be undefined.
If you would break the following code apart it would become more clear:
So instead of this:
for (var index = 0; index < 4; index++) {
(function(index){$.ajax({
url: 'http://graph.facebook.com/',
dataType: 'jsonp',
success: function(json) {
console.log(json[index]);
}
});
})(index);
}
...you can also write it like this:
function myFunction(index) {
$.ajax({
url: 'http://graph.facebook.com/',
dataType: 'jsonp',
success: function(json) {
console.log(json[index]);
}
});
}
// and call it like this
for (var index = 0; index < 4; index++) {
myFunction(index);
}
As you might already see, how are any of those two variables going to change by another call while they are defined inside the function?
(On a side note: I think it actually looks cleaner this way)

JQuery reverse each() with find()

I know this kind of question has been asked before, but the general solution of
$($("input").get().reverse()).each(function() { /* ... */ });
is not working for me. I have an xml document that contains a list of concerts that I'd like to display on a webpage. So, in JQuery:
$.ajax({
type: "GET",
url: "concerts.xml",
dataType: "xml",
cache: false,
success: function(xml) {
$(xml).find('concert').each(function() {
/*do stuff*/
});
}
});
However, I'd like to display the concerts in reverse order. So, I tried the following, but it did not work:
$.ajax({
type: "GET",
url: "concerts.xml",
dataType: "xml",
cache: false,
success: function(xml) {
$($(xml).find('concert').reverse()).each(function() {
/*do stuff*/
});
}
});
Any assistance would be much appreciated. Thanks.

You excluded the call to the get()[docs] method.
// --------------------v
$($(xml).find('concert').get().reverse()).each(function() {
This is needed to get an Array of the elements from the jQuery object. This is what allows you to call .reverse(), which is on Array.prototype.

To walk through the items in reverse order, why not just use code like this:
var data = $("input");
for (var i = data.length - 1; i >= 0; i--) {
var item = data[i];
// do whatever you want to do with item here
}
Or, if you want to make a function out of it that takes a jQuery object and your function:
function reverseEach(jQueryObj, fn) {
for (var i = jQueryObj.length - 1; i >= 0; i--) {
if (fn.call(jQueryObj[i], i, jQueryObj[i]) === false) {
break;
}
}
}
So, you could then call:
reverseEach($(xml).find('concert'), function() {
// do stuff here
});
or:
reverseEach($("input"), function() {
// do stuff here
});
Or, you could even make reverseEach a jQuery plugin if you wanted.