Difference between revisions of "Send via POST and GET Using a Single AJAX Function"

From WikiHTP
(Created page with "When a website using AJAX is made, the most frequent problem is having to write a function for each variable or set of variables that you want to pass. This adds a lot of weig...")
 
 
Line 108: Line 108:
 
</syntaxhighlight>
 
</syntaxhighlight>
  
[[Category:Ajax]]
+
[[Category:AJAX]]

Latest revision as of 01:56, 30 May 2019

When a website using AJAX is made, the most frequent problem is having to write a function for each variable or set of variables that you want to pass. This adds a lot of weight to the code of your website. In this tutorial, we tell you how to create a single function that allows you to pass variables through GET and POST between two web pages using AJAX.

This will greatly lighten the weight of your javascript files and your pages since you will use a function for everything and not one for each variable or set of variables that you want to pass.

Before You Begin[edit]

This tutorial is made for people who know how to create AJAX objects, write functions and pass them through AJAX by POST or GET. Also, they have knowledge about PHP and javascript. If it is not your case, please delve into these aspects in order to understand it.

The Code[edit]

First I copy here the complete code, and then I will analyze it.

function objetus(file) {

    xmlhttp = false;
    this.AjaxFailedAlert = "Your browser does not support the functionality of this site and you may exper" +
            "ience it in a different way than you thought, please enable javascript in your" +
            " browser to view it normally. \ n";
    this.requestFile = file;
    this.encodeURIString = true;
    this.execute = false;

    if (window.XMLHttpRequest) {
        this.xmlhttp = new XMLHttpRequest();
        if (this.xmlhttp.overrideMimeType) {
            this
                .xmlhttp
                .overrideMimeType('text / xml');
        }
    } else if (window.ActiveXObject) { // IE
        try {
            this.xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            try {
                this.xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e) {
                this.xmlhttp = null;
            }
        }
        if (!this.xmlhttp && typeof XMLHttpRequest ! = 'undefined') {
            this.xmlhttp = new XMLHttpRequest();
            if (!this.xmlhttp) {
                this.failed = true;
            }
        }
    }
    return this.xmlhttp;
}

function recibid(_page, valueget, postpost, layer) {

    ajax = objetus(_page);

    if (postpost ! = "") {

        ajax.open(
            "POST",
            _page + "?" + valueget + "& time =" + new Date().getTime(),
            true
        );

    } else {

        ajax.open("GET", _page + "?" + valueget + "&
 ajax.onreadystatechange = function () {

            if (ajax.readyState == 1) {

                document
                    .getElementById(layer)
                    .innerHTML = "<img src = 'loadingcircle.gif' align = 'center'> Please wait ...";

            }

            if (ajax.readyState == 4) {

                if (ajax.status == 200) {
                    document
                        .getElementById(layer)
                        .innerHTML = ajax.responseText;
                } else if (ajax.status == 404) {

                    layer.innerHTML = "The address does not exist";

                } else {

                    layer.innerHTML = "Error:".ajax.status;

                }

            }

            if (postpost ! = "") {

                ajax.setRequestHeader("Content-Type", "application / x-www-form-urlencoded");

                ajax.send(valuepost);

            } else {

                ajax.send(null);

            }

        }