Нарезка массив в дальнейшем массивы на основе значений

Question

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

["1_Sophie_Gray", "2_Atlantic_Bay", "2_Trait", "3_Tammy", "3_Flipback", "3_Duck_Dodge", "3_Bambini", "4_Bellisima"]

Что мне нужно сделать, это отдельный из них и создайте ul для каждого из списков (1 - женская одежда, 2 мужские одежды, 3 детской одежды и т. д.). Я, хотя лучший способ сделать это, - это пропустить этот массив и разделить значения на разные собственные массивы на основе номера списка, например.

["1_Sophie_Gray"]

["2_Atlantic_Bay", "2_Trait"]

["3_Tammy", "3_Flipback", "3_Duck_Dodge"]

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

<div class="store_brands"> 
<p id="brand_intro"> 
    Brands and departments available in this store: 
</p> 
<h4>list 1</h4> 
<ul> 
    <li> 
     <img src="/images/v3/brand_logos/wallis.gif" alt="list 1 brands" /> 
    </li> 
</ul> 
<h4>list 2</h4> 
<ul> 
    <li> 
     <img src="/images/v3/brand_logos/atlantic_bay.gif" alt="list 2 brands" /> 
    </li> 
    <li> 
     <img src="/images/v3/brand_logos/trait.gif" alt="list 2 brands" /> 
    </li> 
</ul> 
<h4>list 3</h4> 
<ul> 
    <li> 
     <img src="/images/v3/brand_logos/tammy.gif" alt="list 3 brands" /> 
    </li> 
    <li> 
     <img src="/images/v3/brand_logos/flipback.gif" alt="list 3 brands" /> 
    </li> 
    <li> 
     <img src="/images/v3/brand_logos/duck_dodge.gif" alt="list 3 brands" /> 
    </li> 
</ul> 

Вот мой код:

function inStoreBrands (storeData) { 

var brandsArr = [], 
    listNum, 
    fileName, 
    brandImgsPath = "/images/v3/brand_logos/",  
    brandList = '<div class="store_brands"><p id="brand_intro">Brands and departments available in this store:</p>', 
    brandResults = storeData.brands, 
    brands = brandResults.split(", "), 
    listCount = 1, 
    titleText = "list 1"; 

     for (var i=0; i<brands.length; i++) { 
      listNum = brands[i].split(/_(.+)/)[0]; 
      listNum = parseInt(listNum); 

      fileName = brands[i].split(/_(.+)/)[1]; 
      fileName = fileName.toString().toLowerCase(); 

      function addToArray() { 
       brandsArr.push(brandImgsPath + fileName + '.gif'); 
      } 

      if(listNum !== listCount){ 
       buildBrandList(brandsArr, titleText); 
       titleText = "list " + listNum; 
       addToArray(); 
      } else { 
       addToArray(); 
      } 
     } 

function buildBrandList(brandsArr, titleText) { 
    brandList += '<h4>'+titleText+'</h4>'; 
    brandList += '<ul>'; 
    for (i=0; i < brandsArr.length; i++) { 
     brandList += '<li><img src="'+brandsArr[i]+'" alt="'+titleText+' brands" /></li>'; 
    } 
    brandList += '</ul>'; 
    brandsArr = []; 
    listCount++; 
} 

brandList += '</div>';  
return brandList;    
}; 

Я знаю, что логика ужасно испорчено, поэтому причина не работает. Может ли кто-нибудь помочь мне понять это?

Answer 1

Вы не отправлял точные данные для StoreData и как вы построили это - так что я сделал некоторые предположения: see the demo

Answer 2

Простое изменение дизайна может помочь вам. Подумайте о том, как изменить формат создания массива ваших брендов. Например, вместо сохранения 1_Sophie_Gray рассмотрим 1_Sophie-Gray.

var arr1; 
var arr2; 
//etc 

for(i=0;i<brands.length - 1; i++){ //So we've split 1_Sophie-Gray from everything else 
    var tmpArr = brands[i].split('_'); 
    if(tmpArr[0] == 1){    //parse to the correct array 
     arr1.push("brands[i]");  //push into the appropriate array 
    } else if(tmpArr[0] == 2) { 
     arr2.push("brands[i]"); 
    } 
} 

Имейте в виду, что это код psuedo-ish. Надеюсь, это поможет!

-sf

EDIT: Для того, чтобы ответить на вопрос El Guapo в в комментариях. Да, вы можете динамически создавать переменные arr, но вам придется сделать это с небольшой работой из-за части кода. Все примеры кода приведены в VB.Net.

Если вы хотите, чтобы эта функция срабатывала при загрузке страницы. Вы можете создать и зарегистрировать его в функции Page_Load, используя метод Page.ClientScript.RegisterClientScriptBlock. Пример в Page_Load()

Protected Overrides Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) 
    If Not ScriptManager1.IsInAsyncPostBack Then 
     MyBase.Page_Load(sender, e) 
     'Do whatever else you need to do on Page Load 

     Page.Form.DefaultButton = btnSubmit.UniqueID 
     Page.ClientScript.RegisterClientScriptBlock(Me.GetType(), Guid.NewGuid().ToString(),createjs()) 

End Sub 

Public Function createjs() As String 
    Dim str As String = "" 
    str = "<script type='text/javascript' language='javascript'>function ClickSubmit(){var btn = '" & btnSubmit.ClientID & "'; btn = getElementSomehow(btn); btn.click()};" & _ 
    " <all your javascript> " & _ 
    " //Im using & _ to make things more readable once the js gets created" & _ 
    " </script>" 
    return str 
End Function 

Создание JavaScript из кода позади позволяет передавать в массивах к вашему клиенту, как правило, не будут доступны. Давайте возьмем надуманный пример выше и приблизимся к тому, что вы хотели бы сделать. Скажем обр переменная у вас есть где-то еще, и это определяется следующим образом:

arr = ""1_Sophie_Gray", "2_Atlantic_Bay", "2_Trait", "3_Tammy", "3_Flipback", "3_Duck_Dodge", "3_Bambini", "4_Bellisima"" 

Обратите внимание, что вы можете добавлять, удалять, изменять этот массив целиком из кода .vb. Затем, как только вы захотите. Вы можете бросить его в свой код за функцией, которой было поручено создать ваш javascript на стороне клиента.

Public Function ModifyJS(ByVal PassedArr As String) As String 
    Dim str As String = "" 
    str = "<script type='text/javascript' language='javascript'>function ClickSubmit(){var btn = '" & btnSubmit.ClientID & "'; btn = getElementSomehow(btn); btn.click()};" & _ 
    " <all your javascript> " & _ 
    " var JSarr = [" & PassedArr & "]; " & _ 
    " //Im using & _ to make things more readable once the js gets created" & _ 
    " </script>" 
    return str 
End Function 

И ... тогда это не огромный скачок, чтобы получить здесь:

Public Function ModifyJS(ByVal PassedArr As String, ByVal NoArrays As Integer) As String 
    Dim str As String = "" 
    str = "<script type='text/javascript' language='javascript'>function ClickSubmit(){var btn = '" & btnSubmit.ClientID & "'; btn = getElementSomehow(btn); btn.click()};" & _ 
    " <all your javascript> " & _ 
    " var JSarr = [" & PassedArr & "]; " & _ 
    For i As Integer = 0 To NoArrays 
     str &= " var arr" & i & "=[];" 
    Next 
    " //Im using & _ to make things more readable once the js gets created" & _ 
    " </script>" 
    return str 
End Function 

Надежда, что помогает братан!

-sf