Zjednodušení (spojení) více funkcí AJAXU – JavaScript, AJAX, jQuery – Fórum – Programujte.com

Ahoj,

začínám s javascriptem a s AJAXem. Mám server na arduinu a několik AJAX skriptů (bez jQuery) obsluhující webovou stránku (odesílání formulářů, aktualizace bloků, atd..). Většina skriptů se liší jen v počtu odesílaných proměnných, nebo v elementech, do kterých vpisuje informace.

Poradíte mi prosím, jak správně spojit tyto funkce, tak aby byl zápis co nejkratší? Určite nemusím v každé jednotlivé funkci kontrolovat odpověď serveru,

if (this.readyState == 4) { if (this.status == 200) { if (this.responseText != null)......
 

ale stačila by mi na to jedna funkce na kontrolu odpovědi serveru a poté volat podfunkce. Dále je podle mě zbytečné mít na každý formulář vlastní funkci, zase by stačila funkce na odesílání formulářů a podfunkce pro konkrétní formulář, atd..

Opravte mně pokud se pletu.

Díky za tipy.

<script>
function prehled() {
nocache = "&nocache="                                                         + Math.random() * 1000000;
var request = new XMLHttpRequest();
request.onreadystatechange = function() {
if (this.readyState == 4) {
if (this.status == 200) {
if (this.responseText != null) {
document.getElementById("prehledDiv").innerHTML = this.responseText;
}}}}
request.open("GET", "?prehled" + nocache, true);
request.send(null);
setTimeout('prehled()', 8000);
}
function dayCounterRefresh() {
nocache = "&nocache="                                                         + Math.random() * 1000000;
var request = new XMLHttpRequest();
request.onreadystatechange = function() {
if (this.readyState == 4) {
if (this.status == 200) {
if (this.responseText != null) {
document.getElementById("dayCounter").innerHTML = this.responseText;
}}}}
request.open("GET", "?refreshDC" + nocache, true);
request.send(null);
setTimeout('dayCounterRefresh()', 15000);
}
function datumKalibraceRefresh() {
nocache = "&nocache="                                                         + Math.random() * 1000000;
var request = new XMLHttpRequest();
request.onreadystatechange = function() {
if (this.readyState == 4) {
if (this.status == 200) {
if (this.responseText != null) {
document.getElementById("datumKalibraceDiv").innerHTML = this.responseText;
}}}}
request.open("GET", "?datumKalibraceRefresh" + nocache, true);
request.send(null);
setTimeout('datumKalibraceRefresh()', 60000);
}
</script>
<script type="text/javascript">
function loadProfil(DTnas, DHnas, DCnas, trvaniDneHod, SzapHod, SzapMin, NTnas, NHnas, NCnas, Thystereze, Hhystereze, Chystereze){
nocache = "&nocache=" + Math.random() * 10;
var xmlhttp;
if (window.XMLHttpRequest){
xmlhttp = new XMLHttpRequest();
}
else{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function(){
if (xmlhttp.readyState == 4 && xmlhttp.status == 200){
document.getElementById("profilDiv").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET","?td=" + DTnas + "&hd=" + DHnas + "&cd=" + DCnas + "&dh=" + trvaniDneHod + "&zh=" + SzapHod + "&zm=" + SzapMin + "&tn=" + NTnas + "&hn=" + NHnas + "&cn=" + NCnas + "&th=" + Thystereze + "&hh=" + Hhystereze + "&ch=" + Chystereze + nocache, true);
xmlhttp.send();
}
function loadZalivka(xD, yD, xN, yN){
nocache = "&nocache=" + Math.random() * 10;
var xmlhttp;
if (window.XMLHttpRequest){
xmlhttp = new XMLHttpRequest();
}
else{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function(){
if (xmlhttp.readyState == 4 && xmlhttp.status == 200){
document.getElementById("zalivkaDiv").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET","?xd=" + xD + "&yd=" + yD + "&xn=" + xN + "&yn=" + yN + nocache, true);
xmlhttp.send();
}
function loadKalibrace(kalibrace){
nocache = "&nocache=" + Math.random() * 10;
var xmlhttp;
if (window.XMLHttpRequest){
xmlhttp = new XMLHttpRequest();
}
else{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function(){
if (xmlhttp.readyState == 4 && xmlhttp.status == 200){
document.getElementById("kalibraceDiv").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET","?co=" + kalibrace + nocache, true);
xmlhttp.send();
}
function loadInflux(influx, dbName, table){
nocache = "&nocache=" + Math.random() * 10;
var xmlhttp;
if (window.XMLHttpRequest){
xmlhttp = new XMLHttpRequest();
}
else{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function(){
if (xmlhttp.readyState == 4 && xmlhttp.status == 200){
document.getElementById("influxDiv").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET","?ii=" + influx + "&db=" + dbName + "&tb=" + table + nocache, true);
xmlhttp.send();
}
function dayCounter() {
nocache = "&nocache=" + Math.random() * 10;
var request = new XMLHttpRequest();
request.onreadystatechange = function() {
if (this.readyState == 4) {
if (this.status == 200) {
if (this.responseText != null) {
document.getElementById("dayCounter").innerHTML = this.responseText;
}}}}
request.open("GET", "?dayCounter" + nocache, true);
request.send(null);
}
function loadRelay(radio, zapProgramHod, programHodStart, programMinStart, xP, yP){
nocache = "&nocache=" + Math.random() * 10;
var xmlhttp;
if (window.XMLHttpRequest){
xmlhttp = new XMLHttpRequest();
}
else{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function(){
if (xmlhttp.readyState == 4 && xmlhttp.status == 200){
document.getElementById("relayDiv").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET","?pz=" + radio + "&tp=" + zapProgramHod + "&ph=" + programHodStart + "&pm=" + programMinStart + "&xp=" + xP + "&yp=" + yP + nocache, true);
xmlhttp.send();
}
function loadTimeZone(timeZone){
nocache = "&nocache=" + Math.random() * 10;
var xmlhttp;
if (window.XMLHttpRequest){
xmlhttp = new XMLHttpRequest();
}
else{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function(){
if (xmlhttp.readyState == 4 && xmlhttp.status == 200){
document.getElementById("timeZoneDiv").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET","?tz=" + timeZone + nocache, true);
xmlhttp.send();
}
function loadUrlGraf(grafyURL){
nocache = "&nocache=" + Math.random() * 10;
var xmlhttp;
if (window.XMLHttpRequest){
xmlhttp = new XMLHttpRequest();
}
else{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function(){
if (xmlhttp.readyState == 4 && xmlhttp.status == 200){
document.getElementById("urlGrafDiv").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET","?ga=" + grafyURL + nocache, true);
xmlhttp.send();
}
function startNepProvoz() {
nocache = "&nocache=" + Math.random() * 10;
var request = new XMLHttpRequest();
request.onreadystatechange = function() {
if (this.readyState == 4) {
if (this.status == 200) {
if (this.responseText != null) {
document.getElementById("zalivkaDiv").innerHTML = this.responseText;
}}}}
request.open("GET", "?startNepProvoz" + nocache, true);
request.send(null);
}
function startWatering() {
nocache = "&nocache=" + Math.random() * 10;
var request = new XMLHttpRequest();
request.onreadystatechange = function() {
if (this.readyState == 4) {
if (this.status == 200) {
if (this.responseText != null) {
document.getElementById("zalivkaDiv").innerHTML = this.responseText;
}}}}
request.open("GET", "?startWatering" + nocache, true);
request.send(null);
}
function sendInflux() {
nocache = "&nocache=" + Math.random() * 10;
var request = new XMLHttpRequest();
request.onreadystatechange = function() {
if (this.readyState == 4) {
if (this.status == 200) {
if (this.responseText != null) {
document.getElementById("influxDiv").innerHTML = this.responseText;
}}}}
request.open("GET", "?sendInflux" + nocache, true);
request.send(null);
}
function sendAirControl() {
nocache = "&nocache=" + Math.random() * 10;
var request = new XMLHttpRequest();
request.onreadystatechange = function() {
if (this.readyState == 4) {
if (this.status == 200) {
if (this.responseText != null) {
document.getElementById("switcherDiv").innerHTML = this.responseText;
}}}}
request.open("GET", "?sendAir" + nocache, true);
request.send(null);
}
function sendLightControl() {
nocache = "&nocache=" + Math.random() * 10;
var request = new XMLHttpRequest();
request.onreadystatechange = function() {
if (this.readyState == 4) {
if (this.status == 200) {
if (this.responseText != null) {
document.getElementById("switcherDiv").innerHTML = this.responseText;
}}}}
request.open("GET", "?sendLight" + nocache, true);
request.send(null);
}
function checkTime() {
nocache = "&nocache=" + Math.random() * 10;
var request = new XMLHttpRequest();
request.onreadystatechange = function() {
if (this.readyState == 4) {
if (this.status == 200) {
if (this.responseText != null) {
document.getElementById("timeSpan").innerHTML = this.responseText;
}}}}
request.open("GET", "?checkTime" + nocache, true);
request.send(null);
}
function loadConstantIP(konstantIP){
nocache = "&nocache=" + Math.random() * 10;
var xmlhttp;
if (window.XMLHttpRequest){
xmlhttp = new XMLHttpRequest();
}
else{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function(){
if (xmlhttp.readyState == 4 && xmlhttp.status == 200){
document.getElementById("konstantIPDiv").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET","?si=" + konstantIP + nocache, true);
xmlhttp.send();
}
function enableConstantIP() {
nocache = "&nocache=" + Math.random() * 10;
var request = new XMLHttpRequest();
request.onreadystatechange = function() {
if (this.readyState == 4) {
if (this.status == 200) {
if (this.responseText != null) {
document.getElementById("konstantIPDiv").innerHTML = this.responseText;
}}}}
request.open("GET", "?constantIP" + nocache, true);
request.send(null);
}
function loadWebPassword(pass, pass2, passVal){
nocache = "&nocache=" + Math.random() * 10;
var xmlhttp;
if (window.XMLHttpRequest){
xmlhttp = new XMLHttpRequest();
}
else{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function(){
if (xmlhttp.readyState == 4 && xmlhttp.status == 200){
document.getElementById("webPasswordDiv").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("GET","?pass=" + pass + "&pas2=" + pass2 + "&pasv=" + passVal + nocache, true);
xmlhttp.send();
}
</script>

Nevím jistě na co se ptáš.

U každého requestu potřebuješ zkontrolovat výsledek, ale můžeš to mít v jedné funkci.

A pokud chceš sloučit víc různých requestů, tak prostě zpracovávej a vracej víc dat.

<?php
$response = [];
if (isset($_GET['prvni'])) {
    $response['prvni'] = 'prvniiii';
}
if (isset($_GET['druhy'])) {
    $response['druhy'] = 'druhyyyy';
}
if (isset($_GET['treti'])) {
    $response['treti'] = 'tretiiii';
}
echo json_encode($response);

<script>
function refreshData(qs) {
    var request = new XMLHttpRequest();
    request.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200 && this.responseText != null) {
        var resp = JSON.parse(this.responseText);
        console.log(resp);
        if (resp.prvni !== undefined)
            document.getElementById("prvni").innerHTML = resp.prvni;
        if (resp.druhy !== undefined)
            document.getElementById("druhy").innerHTML = resp.druhy;
        if (resp.treti !== undefined)
            document.getElementById("treti").innerHTML = resp.treti;
        }
    }
    var nocache = "&nocache=" + Math.random() * 1000000;
    request.open("GET", "?" + qs + nocache, true);
    request.send(null);
}
function startRefresh() {
    setInterval(function() { refreshData("prvni&druhy"); }, 8000);
    setInterval(function() { refreshData("treti"); }, 15000);
}
</script>

Vypadá to nějak divně, asi mi někde utekly nějaké závorky :) ale pointa by měla být jasná.