2017-04-22 1 views
0

J'apprends jquery et j'ai trouvé le problème de stocker des données de tableau html dans un tableau 2D. Au lieu d'utiliser des boucles imbriquées, je cherchais des fonctions jquery qui me permettraient de faire la même chose. J'ai trouvé this method qui semble faire le travail.Stockage sélectif des données de table dans le tableau 2d

var tRows = $('tr').map(function() { 
    return [$(this).find('td').map(function() { 
    return $(this).text() 
    }).get()] 
}).get() 

console.log(tRows) 

I'd like to know, how I can use a condition, in the given code, to check if the first td of a tr is empty or not (or some other condition in general) and thus not add that row to the final array.

EDIT:

Lire les commentaires et la construction sur this fiddle, j'ai maintenant

var tRows = $('tr').map(function() { 
    var arr = $(this).find('td').map(function() { 
    return $(this).text() 
    }).get(); 

    if (arr[0].length) return[arr]; 
}).get() 

Cela fonctionne un peu, mais j'espérais vérifier l'état de la carte intérieure et renvoyer une valeur NULL au lieu du tableau entier. Du discussion here, il semble qu'il n'est pas possible d'annuler l'appel de carte interne à mi-chemin, et il retournera le tableau entier. On dirait que les boucles pourraient être mieux à la fin pour ce travail, ou ai-je raté quelque chose?

+0

'map()' prend paramètre qui vous donne l'index de l'élément en cours afin que vous puissiez l'utiliser et vérifier la longueur du texte comme https: // jsFiddle .net/Lg0wyt9u/1816/ –

+0

@NenadVracar Oh, je voulais dire en fait ne pas ajouter la rangée entière ie le tableau au tableau 2d, au lieu de la cellule. Mais je vais essayer de construire sur le violon pour y parvenir. –

+0

'return return $ (this) .text() || undefined' – Thomas

Répondre

0

En supposant que le code affiché travaille pour vous ...

Si vous voulez que le .text du premier td pas vide de chaque ligne, l'utilisation d'une combinaison de sélecteurs CSS peut être la solution.

:first-child
:not
:empty

EDIT
D'accord ... J'amélioré un peu.
On dirait qu'il peut y avoir quelques espaces dans un vide td ... J'ai donc utilisé un regex pour le tester.

Voici les nouvelles choses que je:
:first
méthode JavaScript .test()
méthode JavaScript .trim()

Et le CodePen où je tryed.

$(document).ready(function(){ 
    console.clear(); 
    console.log("loading..."); 

    var tRows = $('tr').map(function() { 
    return [$(this).find('td:first').map(function() { 
     var pattern = /^\s+$/; 
     if($(this).text()!="" && !pattern.test($(this).text())){ 
     return $(this).text().trim(); 
     } 
    }).get()] 
    }).get() 

    console.log(tRows) 
}); 

Ce retour: [["blah1],[],[blah7]], dans le CodePen ...
Si vous ne voulez pas un vide au milieu:

Deuxième CodePen

$(document).ready(function(){ 
    console.clear(); 
    console.log("loading..."); 

    var tRows = $('tr').map(function() { 
    var arr = [$(this).find('td:first').map(function() { 
     var pattern = /^\s+$/; 
     if($(this).text()!="" && !pattern.test($(this).text())){ 
     return $(this).text().trim(); 
     } 
    }).get()]; 

    if(arr[0]!=""){ 
     return arr; 
    } 
    }).get() 

    console.log(tRows) 
}); 

Ce retour: [["blah1],[blah7]]





2ème ÉDITION
Cela peut également être réalisé de cette façon.
(cela implique une seule boucle et le code est plus simple à lire).
Voir 3 CodePen

$(document).ready(function(){ 
    console.clear(); 
    console.log("loading..."); 

    var arr=[]; 
    var counter=0; 

    $('tr').each(function() { 
    var thisTDtext = [$(this).find("td").first().text().trim()]; 

    if(thisTDtext!=""){ 
     arr[counter] = thisTDtext; 
     counter++; 
    } 
    }); 

    console.log(JSON.stringify(arr)); 

}); 

Ce retour aussi: [["blah1],[blah7]]

+0

Rejette: Uncaught Erreur: Erreur de syntaxe, expression non reconnue: tr: premier-enfant (td: not (: vide())) –

+0

Ok ... attendez, je vais essayer dans CodePen. –

+0

Je l'ai amélioré un peu ... Essayez! –