simpele loop door buttons om id te veranderen

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

OutSystems Developer

Bedrijfsomschrijving Deze organisatie is een toonaangevende speler in de vastgoedbranche en telt momenteel ruim 500 medewerkers. Met meer dan 150 applicaties staat er een complex applicatielandschap, bestaande uit standaard- en maatwerkapplicaties. De maatwerkapplicaties worden ontwikkeld door een inhouse development team. Het doel voor de komende periode is het verder vernieuwen en optimaliseren van het huidige applicatielandschap. Zo staat de organisatie aan de vooravond van de implementatie van een gloednieuw applicatiehuis, waar OutSystems een belangrijke rol in speelt. Binnen deze rol word je als OutSystems Developer verantwoordelijk voor de ontwikkeling van uiteenlopende applicaties met OutSystems. Om het nieuwe applicatiehuis te implementeren

Bekijk vacature »

Dennis WhoCares

Dennis WhoCares

13/09/2015 15:50:18
Quote Anchor link
Hi all,

ik heb een menu :
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
<ul class="drop_menu">
        <li><a href="#" id="active" class="openLink">Button 1</a></li>
        <li><a href="#">Button 2</a><ul class="submenu">
            <li><a href="#" class="openMenu">Subbutton 1</a></li>
            <li><a href="#" class="openMenu">Subbutton 2</a></li>
        </ul></li>
        <li><a href="#" class="openLink">Button 3</a></li>
        <li><a href="#" class="openLink">Button 4</a></li>
    </ul>


Nou wil ik dit afhandelen met jquery:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
$('body').on('click', '.openMenu', function (event){
        event.preventDefault();
        $('html, body').animate({scrollTop: '0px'}, 500);
        var tMenu = $(this).attr('href');
        $( '#menukaart').load('menu/' + tMenu );
        $('#menukaart').show(1000);
    });

    $('body').on('click', '.openLink', function (event){
        event.preventDefault();
        var tButton = $(this);
        tPage = tButton.attr('href');
        //Loop hier
        tButton.attr("id","active");
        
        $( '#section').load('pages/' + tPage );
        
        $('html, body').animate({scrollTop: '0px'}, 500);
    });


Zoals je hierboven al ziet, veranderd de knop waar ik op klik (van .openLink) het ID naar active.
Maar dan heb ik straks dus alle knoppen op active staan.
Ik zou graag door de .sub_menu willen loopen en van alle A objecten het ID leeg maken.
En daarna pas mijn huidige knop op active zetten

Ik denk dat dit niet bepaald zo netjes is:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
$('.drop_menu').children('li').each(function () {
            $(this).children('a').each(function () {
                $(this).attr("id","");
            });
        });



Heeft er iemand een quick-fix voor me ?
Gewijzigd op 13/09/2015 16:05:29 door Dennis WhoCares
 
PHP hulp

PHP hulp

02/12/2020 17:43:07
 
Johan K

Johan K

13/09/2015 16:21:24
Quote Anchor link
https://www.google.nl/webhp?sourceid=chrome-instant&ion=1&espv=2&es_th=1&ie=UTF-8#es_th=1&q=html%20ids
Quote:
The id selector uses the id attribute of an HTML element to select a specific element. An id should be unique within a page, so the id selector is used if you want to select a single, unique element. To select an element with a specific id, write a hash character, followed by the id of the element.


Dus ik weet niet wat je allemaal aan het doen ben, maar ik ga geen brakke "quick fix" voor je schrijven tenzij je bereid ben deze opstelling te veranderen zoals dat normaal gaat, gewoon via classes. Ik ben bang dat je het concept van id's en classes precies hebt omgedraaid.

In jquery heb je mooie functies die dat kunnen doen:
https://api.jquery.com/category/manipulation/class-attribute/
Gewijzigd op 13/09/2015 16:51:36 door Johan K
 
Dennis WhoCares

Dennis WhoCares

13/09/2015 16:56:48
Quote Anchor link
Hi Johan,

inderdaad "An id should be unique within a page"
Zal een paar dingen omdraaien, drop_menu en sub_menu horen id te zijn

Hierbij schiet me iets anders te binnen:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
$('#active').attr("id","");


doet ook wat ik wil :D
Gewijzigd op 13/09/2015 17:19:53 door Dennis WhoCares
 
Remco van der Velde

Remco van der Velde

14/09/2015 13:31:20
Quote Anchor link
denk dat je beter addClass / removeClass kan gebruiken (active) ipv attr('id'), normaliter zet je de id 1 malig en veranderd deze niet in de page
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.