ajax

Ajax загрузка, минимальное время работы

Иногда ajax запросы получаются очень быстрыми, но не исключена вероятность что запрос может задержаться по разным причинам. Ajax loader как раз и нужен для того чтобы показать пользователю что что-то происходит, идет работа и нужно подождать.

Но что делать если запросы быстрые, пользователь не знает что это такое, что это фоновый ajax запрос, это ему вообще не интересно, в итоге он увидит быстрое отображение и скрытие загрузчика и может вообще нечего не понять, и воспринять как ошибку сайта или что-то подобное.

Задача, сделать ajax loader с минимальным времени работы, допустить 1,5 секунды.

Continue reading

AJAX навигация по меткам

Итак задача, нужно сохранять состояние страницы после ajax запроса. Для этого приспособили метки у ссылок, URL будет вот такого вида http://site.ru/#/key:val/key1:val1/keyN:valN/

В js далеко не гуру, но все работает и нативно.

var Navigation = function()
{
this.isHash = function(){return (window.location.href.indexOf('#') !== -1 && window.location.hash.length > 1);};

/**
* Возвращает все параметры из url в виде объекта
*/
this.getQueryParams = function(){
if(this.isHash())
{
var _ar = window.location.hash.replace('#', '').split('/');
var _ob = {};

for(var i=0; i < _ar.length; i++){
if(_ar[i] !== "")
_ob[i] = _ar[i];
}

var returnObject = {};
for(var j in _ob){

if (_ob.hasOwnProperty(j)) {
var _ar_params = _ob[j].split(':');
returnObject[_ar_params[0]] = _ar_params[1];
}
}

return returnObject;
}

return false;
};

/**
* Устанавливает строку параметров, если есть сотрет что было
*/
this.setHash = function(objectParsms){

var ar = [], j = 0;
for(var i in objectParsms){
j++; ar[j] = i + ':' + objectParsms[i];
}

var hashString = ar.join('/');

if(hashString.length > 0)
window.location.hash = '#' + hashString + '/';
};

this._isEmptyObject = function(Obj)
{
var i = 0;
for(var o in Obj){
i++;
}

return i;
};

this._isKeyObject = function(obj, key){

for(var o in obj)
{
if(o === key)
return true;
}

return false;
};

/**
* Добавляет параметр в url, если параметр уже есть то заменит значение на новое
*/
this.addHashParam = function(objectParams){

if(this.isHash())
{
var params = this.getQueryParams();

for(var o in objectParams){
if(this._isKeyObject(params, o)){
params[o] = objectParams[o];
}
}

var arRes = [], k = 0;
for(var or in params){
k++;arRes[k] = or + ':' + params[or];
}

var str_hash = arRes.join('/');

var ar = [], j = 0;
for(var i in objectParams){
if(!this._isKeyObject(params, i)){
j++; ar[j] = i + ':' + objectParams[i];
}
}

if(ar.length > 0){
str_hash += ar.join('/') + '/';
}
else{
str_hash += '/';
}

window.location.hash = str_hash;
}
else
{
this.setHash(objectParams);
}
};

/**
* Удаляет параметр из url можно указывать несколько, принимает массив ключей
*/
this.delHashParams = function(arParams){
if(this.isHash())
{
var params = this.getQueryParams();

for(var a = 0; a <= arParams.length; a++){
delete params[arParams[a]];
}

if(this._isEmptyObject(params) > 0)
this.setHash(params);
else
window.location.hash = '';
};
};
};

Делать такую навигацию весьма трудоемко, но позволяет немного шире использовать ajax.

Ajax и IE7: Ошибка c00ce56e и как ее исправить, в Bitrix не исключение…

Ошибка эта возникает, когда сервер передает IE неизвестную кодировку. То есть, возможна ситуация, когда на одном сервере ваш скрипт будет работать нормально, а на другом —  возникнет подобная ошибка.

То есть, передается, как правило — «utf8» а по стандарту должно «utf-8«. То есть, на этот раз Internet Explorer ведет себя вполне корректно (хотя, мог бы и простить, как делает FireFox, например), а гнилые помидоры — тому, кто настраивал web-сервер.

Как исправить? Варианта два:

  1. Поправить настройки Apache
  2. B самом начале серверного скрипта Ajax принудительно указать кодировку: header(‘Content-type: text/html; charset=utf-8’);

Поскольку, мы можем не знать настроек сервера, где будет работать наш скрипт, указание данного заголовка header(‘Content-type: text/html; charset=utf-8’);, я считаю, обязательно.

В битриксе это ошибка возникает допустим при обращение аяксом к компоненте в которой подключается js, без js все работает. Так что или выносим js из компонента или пользуемся советами выше.

решение нашли тут

Битрикс AJAX [bitrix-ajax-api]

Почему-то многие не охотно используют битриксовую библиотеку аякса, почти всегда делая предпочтения в сторону Jquery или других js библиотек. Не сомненно что Jquery очень не плохая библиотека и отлично работает с ajax, но чтобы свободно разрабатывать сайты не 1с-Битрикс надо знать родное API.

Пост для новичков, думаю будет полезно. Рассматриваем только ajax-овую часть библиотеки, ее основу.

Continue reading