Здравствуйте, уважаемые читатели блога LifeExample, сегодня будем заниматься сохранением массива в cookie. Я предлагаю подойти к этой задачи с двух сторон. Для начала разберем, как записать массив в cookie с помощью PHP, а затем попробуем сделать то же самое действие с помощью JavaSсript и jQuery.
Возможно, у неопытных программистов появится вопрос, зачем может понадобиться записывать массив в cookie.
Как бы это не казалось странным, но cookie это очень полезный механизм позволяющий хранить временные данные, необходимые для функционирования той или иной публичной части сайта, на компьютере пользователя.
Если у вас на сайте пользователь может производить выборку данных по фильтру, к примеру, выбор сотовых телефонов по производителю, модели, цене и т.д., то ему будет приятно увидеть все свои настройки, после ухода и возвращения на сайт.
Массив в cookie с помощью PHP
Вспомним, что куки не позволяют хранить в себе структурированные данные, все что представляется возможным это сохранять пары "Ключ : Значение".
Перед тем как приступить к практике я хочу, чтобы вы вспомнили статью "Формат JSON", она как нельзя лучше сочетается с темой записи массива в cookie, поскольку именно в ней изложено как, представлять сложные структуры данных сериализированной строкой.
Имея конвертированный в строку массив, мы без труда сможем сохранить его в cookies.
И так, пример сохранения настроек фильтра в куки на php:
<?
$array = array(
array(
"name"=>"Основные",
"field"=>"email",
"sortdir"=>1,
"search"=>""
),
array(
"name"=>"Архив",
"field"=>"Дата",
"sortdir"=>-1,
"search"=>""
),
);
$json = json_encode($array);
setcookie ("filter", $json);
?>
Как видите, я использовал многомерный массив, и тем не менее он был успешно занесен в куки в виде вот такой страшной записи:
1
[{"name":"u041eu0441u043du043eu0432u043du044bu0435","field":"email","sortdir":1,"search":""},{"name":"u0411u0435u0437 u0434u043eu0433u043eu0432u043eu0440u0430","field":"u0414u0430u0442u0430","sortdir":-1,"search":""}]
Проверить успешность записи массива в cookie, можно средствами браузера или выполнив строку кода:
1
echo $_COOKIE['filter'];
Кроме сохранения нам придется в будущем получить все записанные настройки и вернуть им рабочий вид, сделать это можно таким образом:
$array = json_decode($_COOKIE['filter'], true); //возвращаем массиву рабочее состояние
echo "<pre>";
print_r($array); // выводим массив для проверки
echo "</pre>";
Массив в cookie с помощью jQuery
Опять же призываю внимательно почитать материал статьи "Формат JSON", там можно найти решение для сохранения массива и других структур данных в cookie, но так как заголовок гласит о работе с помощью библиотеки jQuery, я опишу именно этот метод.
Для работы с куками в jQuery предусмотрен плагин jquery.cookie.js (скачать можно будет в конце статьи вместе с исходниками)
Для осуществления задуманного, нам понадобится подключить саму библиотеку jQuery и плагин для работы с cookie. Я сразу приведу готовый кусок кода а затем разберем все по полочкам.
<script type="text/javascript" src="/jQuery.js"></script>
<script type="text/javascript" src="/jquery.cookie.js"></script>
<script>
$(document).ready(function(){
var dataFilter=$.cookie('filter'); // получаем сохраненные ранее настройки
var filter = eval(dataFilter); //конвертируем строку в массив
// тестируем работу с массивом из cookie
text = "Фильтр:"
+"n-"+filter[1]['name']
+"n-"+filter[1]['field']
+"n-"+filter[1]['sortdir']
+"n-"+filter[1]['search'];
alert(text);
// изменяем данные и обратно сохраняем массив в cookie
filter[1]['name']="Без договора"
filter[1]['sortdir']="1";
filter[1]['search']="900";
filter=JSON.stringify(filter);//конвертирование в строку
$.cookie('filter',filter );//запись в куки
});
</script>
Собственно по полочкам все разобрано в комментариях, поэтому мне остается лишь подтвердить написанное. С помощью плагина jquery.cookie.js, мы получаем значение записи с ключом filter, затем преобразуем полученную строку в JavaScript массив и в дальнейшем выводим некоторые из его полей, а также устанавливаем новые значения и записываем массив обратно в cookie.
Ну, вот теперь мы знаем как можно работать с массивом полученным из cookie, изменять его значения и записывать обратно. Уверяю вас эти скромные знания полученные сегодня еще не раз пригодятся вам в будущем.
Для тек кто хочет работать исключительно в JS и иметь возможность сохранять массив в cookie, а также добавлять в него элементы и редактировать их, я выкладываю следующий скрипт:
$(document).ready(function(){
var arr = schitivaem_massiv(); // получаем массив из куков
alert(arr.length);// выводим количество элементов
//добавляем в конец массива новую записть (Можно добавить указать любые ключи и значения)
dobavlyaem_v_massiv({
"name":"Новая группа",
"field":"Имя",
"sortdir":-1,
"search":""
});
});
// запись елемента массива в cookie
function dobavlyaem_v_massiv(obj){
var arr = schitivaem_massiv();//получаем текущее состояние массива
arr[arr.length]=obj; //добавляем элемент в конец
var str = JSON.stringify(arr);//конвертируем в строку
$.cookie('arr',str);//записываем массив в куки
}
function schitivaem_massiv(){
var dataArr=$.cookie('arr');//считываем данные из куков
//если массив небы обнаружен, иницилизируем его
if(dataArr===null){
dataArr = inicializiruem_massiv();
//возвращаем инициализированный пустой маасив
}
//возвращаем полученный массив
return JSON.parse (dataArr);
}
//другими словами создаем пустой массив
function inicializiruem_massiv(){
var str = JSON.stringify(new Array());//конвертируем в строку
$.cookie('arr',str);//записываем массив в куки
return str1;
}
Этот код демонстрирует, то как можно создавать ассоциативные записи и сохранять их в одну куку.
Обратиться к каждому из ключей после считывания массива из куков можно будет таким образом:
alert(arr[0]. name);
alert(arr[0]. field);
alert(arr[1]. name);
alert(arr[1]. field);
и.тд.
Каждый раз при обращении к скрипту, массив из cookie будет попадать на обработку и дополняться новым элементом. Не сложно будет модернизировать код таким образом, чтобы контролировать запись и изменение параметров.
Скачать исходный код ( Скачали: 34 чел. )
Уверен, что эти функции будут полезны многим и явятся основой для решения поставленных задач.
