Filtrowanie elementów w tablicy JavaScript przy użyciu jQuery

Question

Mam tablicę JavaScript jak poniżej, którą trzeba filtrować, aby uzyskać prawidłowe wartości potomne z poniższych danych testowych.

var arrChildOptions2 = [ 
     {Parent:'opt1',Value:'opt1',Text:'Parent1 - Child 1'}, 
     {Parent:'opt2',Value:'opt1',Text:'Parent 2 - Child 1'}, 
     {Parent:'opt2',Value:'opt2',Text:'Parent 2 - Child 2'} 
    ]; 

Wartości są używane do wypełnienia listy rozwijanej na podstawie zdarzenia zmiany w rozwijanym menu rodzica, jak poniżej.

$(function() { 
    $('#ddl1').change(function() { 
     $('#ddl2 option:gt(0)').remove(); 
     $('#ddl2').addItems('#ddl2', arrChildOptions2[Parent=opt2]); 
    }); 
}); 

gdzie additems to funkcja, która przechodzi przez macierz. Problem polega na tym, że nie mogę go filtrować według rodzica, próbowałem używać zawiera i powyższego arrChildOptions2 [Parent = opt2], ale nie mogę go filtrować, wolałbym znaleźć porządek rozwiązanie zamiast używać pętli for? Wszelkie pomysły, okrzyki

Answer 1

Możesz mieć więcej szczęścia używając funkcji jQuery.grep(), niż bawić się z pętlami.

Ta funkcja "Znajduje elementy tablicy spełniającej funkcję filtru, nie ma to wpływu na oryginalną tablicę".

Answer 2

Tak spróbować jquery grep, tak:

arr = jQuery.grep(JSON_ARRAY, index); 

Answer 3

array.filter() istnieje w waniliowym JavaScript:

function isBigEnough(element) { 
    return element >= 10; 
} 
var filtered = [12, 5, 8, 130, 44].filter(isBigEnough); 
// filtered is [12, 130, 44] 

To strona dokumentacja zawiera PolyFill dla starszych przeglądarek:

if (!Array.prototype.filter) 
{ 
    Array.prototype.filter = function(fun /*, thisArg */) 
    { 
    "use strict"; 

    if (this === void 0 || this === null) 
     throw new TypeError(); 

    var t = Object(this); 
    var len = t.length >>> 0; 
    if (typeof fun !== "function") 
     throw new TypeError(); 

    var res = []; 
    var thisArg = arguments.length >= 2 ? arguments[1] : void 0; 
    for (var i = 0; i < len; i++) 
    { 
     if (i in t) 
     { 
     var val = t[i]; 

     // NOTE: Technically this should Object.defineProperty at 
     //  the next index, as push can be affected by 
     //  properties on Object.prototype and Array.prototype. 
     //  But that method's new, and collisions should be 
     //  rare, so use the more-compatible alternative. 
     if (fun.call(thisArg, val, i, t)) 
      res.push(val); 
     } 
    } 

    return res; 
    }; 
} 

Answer 4

ty może użyć funkcji jQuery.filter() do skonstruowania nowego jQuery ob z podzbioru pasujących elementów.

var result = [ 
 
     {Parent:'opt1',Value:'opt1',Text:'Parent1 - Child 1'}, 
 
     {Parent:'opt2',Value:'opt1',Text:'Parent 2 - Child 1'}, 
 
     {Parent:'opt2',Value:'opt2',Text:'Parent 2 - Child 2'} 
 
    ]; 
 
    
 
     
 
var filteredResult = $(result).filter(function(idx) { 
 
    return result[idx].Parent === 'opt2'; 
 
});   
 
    
 
    
 
var options = $("#result-list"); 
 
$.each(filteredResult, function() { 
 
    options.append($("<option />").val(this.Value).text(this.Text)); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 

 
<select id="result-list" name="select" title="List"/>