Toon posts:

[javascript] filterlist

Pagina: 1
Acties:

Verwijderd

Topicstarter
Besten,

PS: Ik ben nog niet zo goed in javascript. Dit is een bestaande code die ik heb herschreven.
Ik probeer een option-list te filteren door enkel naar de eerste letters te kijken.

index.html
code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
<html>
<head>
    <SCRIPT src="filterlist.js" type=text/javascript></SCRIPT>
</head>
<body>
    <FORM name=myform action="">
        <SELECT size=10 name=myselect>
            <OPTION>Keanu Reeves
            <OPTION>Laurence Fishburne
            <OPTION>Monica Bellucci
            <OPTION>Daniel Bernhardt
            <OPTION>Nona Gaye
            <OPTION>Lachy Hulme
            <OPTION>Nathaniel Lees
            <OPTION>Harry J. Lennix
            <OPTION>Matt McColm 
            <OPTION>Carrie-Anne Moss
            <OPTION>Collin Chou
            <OPTION>Genevieve O'Reilly
            <OPTION>Harold Perrineau Jr.
            <OPTION>Jada Pinkett Smith
            <OPTION>Adrian Rayment
            <OPTION>Neil Rayment
            <OPTION>Bruce Spence
            <OPTION>Hugo Weaving
            <OPTION>Lambert Wilson
            <OPTION>Anthony Wong
            <OPTION>Walter O'Riley
            <OPTION>Zach Taylor
            <OPTION>Yuri Andropov
            <OPTION>Xavier
            <OPTION>Tom Selleck
            <OPTION>Heather Graham
            <OPTION>Ursula Andrews
            <OPTION>Victoria Jackson
            <OPTION>Vivian Vance
            <OPTION>Star Jones
            <OPTION>Steve McQueen</OPTION>
        </SELECT>
        <SCRIPT type=text/javascript>
            var myfilter = new filterlist(document.myform.myselect);
        </SCRIPT>
        <INPUT onkeyup=myfilter.set(this.value) name=regexp>
        <INPUT onclick="myfilter.reset();this.form.regexp.value=''" type=button value=Clear> 
    </FORM>
</body>
</html>


filterlist.js
code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
function filterlist(selectobj) 
{
    // HTML SELECT object
    this.selectobj = selectobj;

    // Make a copy of the options array
    this.optionscopy = new Array();
    for (var i=0; i < selectobj.options.length; i++) 
    {
            this.optionscopy[i] = new Option();
            this.optionscopy[i].text = selectobj.options[i].text;
            this.optionscopy[i].value = selectobj.options[i].value;
    }

    // This method resets the select list to the original state.
    // It also unselects all of the options.
    this.reset = function()
    {
            this.set("");
    }

    //--------------------------------------------------
    this.set = function(pattern)
    {
        // This method removes all of the options from the select list,
        // then adds only the options that match the pattern regexp.
        // It also unselects all of the options.    
        // In case of a regexp error, returns false

            var loop=0, index=0, regexp, e;

        // Clear the select list so nothing is displayed
            this.selectobj.options.length = 0;

            // Loop through the entire select list
            for (loop=0; loop < this.optionscopy.length; loop++) 
        {
            // Check if we have a match
                if (Left(this.optionscopy[loop].text, this.selectobj.text))
            {
                // We have a match, so add this option to the select list
                    this.selectobj.options.length = index + 1;
                    this.selectobj.options[index].text = this.optionscopy[loop].text;
                    this.selectobj.options[index].value = this.optionscopy[loop].value;
                    this.selectobj.options[index].selected = false;

                    // Increment the index
                    index++;
                }
        }
        function Left(option, str)
        {
            var n = String(str).length;

            if (String(option).substring(0,n) = String(str).substring(0,n));
            {
                return true; 
            }
            else
            {
                return false;
            }
        } 
    }
}


Hij geeft steeds een error op de pagina zodra er iets in de selectie wordt getypt.
Volgems mij zit de fout in functie Left.
Ofwel geeft hij niet de juiste parameters mee of 'this.selectobj.text' moet een andere waarde bevatten.

  • gorgi_19
  • Registratie: Mei 2002
  • Laatst online: 21-05 16:50

gorgi_19

Kruimeltjes zijn weer op :9

DHTML en HTML hoort thuis in Webdesign & Graphics
>> Webdesign & Graphics

Digitaal onderwijsmateriaal, leermateriaal voor hbo


  • André
  • Registratie: Maart 2002
  • Laatst online: 18-05 16:30

André

Analytics dude

substring moet je vervangen met substr :)

  • RM-rf
  • Registratie: September 2000
  • Laatst online: 21-05 17:42

RM-rf

1 2 3 4 5 7 6 8 9

André schreef op 05 oktober 2004 @ 11:21:
substring moet je vervangen met substr :)
* RM-rf gooit een banaan naar André: 'php-aapje!'

Ecmascript: zoek naar de string-method String.substring()
http://www.ecma-internati...ns/standards/Ecma-262.htm

staat op pagina 105:
15.5.4.15 String.prototype.substring (start, end)
The substring method takes two arguments, start and end, and returns a substring of the result of
converting this object to a string, starting from character position start and running to, but not
including, character position end of the string (or through the end of the string is end is undefined).
The result is a string value, not a String object.
If either argument is NaN or negative, it is replaced with zero; if either argument is larger than the
length of the string, it is replaced with the length of the string.
If start is larger than end, they are swapped.
The following steps are taken:
1. Call ToString, giving it the this value as its argument.
2. Compute the number of characters in Result(1).
3. Call ToInteger(start).
4. If end is undefined, use Result(2); else use ToInteger(end).
5. Compute min(max(Result(3), 0), Result(2)).
6. Compute min(max(Result(4), 0), Result(2)).
7. Compute min(Result(5), Result(6)).
8. Compute max(Result(5), Result(6)).
9. Return a string whose length is the difference between Result(8) and Result(7), containing
characters from Result(1), namely the characters with indices Result(7) through Result(8)−1, in
ascending order.
PHP http://de.php.net/substr ... voor alle mensen die moeite hebben met complete method-namen typen ... :P

[ Voor 60% gewijzigd door RM-rf op 05-10-2004 11:28 ]

Intelligente mensen zoeken in tijden van crisis naar oplossingen, Idioten zoeken dan schuldigen


  • André
  • Registratie: Maart 2002
  • Laatst online: 18-05 16:30

André

Analytics dude

RM-rf schreef op 05 oktober 2004 @ 11:25:
[...]

* RM-rf gooit een banaan naar André: 'php-aapje!'
* André gooit de banaan terug:

code:
1
2
3
alert("RM-rf is AAP".substr(9))

// resultaat = "AAP";

:7

  • crisp
  • Registratie: Februari 2000
  • Laatst online: 00:47

crisp

Devver

Pixelated

Zowel substr als substring zijn string-methods in JS:

http://devedge.netscape.c...rence/string.html#1194618
http://devedge.netscape.c...rence/string.html#1194665

Enkel IE is buggy met substr:
JavaScript:
1
alert("André is AAP".substr(-3))

Intentionally left blank


  • André
  • Registratie: Maart 2002
  • Laatst online: 18-05 16:30

André

Analytics dude

In regel 55 moet een dubbele = staan trouwens :)

Het rare is dat als ik de functie left weghaal dat hij al meer doet. En je hebt zeker ook nog nooit van prototyping gehoord?

[ Voor 61% gewijzigd door André op 05-10-2004 12:00 ]


  • RM-rf
  • Registratie: September 2000
  • Laatst online: 21-05 17:42

RM-rf

1 2 3 4 5 7 6 8 9

ik kom uit op de regel 39, dat moet worden
code:
1
if ( Left(this.optionscopy[loop].text, this.selectobj.form.regexp.value) )

oftewel, de lengte van de ingegeven sorteerwaarde moet worden gechecked, niet de lengte van de text-waarde van de options zelf (die altijd even lang is, als de te controleren option-value)

verder zou ik de function Left() wat korter maken:
code:
1
2
3
4
5
function Left(option, str)
{
    var n = String(str).length;
    return (String(option).substring(0,n) == String(str).substring(0,n));
}
Maar dat is volgens mij meer een kwestie van smaak

Intelligente mensen zoeken in tijden van crisis naar oplossingen, Idioten zoeken dan schuldigen

Pagina: 1