разделение строки из куки на массивы

[mi.rafaylik]

Здравствуйте )
Плагин jquery.cookie подключен.
Я получаю из куки $.cookie("basket") строку такого типа:

Название1:Количество1:Цена1:Розмер1:Цвет1;Название2:Количество2:Цена2:Размер2:Цвет2;Название3:Количество3:Цена3:Размер3:Цвет3; и т.д.

Хочу разбить сначала по символу ";" на массив:

Название:Количество:Цена:Размер:Цвет
Название:Количество:Цена:Размер:Цвет

а потом полученный массив разбить по символу ":" на новые массивы:

Название1
Количество1
Цена1
Размер1
Цвет1

Название2
Количество2
Цена2
Размер2
Цвет2

и т.д.

После чего каждый элемент определённого типа (например каждое название) я буду оборачивать в определённый тэг, например:

<div>
<p class="item-name">Название1</p>
<p class="item-copy">Количество1</p>
<p class="item-price">Цена1</p>
<p class="item-size">Размер1</p>
<p class="item-color">Цвет1</p>
</div>

<div>
<p class="item-name">Название2</p>
<p class="item-copy">Количество2</p>
<p class="item-price">Цена2</p>
<p class="item-size">Размер2</p>
<p class="item-color">Цвет2</p>
</div>

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

basket = decodeURI($.cookie("basket")); // получаю строку из куки
basketArray = basket.split(";"); // разбиваю полученную строку на массив
for (var i=0; i<basketArray.length-1;i++) {
  goodsId = basketArray[i].split(":"); // разбиваю каждый пункт полученного массива на новый массив
};

$('textarea').val( goodsId ); // смотрю результат

В результате я вижу только первый элемент массива (или первый элемент подмассива) вместо списка
В PHP я наверное использовал конкатенацию, но в jQuery не знаю как. Буду рад любым советам )

[Deff]

mi.rafaylik,
Есть LocalStorage - куда можно просто запихнуть сформированны код HTML и куки не потребуются - кроссбраузерное решение для LocalStorage тут => localStorage для IE6-7

Зы - куки в ИЕ 6-8 ограничены четырьмя килобайтами (Дальнейшие версии не тестил,
Русские символы в куках поддерживают не все браузеры (В частности FF
Перевод русского в ескейп последовательность увеличивает длину строки примерно в 4 раза

[Deff]

Хочу разбить сначала по символу ";" на массив:
Название:Количество:Цена:Р� �змер:ЦветНазвание:Количес� �во:Цена:Размер:Цвет

var a='Название1:Количество1:Цена1:Розмер1:Цвет1;Название2:Количество2:Цена2:Размер2:Цвет2;Название3:Количество3:Цена3:Размер3:Цвет3;'
var Zarr = a.replace(/;\s*$/,'').split(";");
alert(Zarr.join('\n'));
function Buid (Z) {
  var str ='',zJ;
  var arItem =['name','copy','price','size','color']        
    for (var i=0; i<Z.length; i++){
      str+='<div>\n';
         zJ = Z[i].split(":");
           for (var j=0; j<zJ.length; j++){
               str+='<p class="item-'+i+'-'+arItem[j]+'">'+zJ[j]+'</p>\n';
           }str+='</div>\n\n'
     } return str;
}
var OutStr = Buid (Zarr);
alert(OutStr)

В приципе достаточно такого входного массива

Название:Количество:Цена:Размер:Цвет

Цифру в конце запросто пишем в цикле

var a='Название:Количество:Цена:Размер:Цвет';
var Zarr = a.split(":");

function Buid (zJ,N) {
  var  str ='';
  var arItem =['name','copy','price','size','color']        
    for (var i=1; i<=N; i++){
       str+='<div>\n';
           for (var j=0; j<zJ.length; j++){
               str+='<p class="item-'+i+'-'+arItem[j]+'">'+zJ[j]+i+'</p>\n';
           }str+='</div>\n\n'
     } return str;
}
var OutStr = Buid (Zarr,3);
alert(OutStr)

[Telnet]

По мойму Вы просто
goodsId = basketArray[i].split(":");
при каждой итерации перезаписываете переменную goodsId поэтому и видите только первое значение
мне кажется Вам нужно переменную goodsId сделать массивом, а потом пройтись по ней в цикле методом wrap для оборачивание в тег p

[mi.rafaylik]

спасибо Deff!
вот что у меня получилось:

var cartA = $.cookie("cart");
var cartB = cartA.split(";");
var cartC = cartB.join('\r\n\r\n');
var cartD = cartC.split(":");
var cartE = cartD.join('\r\n');

$('#result').html( cartE );

получил визуально-правильный результат:

T-Shirt
2 шт
170
размер XS
цвет белый

Shoes
3 шт
520
размер 38
цвет черный

Bag
2 шт
375
размер 42
цвет черный

Jeans
1 шт
430
размер XS
цвет черный

но не понял, как обернуть элементы, например с помощью wrap(), так как они остались в массиве.
т.к. каждую группу я хочу обернуть в <div class='item'></div>
а каждый элемент группы в соответственный ему тэг. это нужно для того, чтоб после редактирования заново собрать массивы в строку, вот такая элиада...

[Deff]

т.к. каждую группу я хочу обернуть в

Там все обернуто - жмите кнопки
Поправил

[mi.rafaylik]

по этому коду (второй не подходит, так как переменные будут разные, т.к. вводяться пользователем):

var a = $.cookie("basket");
var Zarr = a.replace(/;\s*$/,'').split(";");
function Buid (Z) {
  var str ='<div>\n',zJ;
  var arItem =['name','copy','price','size','color']       
    for (var i=0; i<Z.length; i++){
         zJ = Z[i].split(":");

           for (var j=0; j<zJ.length; j++){
               str+='<p class="item-'+zJ[j]+'</p>\n';
           }str+='</div>\n\n'
     } return str;
}
var OutStr = Buid (Zarr);

такой результат:

<div>
<p class="item-T-Shirt</p>
<p class="item-2</p>
<p class="item-170</p>
<p class="item-размер XS, </p>
<p class="item-цвет белый, </p>
</div>

<p class="item-Shoes</p>
<p class="item-2</p>
<p class="item-520</p>
<p class="item-размер 38, </p>
<p class="item-цвет черный, </p>
</div>

<p class="item-Bag</p>
<p class="item-2</p>
<p class="item-375</p>
<p class="item-</p>
<p class="item-цвет черный, </p>
</div>

<p class="item-Jeans</p>
<p class="item-2</p>
<p class="item-430</p>
<p class="item-размер XS, </p>
<p class="item-цвет черный, </p>
</div>

почему-то полностью обернут только первый div, а p не получили своих class, а тэг незакрытый я исправлю, не проблема

[mi.rafaylik]

вы просто золото )
я так понимаю - случайные цифры в конце каждого значения, это похоже на id которые нужно присвоить div?
вот исправленный код:

var a = $.cookie("basket");
var Zarr = a.replace(/;\s*$/,'').split(";");
function Buid (Z) {
  var str ='',zJ;
  var arItem =['name','copy','price','size','color']       
    for (var i=0; i<Z.length; i++){
      str+='<div>\n';
         zJ = Z[i].split(":");

           for (var j=0; j<zJ.length; j++){
               str+='<p class="item-'+arItem[j]+'">'+zJ[j]+'</p>\n';
           }str+='</div>\n\n'
     } return str;
}
var OutStr = Buid (Zarr);

и результат:

<div>
<p class="item-name">T-Shirt</p>
<p class="item-copy">2</p>
<p class="item-price">170</p>
<p class="item-size">размер XS, </p>
<p class="item-color">цвет белый, </p>
</div>

<div>
<p class="item-name">Shoes</p>
<p class="item-copy">2</p>
<p class="item-price">520</p>
<p class="item-size">размер 38, </p>
<p class="item-color">цвет черный, </p>
</div>

<div>
<p class="item-name">Bag</p>
<p class="item-copy">2</p>
<p class="item-price">375</p>
<p class="item-size"></p>
<p class="item-color">цвет черный, </p>
</div>

<div>
<p class="item-name">Jeans</p>
<p class="item-copy">2</p>
<p class="item-price">430</p>
<p class="item-size">размер XS, </p>
<p class="item-color">цвет черный, </p>
</div>

[Deff]

mi.rafaylik,
Нун такой вид массива
name:Название; copy:Количество; price:Цена; size:Размер; color:Цвет
Посколь англицкое приходится на соответствующий тег - и если число позиций возрастет , к примеру: скидка = скрипт придётся каждый раз поправлять

[mi.rafaylik]

Deff,
нее, число позиций останется, всё отлично.
огромное спасибо, ибо потратил больше суток на поиски нужной документации )

Весело мне будет, когда после внесения изменений я буду обратно в строку куки эти данные собирать .....
Думаю, по аналогии смогу совершить обратный процесс?