HiveBrain v1.2.0
Get Started
← Back to all entries
patternjavascriptMinor

Filtering a SELECT group using jQuery

Submitted by: @import:stackexchange-codereview··
0
Viewed 0 times
groupjqueryusingselectfiltering

Problem

I want to filter the options of a large select group based on text input in a textbox. I am currently using this code to filter from a SELECT group based on the text of a input box.

Can you please tell me whether there is a more efficient way of doing this? My SELECT group is very large with around 7000 entries, which is why I am looking for the most optimized way.


var fullcelllist = $();
var lastVal ="";

$(window).load(function(){
    $("#celllist option").each(function(){
        fullcelllist.push($(this).val());
    });
});

$("#filtercell").keyup(function() {
    if(lastVal.length "+temparr[i]+""; 
        });
        $("#celllist").html("");
        $("#celllist").append(newopt);
    }
    lastVal = $(this).val();
});

// HERE all OPTIONS using PHP

Solution

Your jQuery could be somewhat more efficient if you minimize $(...) element look-ups by storing them as variables or chaining them.

Also, I think you will see some benefit to replacing some jQuery constructs with their pure JS alternatives ($.each -> for, etc..)

Check out this set of jsPerf tests from this StackOverflow answer.


var fullcelllist = $(),
    lastVal ="",
    $celllistOption = $("#celllist option");

// ...

$("#filtercell").keyup(function() {
    var $this = $(this),
        $thisVal = $this.val();

// ...

Code Snippets

<script>
var fullcelllist = $(),
    lastVal ="",
    $celllistOption = $("#celllist option");

// ...

$("#filtercell").keyup(function() {
    var $this = $(this),
        $thisVal = $this.val();

// ...

Context

StackExchange Code Review Q#20415, answer score: 3

Revisions (0)

No revisions yet.