/    Sign up×
Community /Pin to ProfileBookmark

What is AJAX… the big picture

Copy linkTweet thisAlerts:
Dec 18.2013

Probably the wrong place to post this, and if so I apologize. I’m just trying to get a handle on what AJAX is, what it could do for me, and based on my current skills the bast way to learn about it. On that last point, I’ve maintained some huge and yet very primitive websites. But it started way back at a time when scripting was a nightmare. I think i got in right around the time Netscape 4 and IE 4 were the predominate browsers, and each version was taking their DOMs in significantly different directions. Building a library was almost futile, because each new browser version would break your interface to the DOM. For example, below was a test example I wrote for a long gone employer to demonstrate how a human-machine interface (HMI) for an electric substation could be done using a browser rather than a custom graphics application.

[url]http://elfintechnologies.com/html_hmi/hmi_tst1.htm[/url]

Unfortunately if you look at this in anything but IE, it won’t do anything anymore. In fact I’m shocked it still works in IE! Now this was just a demo to prove that screen control and display features could be altered without re-loading entire pages. But it still had no server side feeds. The data changing you see is just random number generators. Had my employer had any interest, my only prospect for server side communication would have been to write a JAVA applet, using something called a shared byte array object to exchange data with a server. Then, since Java can interact with javascript variables, I’d be able to complete the connection. The whole thing seemed like a daunting task.

So lately, as I’ve joined the ranks of the unemployed again, I’m trying to sharpen my skills, and I’ve seen AJAX come up again and again in employer requirements. And looking further, it SEEMS (big word) that AJAX might be a solution to such server to browser interaction, with methods I would NOT have to write or invent from scratch. Further, I get the impression that AJAX is both a javascript based methodology, and that in modern browsers, the DOMs have at least become sufficiently unified so that compatibility is much less a problem than it once was.

But maybe I have a totally wrong idea what AJAX is about, and maybe its completely the wrong tool for writing such HMIs? I am been more of an electronics and embedded systems engineer for the past decade, and I’ve obviously completely lost touch with web technology. So all pointers and advise is much appreciated.

to post a comment
JavaScript

23 Comments(s) ↴

Copy linkTweet thisAlerts:
@mogulmanDec 18.2013 — I'll give my take on AJAX. I have developed numerous PC apps that interface with databases and create numerous reports. One problem is they only run on the PC not Macs, tables or other devices and they have to be installed and updated. I was looking to see if I could duplicate the app behavior using HTML5, CSS3, Javascript, jQuery, AJAX and PHP. I did not want numerous HTML pages. I wanted one HTML page and all the data to be update using AJAX. I was able to achieve almost identical behavior to the PC app. jQuery has made AJAX simple to do. AJAX is asynchronous. You need to figure out how to handle this. For example, I had numerous form items I needed to initialize from the database so I issued numerous AJAX requests. The order the data returned is not predictable. What I ended up doing is to write a recursive AJAX function so the requests happen sequentially. I even use AJAX to create the Word and PDF reports. I send an AJAX request to the server. The server creates the report and the AJAX request returns links to the reports. So in my experience AJAX helps you duplicate the typical desktop app experience.
Copy linkTweet thisAlerts:
@PeterPan_321authorDec 18.2013 — I'll give my take on AJAX. I have developed numerous PC apps that interface with databases and create numerous reports. One problem is they only run on the PC not Macs, tables or other devices and they have to be installed and updated. I was looking to see if I could duplicate the app behavior using HTML5, CSS3, Javascript, jQuery, AJAX and PHP. I did not want numerous HTML pages. I wanted one HTML page and all the data to be update using AJAX. I was able to achieve almost identical behavior to the PC app. jQuery has made AJAX simple to do. AJAX is asynchronous. You need to figure out how to handle this. For example, I had numerous form items I needed to initialize from the database so I issued numerous AJAX requests. The order the data returned is not predictable. What I ended up doing is to write a recursive AJAX function so the requests happen sequentially. I even use AJAX to create the Word and PDF reports. I send an AJAX request to the server. The server creates the report and the AJAX request returns links to the reports. So in my experience AJAX helps you duplicate the typical desktop app experience.[/QUOTE]

OK, that's good information! So it sounds almost like Ajax can be compared to UDP datagrams as opposed to TCP, in the sense that there is no automated ordering of packets (though hopefully there is at least guaranteed delivery and retry mechanisms). So if synchronization is an issue, it sounds like you have to have hidden fields in the database where timestamps or event record numbers are kept. Literally like building your own protocol! Hmmm... something to chew on!

So once you migrated this application from the PC to a web based app, did you have to switch to a more universal database like maybe PostGress? I'm a bit behind here too! last time I had to work with PC based databases on the programming level, it was an Access database, using a somewhat painful interface microsoft called "Jet" (Though it certainly a bit slow to have such a boastful name). I suppose you were using SQL?
Copy linkTweet thisAlerts:
@rtretheweyDec 18.2013 — At its root, AJAX is a mechanism that allows JavaScript applications to interact with the web. You can use it to allow your scripts/pages to communicate with external data sources via HTTP requests in order to create interactive, dynamic web pages. And JavaScript is as adept as any programming language in its ability to parse the data it receives, so you're not necessarily limited to accessing resources that were specially designed to be used this way. Beyond that, it's up to you as to what you can do with it.
Copy linkTweet thisAlerts:
@mogulmanDec 18.2013 — There is no need to use timestamps. When AJAX returns the first result I process it and then call the same AJAX routine again using the next item I need. It is really simple. This is an intranet app for a small company. I do use SQL. Since the desktop app uses Access I still use the same Access db. I use PHP and connect using ODBC. So far it works reliably and fast. I may switch to SQL Server if I have problems. The hardest part of this was figuring out how to write Javascript in an object oriented way. I am new to Javascript. I basically created a 'class' to navigate each table. Lookup a book called Object-Oriented Javascript. Very helpful.
Copy linkTweet thisAlerts:
@rootDec 18.2013 — There is no need to use timestamps. When AJAX returns the first result I process it and then call the same AJAX routine again using the next item I need. It is really simple. This is an intranet app for a small company. I do use SQL. Since the desktop app uses Access I still use the same Access db. I use PHP and connect using ODBC. So far it works reliably and fast. I may switch to SQL Server if I have problems. The hardest part of this was figuring out how to write Javascript in an object oriented way. I am new to Javascript. I basically created a 'class' to navigate each table. Lookup a book called Object-Oriented Javascript. Very helpful.[/QUOTE]

'scuuuuuze me ?

"I process it and then call the same AJAX routine again using the next item I need." -- Impossible, You have to make a NEW ajax object for each interaction with the webserver
Copy linkTweet thisAlerts:
@mogulmanDec 18.2013 — Maybe I am not explaining it correctly. I recursively call the function that performs the AJAX request. Here is a simplified version of the code.

[CODE]
NavDb.prototype.getSelData = function () {
var cs, fmField, value, sql, cnt, csv,
$this = this;

cs = this.curSelector;
cnt = this.selectors.length;
if (cs >= cnt) { // check if done
$("#status").html("Initialization complete");
$("body").css("cursor", "default")
return;
}
$.ajax({
url: 'php/select.php',
type: 'POST',
context: this, // Only needed 'this' not this.parentNode.
dataType: 'json',
data: {
'sql': sql
}
}).done(function (data) {
if (data.success) {
if (data.v.length > 0) {
//process data
}
this.curSelector++;
this.getSelData(); // recursive call
}).fail(function (XHR, textStatus, errorThrown) {
$("#status").html(getErrorText(XHR.responseText));
$("body").css("cursor", "default")

})
}
};
[/CODE]
Copy linkTweet thisAlerts:
@rootDec 18.2013 — 
  • 1. thats not JavaScript

  • 2. thats not AJAX
    • Copy linkTweet thisAlerts:
    @mogulmanDec 18.2013 — What do you mean it's not Javascript or AJAX? I used jQuery's AJAX functions. It's running in Chrome/Firefox/IE and it works.
    Copy linkTweet thisAlerts:
    @rootDec 19.2013 — JQuery is written in JavaScript and you may run query after query but it aint JavaScript (in its pure form) nor is it AJAX (in its pure form) which is why you are able to do what you said.

    JQuery is not the best thing to use in script development, it is often the cause of many problems like I am experiencing with my Google Chrome browser, everything was working fine up in til 6 weeks ago and I get JQuery errors galore. Only one problem, I don't use JQuery so I end up having to test my scripts in Opera / FireFox and MSIE because Chrome is having issues with JQuery which I understand is something that runs in the browser.

    A simple example of eggs in one basket, takes one minor **** up and whatever you wrote using JQ, comes tumbling down and you have to wait until google pull their digits out and fix the problem, the other side of the cake is using pure JavaScript, any code problems you debug, it gets fixed and away you go without having to wait for someone to fix the problem and get your development back up and running as expected.

    JQuery == Bad

    JavaScript == Good

    As the saying goes, why reinvent the wheel? Sure you can get plenty of boiler plate that has already been developed but it too has its problems and other frameworks like prototype and moo tools, etc, all have problems from time to time.

    I trust you now understand my comment earlier.
    Copy linkTweet thisAlerts:
    @rootDec 19.2013 — Maybe I am not explaining it correctly. I recursively call the function that performs the AJAX request. Here is a simplified version of the code.

    [CODE]
    NavDb.prototype.getSelData = function () {
    var cs, fmField, value, sql, cnt, csv,
    $this = this;

    cs = this.curSelector;
    cnt = this.selectors.length;
    if (cs >= cnt) { // check if done
    $("#status").html("Initialization complete");
    $("body").css("cursor", "default")
    return;
    }
    $.ajax({
    url: 'php/select.php',
    type: 'POST',
    context: this, // Only needed 'this' not this.parentNode.
    dataType: 'json',
    data: {
    'sql': sql
    }
    }).done(function (data) {
    if (data.success) {
    if (data.v.length > 0) {
    //process data
    }
    this.curSelector++;
    this.getSelData(); // recursive call
    }).fail(function (XHR, textStatus, errorThrown) {
    $("#status").html(getErrorText(XHR.responseText));
    $("body").css("cursor", "default")

    })
    }
    };
    [/CODE]    [/QUOTE]

    Ok... very rough example of an ajax routine to work around browsers without XMLHttpRequest() as a built in function, the create a request module and the return being something that needs to be run as it may be a script, maybe... Total of 12 lines of code Vs JQuery with something like 30 lines of code.

    [CODE]if(typeof XMLHttpRequest!='function'){
    XMLHttpRequest = function(){
    try{ return new ActiveXObject("Microsoft.XMLHTTP");}catch(e){}
    try{ return window.createRequest();}catch(e){}
    return false;
    }
    }

    xmlHttp = new XMLHttpRequest();
    xmlHttp.open("GET","script.php",true);
    xmlHttp.onreadystatechange = function(){ if(xmlHttp.status==200 && xmlHttp.readystate==4) eval(xmlHttp.responseText);}
    xmlHttp.send(null);
    [/CODE]

    If you put the request block in to a function, you can do requests all day.
    Copy linkTweet thisAlerts:
    @arafaat_allahDec 21.2013 — I'll give my take on AJAX. I have developed numerous PC apps that interface with databases and create numerous reports. One problem is they only run on the PC not Macs, tables or other devices and they have to be installed and updated. I was looking to see if I could duplicate the app behavior using HTML5, CSS3, Javascript, jQuery, AJAX and PHP. I did not want numerous HTML pages. I wanted one HTML page and all the data to be update using AJAX. I was able to achieve almost identical behavior to the PC app. jQuery has made AJAX simple to do. AJAX is asynchronous. You need to figure out how to handle this. For example, I had numerous form items I needed to initialize from the database so I issued numerous AJAX requests. The order the data returned is not predictable. What I ended up doing is to write a recursive AJAX function so the requests happen sequentially. I even use AJAX to create the Word and PDF reports. I send an AJAX request to the server. The server creates the report and the AJAX request returns links to the reports. So in my experience AJAX helps you duplicate the typical desktop app experience.[/QUOTE]
    that's good information! So it sounds almost like Ajax can be compared to UDP datagrams as opposed to TCP, in the sense that there is no automated ordering of packets (though hopefully there is at least guaranteed delivery and retry mechanisms). So if synchronization is an issue, it sounds like you have to have hidden fields in the database where timestamps or event record numbers are kept. Literally like building your own protocol! Hmmm... something to chew on!

    So once you migrated this application from the PC to a web based app, did you have to switch to a more universal database like maybe PostGress? I'm a bit behind here too! last time I had to work with PC based databases on the programming level, it was an Access database, using a somewhat painful interface microsoft called "Jet" (Though it certainly a bit slow to have such a boastful name). I suppose you were using SQL?
    Copy linkTweet thisAlerts:
    @arafaat_allahDec 27.2013 — Ok... very rough example of an ajax routine to work around browsers without XMLHttpRequest() as a built in function, the create a request module and the return being something that needs to be run as it may be a script, maybe... Total of 12 lines of code Vs JQuery with something like 30 lines of code.

    [CODE]if(typeof XMLHttpRequest!='function'){
    XMLHttpRequest = function(){
    try{ return new ActiveXObject("Microsoft.XMLHTTP");}catch(e){}
    try{ return window.createRequest();}catch(e){}
    return false;
    }
    }

    xmlHttp = new XMLHttpRequest();
    xmlHttp.open("GET","script.php",true);
    xmlHttp.onreadystatechange = function(){ if(xmlHttp.status==200 && xmlHttp.readystate==4) eval(xmlHttp.responseText);}
    xmlHttp.send(null);

    [url=http://youtu.be/aS63PI1SX3g]شركة تنظيف منازل بالرياض[/url]

    [url=http://aladelgroup.wordpress.com/]شركة نظافة بالرياض[/url]
    [url=http://youtu.be/4VIERvCpR4Y]تسليك مجارى[/url]
    [url=http://aladelgroup.wordpress.com/%D8%AA%D9%86%D8%B8%D9%8A%D9%81-%D8%B4%D9%82%D9%82-0566724802/]تنظيف شقق بالرياض[/url]
    [url=http://aladelgroup.wordpress.com/%D8%AA%D9%86%D8%B8%D9%8A%D9%81-%D9%85%D9%88%D9%83%D9%8A%D8%AA-0566724802/]تنظيف موكيت بالرياض[/url]
    [url=http://aladelgroup.wordpress.com/%D8%AA%D9%86%D8%B8%D9%8A%D9%81-%D9%85%D8%AC%D8%A7%D9%84%D8%B3-%D8%A8%D8%A7%D9%84%D8%B1%D9%8A%D8%A7%D8%B6-0566724802-%D8%B4%D8%B1%D9%83%D8%A9-%D8%A7%D9%84%D8%B9%D8%A7%D8%AF%D9%84/]تنظيف مجالس بالرياض[/url]
    [url=http://aladelgroup.wordpress.com/%D8%A7%D9%84%D9%86%D8%B8%D8%A7%D9%81%D8%A9-%D8%A7%D9%84%D8%B9%D8%A7%D9%85%D8%A9-0566724802/]شركة تنظيف بالرياض[/url]


    [url=http://aladelgroup.wordpress.com/%D8%AA%D8%B3%D9%84%D9%8A%D9%83-%D9%85%D8%AC%D8%A7%D8%B1%D9%8A-0566724802/]شركة تسليك المجارى بالرياض[/url]
    [url=http://aladelgroup.wordpress.com/%D9%86%D9%82%D9%84-%D8%A7%D8%AB%D8%A7%D8%AB-%D8%A8%D8%A7%D9%84%D8%B1%D9%8A%D8%A7%D8%B6-0566724802/]شركة نقل اثاث بالرياض[/url]
    [url=http://aladelgroup.wordpress.com/%D9%85%D9%83%D8%A7%D9%81%D8%AD%D8%A9-%D8%AD%D8%B4%D8%B1%D8%A7%D8%AA-0566724802/]شركة مكافحة حشرات بالرياض[/url]
    [url=http://aladelgroup.wordpress.com/%D8%AA%D9%86%D8%B8%D9%8A%D9%81-%D8%A7%D9%84%D8%A8%D9%8A%D9%88%D8%AA-0566724802-%D8%B4%D8%B1%D9%83%D8%A9-%D8%A7%D9%84%D8%B9%D8%A7%D8%AF%D9%84/]تنظيف بيوت بالرياض[/url]
    [url=http://aladelgroup.wordpress.com/%D8%AA%D9%86%D8%B8%D9%8A%D9%81-%D8%AE%D8%B2%D8%A7%D9%86%D8%A7%D8%AA-0566724802-%D8%B4%D8%B1%D9%83%D8%A9-%D8%A7%D9%84%D8%B9%D8%A7%D8%AF%D9%84/]تنظيف خزانات بالرياض[/url]
    [url=http://aladelgroup.wordpress.com/%D8%B9%D8%B2%D9%84-%D8%AE%D8%B2%D8%A7%D9%86%D8%A7%D8%AA-0566724802-%D8%B9%D8%B2%D9%84-%D8%A7%D8%B3%D8%B7%D8%AD-0566724802-%D8%B4%D8%B1%D9%83%D8%A9-%D8%A7%D9%84%D8%B9%D8%A7%D8%AF%D9%84/]شركة عزل اسطح بالرياض[/url]
    [url=http://ar.wikipedia.org/wiki/%D9%85%D8%B3%D8%AA%D8%AE%D8%AF%D9%85:%D9%86%D9%82%D9%84_%D8%A7%D8%AB%D8%A7%D8%AB_%D8%A8%D8%A7%D9%84%D8%B1%D9%8A%D8%A7%D8%B6_0566724802]شركة نقل اثاث بالرياض[/url]
    [url=http://ar.wikipedia.org/wiki/%D9%85%D8%B3%D8%AA%D8%AE%D8%AF%D9%85:%D8%AA%D9%86%D8%B8%D9%8A%D9%81_%D8%A8%D9%8A%D9%88%D8%AA_%D8%A8%D8%A7%D9%84%D8%B1%D9%8A%D8%A7%D8%B6_0566724802]تنظيف بيوت بالرياض[/url]
    [url=http://www.youtube.com/watch?v=UIeADoEipPw&feature=youtu.be]شركة تنظيف واجهات حجرية بالرياض[/url]
    [url=http://www.youtube.com/watch?v=l5dejG9nr14&feature=youtu.be]شركة كشف تسربات المياه بالرياض[/url]
    [url=http://www.youtube.com/watch?v=4US3PWjM__M]شركة تخزين اثاث بالرياض[/url]
    [url=http://www.youtube.com/watch?v=DQiUX6Z-WT0&feature=youtu.be]نقل اثاث[/url]
    [url=http://www.youtube.com/watch?v=Miv6AHE8yr0&feature=youtu.be]شركة تنظيف فلل بالرياض[/url]
    [url=http://www.youtube.com/watch?v=qKS6eWOB8Sg]شركة تخزين عفش بالرياض[/url]
    [url=http://www.youtube.com/watch?v=HmYPfv60r5o&feature=youtu.be]شركة نقل عفش بالرياض[/url]
    [url=http://www.youtube.com/watch?v=CIGTriI31bA&feature=youtu.be]شركة تنظيف موكيت بالرياض[/url]
    [url=http://www.youtube.com/watch?v=_8qU5EciSJo&feature=youtu.be]شركة تنظيف مجالس بالرياض[/url]
    [url=http://www.youtube.com/watch?v=YbdbCKxRo90]شركة تنظيف شقق بالرياض[/url]
    [url=http://www.youtube.com/watch?v=I4nHssNgcM8&feature=youtu.be]شركة تنظيف بيوت بالرياض[/url]
    [url=http://www.youtube.com/watch?v=O5rf1t_PqHc]شركة تنظيف بيارات بالرياض[/url]
    [url=http://www.youtube.com/watch?v=-A3Z0MMaHqo&feature=youtu.be]شركة رش مبيدات بالرياض[/url]
    [url=http://www.youtube.com/watch?v=UPL0jHzYuzY&feature=youtu.be]شركة مكافحة حشرات بالرياض[/url]
    [url=http://www.youtube.com/watch?v=GgA0NVaLEtc&feature=youtu.be]شركة عزل خزانات بالرياض[/url]
    [url=http://www.youtube.com/watch?v=nosFKRcTja0&feature=youtu.be]شركة عزل اسطح بالرياض[/url]
    [url=http://www.youtube.com/watch?v=Jek9W0Ft5a8]شركة تنظيف خزانات بالرياض[/url]
    [url=http://www.youtube.com/watch?v=T0aFAwSqZeU]شركة تنظيف واجهات زجاج بالرياض[/url]
    [url=http://youtu.be/qtrgUlrmmF0]شركة نقل اثاث بالرياض[/url]
    [url=http://www.youtube.com/watch?v=uA-ruQfCULw&feature=youtu.be]شركة ترميمات عامة بالرياض[/url]

    [url=http://www.dailymotion.com/video/x18rzcg_%D8%B4%D8%B1%D9%83%D8%A9-%D8%AA%D9%86%D8%B8%D9%8A%D9%81-%D9%88%D8%A7%D8%AC%D9%87%D8%A7%D8%AA-%D8%AD%D8%AC%D8%B1%D9%8A%D8%A9-%D8%A8%D8%A7%D9%84%D8%B1%D9%8A%D8%A7%D8%B6-0540736424-%D9%82%D9%85%D8%A9-%D8%A7%D9%84%D8%A7%D9%86%D8%AC%D8%A7%D8%B2-0566884259_webcam]شركة تنظيف واجهات حجرية بالرياض[/url]
    [url=http://www.dailymotion.com/video/x18t17a_%D8%B4%D8%B1%D9%83%D8%A9-%D9%83%D8%B4%D9%81-%D8%AA%D8%B3%D8%B1%D8%A8%D8%A7%D8%AA-%D8%A7%D9%84%D9%85%D9%8A%D8%A7%D9%87-%D8%A8%D8%A7%D9%84%D8%B1%D9%8A%D8%A7%D8%B6-0540736424-%D9%82%D9%85%D8%A9-%D8%A7%D9%84%D8%A7%D9%86%D8%AC%D8%A7%D8%B2-0566884259_webcam]شركة كشف تسربات المياه بالرياض[/url]
    [url=http://www.dailymotion.com/video/x18t99i_%D8%B4%D8%B1%D9%83%D8%A9-%D8%AA%D8%AE%D8%B2%D9%8A%D9%86-%D8%A7%D9%84%D8%A7%D8%AB%D8%A7%D8%AB-%D8%A8%D8%A7%D9%84%D8%B1%D9%8A%D8%A7%D8%B6-0540736424-%D9%82%D9%85%D8%A9-%D8%A7%D9%84%D8%A7%D9%86%D8%AC%D8%A7%D8%B2-0566884259_webcam]شركة تخزين عفش بالرياض[/url]
    [url=http://www.dailymotion.com/video/x18t9ur_%D9%86%D9%82%D9%84-%D8%A7%D8%AB%D8%A7%D8%AB-0540736424-%D9%82%D9%85%D8%A9-%D8%A7%D9%84%D8%A7%D9%86%D8%AC%D8%A7%D8%B2-0566884259_webcam]شركة نقل اثاث بالرياض[/url]
    [url=http://www.dailymotion.com/video/x18rz4c_%D8%B4%D8%B1%D9%83%D8%A9-%D8%AA%D9%86%D8%B8%D9%8A%D9%81-%D9%81%D9%84%D9%84-%D8%A8%D8%A7%D9%84%D8%B1%D9%8A%D8%A7%D8%B6-0540736424-%D9%82%D9%85%D8%A9-%D8%A7%D9%84%D8%A7%D9%86%D8%AC%D8%A7%D8%B2-0566884259_webcam]شركة تنظيف فلل بالرياض[/url]
    [url=http://www.dailymotion.com/video/x18t8sp_%D8%B4%D8%B1%D9%83%D8%A9-%D8%AA%D8%AE%D8%B2%D9%8A%D9%86-%D8%A7%D9%84%D8%B9%D9%81%D8%B4-%D8%A8%D8%A7%D9%84%D8%B1%D9%8A%D8%A7%D8%B6-0540736424-%D9%82%D9%85%D8%A9-%D8%A7%D9%84%D8%A7%D9%86%D8%AC%D8%A7%D8%B2-0566884259_webcam]شركة تخزين عفش بالرياض[/url]
    [url=http://www.dailymotion.com/video/x18s01z_%D8%B4%D8%B1%D9%83%D8%A9-%D9%86%D9%82%D9%84-%D8%B9%D9%81%D8%B4-%D8%A8%D8%A7%D9%84%D8%B1%D9%8A%D8%A7%D8%B6-0540736424-%D9%82%D9%85%D8%A9-%D8%A7%D9%84%D8%A7%D9%86%D8%AC%D8%A7%D8%B2-0566884259_webcam]شركة نقل عفش بالرياض[/url]
    [url=http://www.dailymotion.com/video/x18rzad_%D8%B4%D8%B1%D9%83%D8%A9-%D8%AA%D9%86%D8%B8%D9%8A%D9%81-%D9%85%D9%88%D9%83%D9%8A%D8%AA-%D8%A8%D8%A7%D9%84%D8%B1%D9%8A%D8%A7%D8%B6-0540736424-%D9%82%D9%85%D8%A9-%D8%A7%D9%84%D8%A7%D9%86%D8%AC%D8%A7%D8%B2-0566884259_webcam]شركة تنظيف موكيت بالرياض[/url]
    [url=http://www.dailymotion.com/video/x18rz6t_%D8%B4%D8%B1%D9%83%D8%A9-%D8%AA%D9%86%D8%B8%D9%8A%D9%81-%D9%85%D8%AC%D8%A7%D9%84%D8%B3-%D8%A8%D8%A7%D9%84%D8%B1%D9%8A%D8%A7%D8%B6-0540736424-%D9%82%D9%85%D8%A9-%D8%A7%D9%84%D8%A7%D9%86%D8%AC%D8%A7%D8%B2-0566884259_webcam]شركة تنظيف مجالس بالرياض[/url]
    [url=http://www.dailymotion.com/video/x18ryn9_%D8%B4%D8%B1%D9%83%D8%A9-%D8%AA%D9%86%D8%B8%D9%8A%D9%81-%D8%B4%D9%82%D9%82-%D8%A8%D8%A7%D9%84%D8%B1%D9%8A%D8%A7%D8%B6-0540736424-%D9%82%D9%85%D8%A9-%D8%A7%D9%84%D8%A7%D9%86%D8%AC%D8%A7%D8%B2-0566884259_webcam]شركة تنظيف شقق بالرياض[/url]
    [url=http://www.dailymotion.com/video/x18ry80_%D8%B4%D8%B1%D9%83%D8%A9-%D8%AA%D9%86%D8%B8%D9%8A%D9%81-%D8%A8%D9%8A%D9%88%D8%AA-%D8%A8%D8%A7%D9%84%D8%B1%D9%8A%D8%A7%D8%B6-0540736424-%D9%82%D9%85%D8%A9-%D8%A7%D9%84%D8%A7%D9%86%D8%AC%D8%A7%D8%B2-0566884259_webcam]شركة تنظيف بيوت بالرياض[/url]
    [url=https://sites.google.com/site/servicescleaninig/cleaninghaher]شركة تنظيف واجهات حجرية بالرياض[/url]
    [url=https://sites.google.com/site/servicescleaninig/tasrbatmiao]شركة كشف تسربات المياه بالرياض[/url]
    [url=https://sites.google.com/site/servicescleaninig/takzeenasas]شركة تخزين اثاث بالرياض[/url]
    [url=https://sites.google.com/site/servicescleaninig/alalsas]شركة نقل اثاث بالرياض[/url]
    [url=https://sites.google.com/site/servicescleaninig/cleaning-vellal]شركة تنظيف فلل بالرياض[/url]
    [url=https://sites.google.com/site/servicescleaninig/takzenalafesh]شركة تخزين عفش بالرياض[/url]
    [url=https://sites.google.com/site/servicescleaninig/kemaengaz1]شركة نقل عفش بالرياض[/url]
    [url=https://sites.google.com/site/servicescleaninig/moketkcleaning]شركة تنظيف موكيت بالرياض[/url]
    [url=https://sites.google.com/site/servicescleaninig/magals]شركة تنظيف مجالس بالرياض[/url]
    [url=https://sites.google.com/site/servicescleaninig/superceaning]شركة تنظيف شقق بالرياض[/url]
    [url=https://sites.google.com/site/servicescleaninig/housecleaning]شركة تنظيف بيوت بالرياض[/url]
    [url=https://sites.google.com/site/servicescleaninig/cleaningbiarat]شركة تنظيف بيارات بالرياض[/url]
    [url=https://sites.google.com/site/servicescleaninig/rashmobidat]شركة رش مبيدات بالرياض[/url]
    [url=https://sites.google.com/site/servicescleaninig/hashrat]شركة مكافحة حشرات بالرياض[/url]
    [url=https://sites.google.com/site/servicescleaninig/3azelhazna]شركة عزل خزانات بالرياض[/url]
    [url=https://sites.google.com/site/servicescleaninig/azelasth]شركة عزل اسطح بالرياض[/url]
    [url=https://sites.google.com/site/servicescleaninig/cleaningkazanat]شركة تنظيف خزانات بالرياض[/url]
    [url=https://sites.google.com/site/servicescleaninig/cleaningglass]شركة تنظيف واجهات زجاج بالرياض[/url]

    [/CODE]

    If you put the request block in to a function, you can do requests all day.[/QUOTE]

    very cool sir
    Copy linkTweet thisAlerts:
    @landarDec 28.2013 — PeterPan, you asked for the "big picture" of AJAX.

    Simply put, AJAX is a way to update certain information on a page without needing to reload EVERYTHING on the page.

    Let's say you have two pictures to load and a simple form. The form contains a text field with the current outside temperature displayed. If you want to update the temperature field to see the latest value, you would refresh the browser and reload the entire page. That is one way to do it. But suppose that instead of downloading the entire page again, you just get the temperature value? After all, the pictures are static and not changing. AJAX technology does precisely that...it retrieves the latest temperature value from the server and updates only the temperature field. The picture information is not reload thus saving bandwidth and resulting in faster updates.

    Pretty simple concept, eh? That's the "big picture".
    Copy linkTweet thisAlerts:
    @PeterPan_321authorDec 28.2013 — Well thanks! This answer is back on the track of my original question! Several messages back I showed this link of a demo page I did, probably 15 years back. At the time it worked on Netscape 4 and IE 4, and now it still works, but only on IE (firefox doesn't like it).

    http://elfintechnologies.com/html_hmi/hmi_tst1.htm

    So this demonstrated a control panel, where content could change without re-loading the page. At least form data could be changed, and also GIF images could be swapped. But that was all done with javascript, just using random data and mouse clicks to change images, and obviously the changing DOMs foiled its ability to work on ANY version of ANY browser.. So you're saying that if I wanted to make those displays actually reflect real time data, I could use AJAX to pull values from a database, is that correct? Now if that's true, could the data in that database also be updated by some other web based AJAX application pushing data into database? Also, would AJAX help me make a similar display that was more likely to work on ANY browser?

    I guess what I'm getting at as a final goal is this. Lets say i wanted web based remote control over devices at another location, devices that both produced data and responded to controls. That is actually my field of work. But in the past dedicated graphic libraries were used to create PC based applications similar to that control panel display, and it would be served by another set of dedicated applications at other locations, which interacted with these devices. And what I am hoping for is a technology to allow me to use browser based control panels to do the same kind of thing, so that any machine with any browser could instantly become the control panel. It seems that maybe AJAX could go a long way to accomplishing this. But maybe I'm getting my hopes to high?
    Copy linkTweet thisAlerts:
    @landarDec 28.2013 — Well no, you are not getting your hopes too high. All of the technology exists to accomplish your goals.

    In general, you would use 'events' to trigger reading or writing on the server. These events are either user triggered(clicking on a button, for instance) or time-based(interval timer).

    I suspect that when you say 'device', you may be trying to communicate with an embedded webserver which usually have limited capabilities as far as server-side scripting. So, you would need to understand the commands that are needed to perform various operations on the server and simply use those commands (probably CGI type) within your Javascript/AJAX code. If you are targeting standard PC based servers like Apache or IIS, then you will have all sorts of PHP, ASP commands available on the server.
    Copy linkTweet thisAlerts:
    @PeterPan_321authorDec 28.2013 — OK! So as the devil is in the details, let me now consider some of those server side requirements. As it turns out my background has been in the world of automation, including remote control and data acquisition, and has also been very tied to the intel world. Everything from little embedded machines with 386ex CPUs, and no OS (unless I wrote one) to modern windows machines. So just to cut my learning curve I likely would be working with a PC based server. Unfortunately my background has also left me with a lot of tunnel vision, having worked mostly with custom applications.

    So as you can likely tell, I'm trying to mentally navigate replacing parts of such systems, where everything is a custom app, to systems where the custom work is concentrated where its really needed. So now that I'm seeing where browser based control panel displays can interact with a server side database via AJAX, I assume that whether it is done via timed poling or events, I could both pull and push data from and to that database, correct? So if that's true, and the database can be PC based, it remains now for me to first consider what database would be best, and to educate myself as to what server side apps and coding would need to be done, to complete the data flow between to that database. Next I'd be looking at the PC apps that would do the device communication, using the database as a kind of middle-man data pool.

    on that last point, I still have a lot of education to catch up on, especially about database interaction. Heck, the last time I wrote code to directly interface with a database it was a Microsoft ACcess database, and I'm reasonably sure I'd be better off these days working with something my mySQL or maybe postgGess?

    But there I'm getting ahead of myself... I'm intentionally working backwards, from a javascript based control panel to database interaction via AJAX. So the next question to ask is how much "from scratch" server side work is needed to go between the web server and and the database. Here I'm hoping, in the same spirit of getting away from re-inventing wheels, that this functionality is already available as an extension of some PC based databases? It would be nice to think that for simple things like pulling/pushing numerical or boolean values would be more about configuration and mapping then scratch building code. But again, maybe my hopes are too high there?

    I'm definitely not allergic to coding or even working with languages new to me, I just know I've re-invented way too many wheels in my life. As a now out of work programmer and electronics guy whose skills are constantly becoming obsolete or at least dated, this kind of assist in understanding newer technology I can put to use right "out of the box" is very much appreciated.
    Copy linkTweet thisAlerts:
    @landarDec 28.2013 — We all need to learn new technology on a regular basis or we soon fall behind. I would suggest that you learn more about Javascript, HTML and PHP technologies. There are many excellent tuturials online for free that you can go through. One that I particularly like is the W3C schools -> http://www.w3schools.com

    They have tons and tons of good material and tutorials in many different areas. You just need to take the initiative to learn from them All you need is a PC and time (you said you were out of work...well, you just found something to occupy your time:-). Best wishes to you as you dig in and learn.
    Copy linkTweet thisAlerts:
    @PeterPan_321authorDec 28.2013 — Thanks! Well Javascript, HTML, and CSS were things I had become reasonably proficient in, and it sounds like the newer tools and browser evolution have made dealing with the different DOMs easier. So I hopefully have a head start there, and I do intend to dig in a lot more in the coming months. Thanks for the link too. It doesn't seem to have an AJAX area, but I'll find something.

    As you can surely understand though, I've been bitten enough times by bad assumptions. So now I start by explaining the goals and functionality I want to achieve, and ask ahead of time what tools to explore to get there. You know how it is!!! These days one can easily talk themselves into believing some new technology (AJAX in this case) will help them toward a goal, only to find out I'm barking up the wrong tree. :-)
    Copy linkTweet thisAlerts:
    @landarDec 29.2013 — I am not sure why you think W3schools does not have an AJAX tutorial. I found it quite easily and it is excellent -> http://www.w3schools.com/ajax/default.asp
    Copy linkTweet thisAlerts:
    @PeterPan_321authorDec 29.2013 — I found it. Tunnel vision. :-

    Question... is Ajax functionality obtained from a standard library, like a JS file, that you have to link your pages to in order to use, and if so where should I get it, and is it free, open source, or a commercial product?
    Copy linkTweet thisAlerts:
    @landarDec 29.2013 — AJAX functionality is primarily included in the ECMAScript language and executed by the JS engine in the browser so it is free. In your case, the primary function needed is "XMLHttpRequest". That will allow you to Get and Post data to/from the server as needed. Do some research on that function to understand how it executes in your JS.
    Copy linkTweet thisAlerts:
    @martin183Jan 31.2014 — AAJAX is a technique for creating fast and dynamic web pages.

    AJAX allows web pages to be updated asynchronously by exchanging small amounts of data with the server behind the scenes. This means that it is possible to update parts of a web page, without reloading the whole page.

    Classic web pages, (which do not use AJAX) must reload the entire page if the content should change.

    Examples of applications using AJAX: Google Maps, Gmail, Youtube, and Facebook tabs.
    Copy linkTweet thisAlerts:
    @PeterPan_321authorJan 31.2014 — Well I'm very interested in the the part about being able to exchange data with a server, because it means a database could become a link between software communicating with real devices, and updates to a web page. But I don't understand the continued references to classic web pages needing to re-load pages to update regions. Again, despite the fact that this code is so old it only works in IE now, I did throw it together over a dozen years ago. It simulates a control panel for an electric utility substation, and illustrates the ability to update numerical values without reloading the page, and even change the breaker graphic (just blinking currently) when you click, without re-loading.

    http://elfintechnologies.com/html_hmi/hmi_tst1.htm

    That was done way back when IE was version 4, and so was the early Mozilla (Netscape) browser. And really, I had seem more sophisticated programmers use ordinary javascript to run much more complex animations, swapping out all kinds of page content without re-loading the page.

    The probalem, of course, is that every new browser version would break the code, because the DOM kept changing. So maybe the main thing with AJAX is that it will work with ANY browser, on any DOM? If not, its not a huge improvement really.

    Now the part about exchanging data directly with a server... THAT is VERY interesting!! :-)
    ×

    Success!

    Help @PeterPan_321 spread the word by sharing this article on Twitter...

    Tweet This
    Sign in
    Forgot password?
    Sign in with TwitchSign in with GithubCreate Account
    about: ({
    version: 0.1.9 — BETA 5.16,
    whats_new: community page,
    up_next: more Davinci•003 tasks,
    coming_soon: events calendar,
    social: @webDeveloperHQ
    });

    legal: ({
    terms: of use,
    privacy: policy
    });
    changelog: (
    version: 0.1.9,
    notes: added community page

    version: 0.1.8,
    notes: added Davinci•003

    version: 0.1.7,
    notes: upvote answers to bounties

    version: 0.1.6,
    notes: article editor refresh
    )...
    recent_tips: (
    tipper: @AriseFacilitySolutions09,
    tipped: article
    amount: 1000 SATS,

    tipper: @Yussuf4331,
    tipped: article
    amount: 1000 SATS,

    tipper: @darkwebsites540,
    tipped: article
    amount: 10 SATS,
    )...