Avatar billede Slettet bruger
06. september 2005 - 21:32 Der er 30 kommentarer og
1 løsning

Skjule rækker ud fra classname

Jeg vil gerne have lavet en javascript-funktion der kan skjule og vise rækker (<tr>) ud fra dens classname.

Jeg har 4 funktioner til dette (tak barklund), men jeg kan stadig ikke helt få det til at virke (Jeg kalder det vha onclick="RowVisibility(this.id);":

function RowVisibility(id)
            {
            var oElement = getElementsByClassName(document, id);
            var aOldClasses = oElement.className.split(\" \");
            var ClassIsHidden = false;
            for (i = 0; i < aOldClasses.length; i++)
                {
                if(aOldClasses[i] == 'hidden')
                    {
                    ClassIsHidden = true;
                    }
                }
           
            if(ClassIsHidden == true)
                {
                removeClass(oElement, 'hidden');
                }
            else
                {
                addClass(oElement, 'hidden');
                }
            }
       
        function getElementsByClassName(node, classname)
            {
            var a = [];
            var re = new RegExp('\\\\b' + classname + '\\\\b');
            var els = node.getElementsByTagName(\"*\");
            for(var i=0,j=els.length; i<j; i++)
                if(re.test(els[i].className))a.push(els[i]);
            return a;
            }
       
        // Tilføj en klasse til et element. Hvis den allerede findes tilføjes den ikke.
        function addClass(oElement, sAddClassName)
            {
            var aOldClasses = oElement.className.split(\" \");
            var aNewClasses = new Array();
            var bClassAlreadyExists = false;
            for (i = 0; i < aOldClasses.length; i++)
                {
                if (aOldClasses[i] == sAddClassName)
                    {
                    bClassAlreadyExists = true;
                    }
                else
                    {
                    aNewClasses[aNewClasses.length] = aOldClasses[i];
                    }
                }
            if (! bClassAlreadyExists)
                {
                aNewClasses[aNewClasses.length] = sAddClassName;
                oElement.className = aNewClasses.join(\" \");
                }
            }
       
        // Fjern en klasse fra et element.
        function removeClass(oElement, sRemoveClassName)
            {
            var aOldClasses = oElement.className.split(\" \");
            var aNewClasses = new Array();
            for (i = 0; i < aOldClasses.length; i++)
                {
                if (aOldClasses[i] != sRemoveClassName)
                    {
                    aNewClasses[aNewClasses.length] = aOldClasses[i];
                    }
                }
            oElement.className = aNewClasses.join(\" \");
            }
Avatar billede Slettet bruger
06. september 2005 - 21:32 #1
- det hele er escaped, da det er skrevet i en php-variabel.
Avatar billede Slettet bruger
06. september 2005 - 21:36 #2
Og jeg får fejlen, at oElement ikke har nogle properties. (var aOldClasses = oElement.className.split(" ");)
Avatar billede softspot Forsker
06. september 2005 - 22:36 #3
Er det ikke fordi getElementsByClassName returnerer et array og du forsøger at checke className på arrayet, hvor du vel gerne vil checke det på hvert enkelt element...?
Avatar billede softspot Forsker
06. september 2005 - 22:38 #4
"checke" betyder i denne sammenhæng splitte ;)
Avatar billede Slettet bruger
07. september 2005 - 08:35 #5
Det kan meget muligt være :o)

Nu får jeg ingen fejl, men der er heller ingen rækker der bliver skjult:
        function RowVisibility(id)
            {
            var oElement = getElementsByClassName(document, id);
            var aOldClasses = oElement;
            var ClassIsHidden = false;
            for (i = 0; i < aOldClasses.length; i++)
                {
                if(aOldClasses[i] == 'hidden')
                    {
                    ClassIsHidden = true;
                    }
                }
           
            if(ClassIsHidden == true)
                {
                removeClass(oElement, 'hidden');
                }
            else
                {
                addClass(oElement, 'hidden');
                }
            }
       
        function getElementsByClassName(node, classname)
            {
            var a = [];
            var re = new RegExp('\\\\b' + classname + '\\\\b');
            var els = node.getElementsByTagName(\"*\");
            for(var i=0,j=els.length; i<j; i++)
                if(re.test(els[i].className))a.push(els[i]);
            return a;
            }
       
        // Tilføj en klasse til et element. Hvis den allerede findes tilføjes den ikke.
        function addClass(oElement, sAddClassName)
            {
            var aOldClasses = oElement;
            var aNewClasses = new Array();
            var bClassAlreadyExists = false;
            for (i = 0; i < aOldClasses.length; i++)
                {
                if (aOldClasses[i] == sAddClassName)
                    {
                    bClassAlreadyExists = true;
                    }
                else
                    {
                    aNewClasses[aNewClasses.length] = aOldClasses[i];
                    }
                }
            if (! bClassAlreadyExists)
                {
                aNewClasses[aNewClasses.length] = sAddClassName;
                oElement.className = aNewClasses.join(\" \");
                }
            }
       
        // Fjern en klasse fra et element.
        function removeClass(oElement, sRemoveClassName)
            {
            var aOldClasses = oElement;
            var aNewClasses = new Array();
            for (i = 0; i < aOldClasses.length; i++)
                {
                if (aOldClasses[i] != sRemoveClassName)
                    {
                    aNewClasses[aNewClasses.length] = aOldClasses[i];
                    }
                }
            oElement.className = aNewClasses.join(\" \");
            }
Avatar billede Slettet bruger
07. september 2005 - 09:43 #6
Jeg er rimelig sikker på, at det er fordi jeg har flere elementer med samme classname, og jeg kan ikke helt finde ud af, hvordan jeg skal sætte (eller fjerne) klassen "hidden" fra dem.
Avatar billede softspot Forsker
07. september 2005 - 11:38 #7
Kan du ikke prøve at poste den kode hvorpå du kører denne rutine...?
Avatar billede roenving Novice
07. september 2005 - 11:44 #8
function RowVisibility(id){
            var oElements = getElementsByClassName(document, id);
            for(j=0;oElements.length>j;j++){
              var aOldClasses = oElements[j].className.split(" ");
              var ClassIsHidden = false;
              for (i = 0; i < aOldClasses.length; i++){
                if(aOldClasses[i] == 'hidden'){
                    ClassIsHidden = true;
                }
              }
              if(ClassIsHidden == true){
                removeClass(oElement, 'hidden');
              }else{
                addClass(oElement, 'hidden');
              }
            }
        }
Avatar billede Slettet bruger
07. september 2005 - 11:44 #9
Skal jeg poste hele "vis kilde"?
Avatar billede roenving Novice
07. september 2005 - 11:49 #10
Hov,

        function RowVisibility(id){
            var oElements = getElementsByClassName(document, id);
            for(j=0;oElements.length>j;j++){
              var aOldClasses = oElements[j].className.split(" ");
              var ClassIsHidden = false;
              for (i = 0; i < aOldClasses.length; i++){
                if(aOldClasses[i] == 'hidden'){
                    ClassIsHidden = true;
                }
              }
              if(ClassIsHidden == true){
                removeClass(oElements[j], 'hidden');
              }else{
                addClass(oElements[j], 'hidden');
              }
            }
        }
Avatar billede softspot Forsker
07. september 2005 - 11:56 #11
Det kan vær du lige skal prøve roenving's forslag først (han kan nem regular expressions og ved derfor nok hvad der er galt :))
Avatar billede roenving Novice
07. september 2005 - 11:58 #12
Min tilføjelse i ovenstående er, at den itererer igennem alle de elementer, som returneres fra getElementsByClassName !-)
Avatar billede softspot Forsker
07. september 2005 - 12:05 #13
Min egen teori var, at den regular expression der benyttes i getElementsByClassName ikke fungerede, en jeg kan som sagt ikke regexp, så jeg vil ikke begynde at foreslå noget så vovet... :)
Avatar billede roenving Novice
07. september 2005 - 12:12 #14
Tjah, den er i hvertfald forvirrende, når der skal dobbelt-dobbelt escapes på special-tegn, men den skulle være god nok, idet den tester om det angivne classname er et helt ord i class-attributten !-)
Avatar billede Slettet bruger
07. september 2005 - 12:31 #15
Det virker med at fjerne "hidden" fra klassen, men den kan ikke tilføje det igen.. :o)
Avatar billede Slettet bruger
07. september 2005 - 12:35 #16
Hvis jeg sætter "standard" til at være "hidden", kan den godt vises ved klik på knappen, og hvis jeg sætter standard til "ikke hidden" (lader være med at skrive et sekundært classname), kan jeg også skjule den.

Men så snart jeg har trykket én gang på knappen, og den første handling er sket, sker der ikke mere ved gentagne tryk på knappen.
Avatar billede roenving Novice
07. september 2005 - 12:40 #17
Kan du ikke prøve at lave et simpelt eksempel og så linke til det ?-)
Avatar billede Slettet bruger
07. september 2005 - 12:43 #18
jo 1 minut.
Avatar billede Slettet bruger
07. september 2005 - 12:48 #19
http://notenet.dk/645926.htm  Men nu virker det slet ikke :o|
Avatar billede Slettet bruger
07. september 2005 - 12:49 #20
- Jo nu gør den.
Avatar billede Slettet bruger
07. september 2005 - 12:53 #21
Men den virker jo som sagt kun første gang, og jeg kan ikke gennemskue hvorfor dette er..
Avatar billede roenving Novice
07. september 2005 - 13:01 #22
Sikkert fordi du har ændret den første linje i funktionen addClass:

var aOldClasses = oElement;

-- sæt den tilbage til det, du viste i spørgsmålet !-)
Avatar billede roenving Novice
07. september 2005 - 13:04 #23
Iøvrigt er det ikke tilladt at have id'er, som starter med tal, så brug som generel retningslinje, at du ikke bruger identifikatorer, som starter på den måde (og lad det gælde _alle_ identifikatorer, altså også navne, klasser m.m. !-)
Avatar billede Slettet bruger
07. september 2005 - 13:04 #24
... Du er min helt :D
Avatar billede Slettet bruger
07. september 2005 - 13:04 #25
Hvis i begge smider et svar, så får du 100 point roenving, og softspot du får 50 for din tid :o)
Avatar billede roenving Novice
07. september 2005 - 13:07 #26
Velbekomme '-)
Avatar billede Slettet bruger
07. september 2005 - 13:09 #27
Hver gang jeg tror jeg kan finde ud af javascript, finder jeg ud af, at jeg kun kan en brøkdel ;o)
Avatar billede softspot Forsker
07. september 2005 - 13:11 #28
Din tanke er smuk, wicez, men da jeg ikke bidrog i særlig grad til løsningen, synes jeg du skal beholde dine point - måske du kan give mig dem for noget rigtig hjælp på et senere tidspunkt - men tak for budet :)
Avatar billede Slettet bruger
07. september 2005 - 13:12 #29
Du skal nok få pointene en anden gang så, men jeg ville med glæde give dig pointene en anden gang :o)
Avatar billede roenving Novice
07. september 2005 - 13:22 #30
Tak for point ;~}
Avatar billede Slettet bruger
07. september 2005 - 15:15 #31
Selv tak. Hvis du har tid, må du godt smutte forbi http://www.eksperten.dk/spm/646116
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester