Многоразовый шаблон JS Ajax (JQuery) - PullRequest
6 голосов
/ 26 июня 2010

Я хотел бы знать, есть ли лучший подход к созданию повторно используемого объекта ajax для jquery.

Это мой не проверенный код.

var sender = {
    function ajax(url, type, dataType,  callback) {
        $.ajax({
            url: url,
            type: type,
            dataType: dataType,
            beforeSend: function() {
                onStartAjax();
            },
            error: function(XMLHttpRequest, textStatus, errorThrown) {
                callback.failure(XMLHttpRequest, textStatus, errorThrown);
            },
            success: function(data, textStatus) {
                callback.success(data, textStatus);
            },
            complete: function (XMLHttpRequest, textStatus) {
                onEndAjax();
            }
        });
    },
    function onStartAjax() {
        // show loader
    },
    function onEndAjax() {
        // hide loader
    }  
};


<script type="text/javascript">
    var callback = {
        success: function(data, textStatus) {
            $('#content').html(data);
        },
        failure: function(XMLHttpRequest, textStatus, errorThrown) {
            alert('Error making AJAX call: ' + XMLHttpRequest.statusText + ' (' + XMLHttpRequest.status + ')');
        }
    }

    sender.ajax(url, type, dataType, callback);

</script>

Ответы [ 3 ]

4 голосов
/ 26 июня 2010

Вы можете установить основные параметры, которые у вас всегда одинаковы по отдельности.

Например, если вы всегда используете одно и то же здесь:

    type: type, 
    dataType: dataType, 

для этих типов вы можете установитьих отдельно.

Вот как вы это делаете:

$.ajaxSetup({
  type: "POST",
  contentType: "application/json; charset=utf-8",
  data: "{}"
});

СЕЙЧАС они установлены, и вы можете упростить ваши отдельные вызовы ajax.1013 *

ПРИМЕЧАНИЕ. Установка параметров в $ .ajax переопределяет эти значения по умолчанию.Таким образом, установка «данных» в пустую строку JSON безопасна и желательна.Таким образом, любой вызов $ .ajax, который указывает параметр данных, будет функционировать должным образом, поскольку значение по умолчанию не будет использоваться.Это помогает избежать проблем, которые могут быть трудно найти на развернутом сайте.

3 голосов
/ 26 августа 2012

Вот что я сделал:

var ajaxclient = (function (window) {

    function _do(type, url)
    {
        return $.ajax({
            url:url,
            type:type,
            dataType:'json',
            beforeSend: _onStartAjax                
        }).always(_onEndAjax);
    }

    function _onStartAjax()
    {
        console.log("starting ajax call");
    }

    function _onEndAjax()
    {
        console.log("finished ajax call");
    }

    return {
        do:_do
    }
}(this));

Пример использования:

ajaxclient.do("get","http://...").done(function(data) {console.log(data);})
1 голос
/ 26 августа 2012

Я бы, наверное, прошел бы всю свинью и создал бы объект Ajax.

var ajax = new MySuperAjax(url, data);
ajax.onComplete = function(){}

или аналогичный.Похоже, что вы находитесь на полпути между функцией, которая имеет некоторые значения по умолчанию, которые она расширяет с теми, в которые вы ссылаетесь, и объектом для нее.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...