Visualizzazione dei risultati da 1 a 3 su 3
  1. #1
    Utente di HTML.it L'avatar di Scream
    Registrato dal
    Apr 2002
    Messaggi
    228

    [jquery] raggruppare array in optgroup

    Ciao a tutti, tramite una chiamata AJAX ottengo dei dati in questo modo (ho accorciato la stringa per comodità):

    codice:
    {
      "frutta":[
        "Angurie - 3"
        "Angurie - 5"
        "Banane",
        "Kiwi",
        "Mele",
        "Meloni - 3",
        "Meloni - 4",
        "Meloni - 10",
        "Limoni"
      ]
    }
    Dovrei creare una cosa tipo questa:

    codice:
    <select>
      <optgroup label="Angurie">
        <option>Angurie - 3</option>
        <option>Angurie - 5</option>
      </optgroup>
      <option>Banane</option>
      <option>Kiwi</option>
      <option>Mele</option>
      <optgroup label="Meloni">
        <option>Meloni - 3</option>
        <option>Meloni - 4</option>
        <option>Meloni - 10</option>
      </optgroup>
      <option>Limoni</option>
    </select>
    In pratica se c'è un numero mi raggruppa le option con un optgroup
    Ho creato questo script, ma non ottengo quello che voglio

    codice:
    $.each(data.frutta, function(i,value){
      if (/\d/.test(value)) {
        if($('optgroup').attr('label')==value) {
          cb='\n  <option>'+value+'</option>';
        } else {
          cb='\n<optgroup label="'+value.replace(/[^A-Za-z]+/g, '')+'">\n  <option>'+value+'</option></optgroup>';
        }
      } else {
        if($('optgroup').attr('label')==value) {
          cb='\n</optgroup>\n<option>'+value+'</option>';
        } else {
          cb='\n<option>'+value+'</option>';
        }
      }
      $('#fruttap').append(cb);
    });
    bensì questo:

    codice:
    <select>
      <optgroup label="Angurie">
        <option>Angurie - 3</option>
      </optgroup>
      <optgroup label="Angurie">
        <option>Angurie - 5</option>
      </optgroup>
      <option>Banane</option>
      <option>Kiwi</option>
      <option>Mele</option>
      <optgroup label="Meloni">
        <option>Meloni - 3</option>
      </optgroup>
      <optgroup label="Meloni">
        <option>Meloni - 4</option>
      </optgroup>
      <optgroup label="Meloni">
        <option>Meloni - 10</option>
      </optgroup>
      <option>Limoni</option>
    </select>
    Qualcuno sa come correggere?

  2. #2
    Utente di HTML.it L'avatar di Xinod
    Registrato dal
    Sep 2000
    Messaggi
    13,649
    al volo farei una cosa del genere
    codice:
    $.each(data.frutta, function(i,value){
      var cb=$('<option>'+value+'</option>');
      if (/\d/.test(value)) {
    	var label=value.replace(/[^A-Za-z]+/g, '');
    	var optGroup=$('optgroup[label="'+label+'"]');
    	
    	if(!optGroup.length){
    		optGroup = $('<optgroup label="'+label+'"></optgroup>').appendTo('#fruttap')
    	} 
    	optGroup.append(cb)
      } else {
    	$('#fruttap').append(cb);
      }  
    });
    che appenderebbe correttamente anche nel caso i tuoi valori non fossero in ordine
    codice:
    {
      "frutta":[
        "Angurie - 3",
        "Banane",
        "Kiwi",
        "Mele",
        "Meloni - 3",
        "Meloni - 4",
        "Meloni - 10",
        "Limoni",
        "Angurie - 5"
      ]
    }
    ciao

  3. #3
    Utente di HTML.it L'avatar di Scream
    Registrato dal
    Apr 2002
    Messaggi
    228
    è perfetto, grazie

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2024 vBulletin Solutions, Inc. All rights reserved.