Het is misschien niet het meest eenvoudige voorbeeld, maar dit doet wel ongeveer wat jij omschrijft (je moet sorteren even wegdenken en vervangen door filterenquote:Op zondag 21 april 2013 11:17 schreef DutchErrorist het volgende:
Ik wil een website maken waar de dingen die getoond worden afhangen van een dropdown menu.
Ik wil dus allereerst een pagina hebben met alles getoond. Dat je dan in een dropdown menu de provincie kan kiezen en dan alleen de geselecteerde onderwerpen van de provincie worden getoond en als je dan in een tweede dropdown menu een merk selecteerd hij alleen dat merk laat zien of de verkopers daarvan, of een combinatie van die twee of alleen een van de twee.
Maar hoe kan ik dat het beste aanpakken?
Oke top en dan nog een vraagje. Het is de bedoeling om de website ook goed te laten weergeven op mobile browsers, maar voor welke CMS of techniek kan ik dan het beste gaan? Want ik zit even rond te kijken en er zijn zoveel verschillende mogelijkhedenquote:Op zondag 21 april 2013 11:29 schreef Devv het volgende:
[..]
Het is misschien niet het meest eenvoudige voorbeeld, maar dit doet wel ongeveer wat jij omschrijft (je moet sorteren even wegdenken en vervangen door filteren).
Angular JS: Filters
Live Demo
Ik gebruik zelf Bootstrap.quote:Op zondag 21 april 2013 12:04 schreef DutchErrorist het volgende:
[..]
Oke top en dan nog een vraagje. Het is de bedoeling om de website ook goed te laten weergeven op mobile browsers, maar voor welke CMS of techniek kan ik dan het beste gaan? Want ik zit even rond te kijken en er zijn zoveel verschillende mogelijkheden
Nou dan moet ik me daar maar eens wat over gaan leren. In ieder geval heel erg bedanktquote:
Ik zit al de hele tijd te kijken hoe ik het het beste kan doen, maar ik krijg het maar niet voor elkaar. Ik kan nergens echt duidelijk vinden hoe ik meerdere filters kan instellen. Ik heb dus een aantal lijsten op de pagina's en die hebben dan dus twee dingen waar ze op gefilterd moeten worden (Merk en provincie).quote:Op zondag 21 april 2013 11:29 schreef Devv het volgende:
[..]
Het is misschien niet het meest eenvoudige voorbeeld, maar dit doet wel ongeveer wat jij omschrijft (je moet sorteren even wegdenken en vervangen door filteren).
Angular JS: Filters
Live Demo
jQuery filter functie werkt daar prima voor.quote:Op zondag 21 april 2013 11:17 schreef DutchErrorist het volgende:
Ik wil een website maken waar de dingen die getoond worden afhangen van een dropdown menu.
Ik wil dus allereerst een pagina hebben met alles getoond. Dat je dan in een dropdown menu de provincie kan kiezen en dan alleen de geselecteerde onderwerpen van de provincie worden getoond en als je dan in een tweede dropdown menu een merk selecteerd hij alleen dat merk laat zien of de verkopers daarvan, of een combinatie van die twee of alleen een van de twee.
Maar hoe kan ik dat het beste aanpakken?
Oeh even kijkenquote:Op zondag 21 april 2013 21:34 schreef boem-dikkie het volgende:
[..]
jQuery filter functie werkt daar prima voor.
http://api.jquery.com/filter/
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 | $(document).ready(function(){ // hide #back-top first $("#back-top").hide(); // fade in #back-top $(function () { $(window).scroll(function () { if ($(this).scrollTop() > 100) { $('#back-top').fadeIn(); } else { $('#back-top').fadeOut(); } }); // scroll body to 0px on click $('#back-top a').click(function () { $('body,html').animate({ scrollTop: 0 }, 800); return false; }); }); }); |
| 1 2 3 4 5 6 | <p id="back-top"> <a href="#top"> <span></span> terug naar boven </a> </p> |
| 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 | #back-top { bottom: 30px; margin-left: 990px; position: fixed; } #back-top a { color: #BBBBBB; display: block; font: 10px/100% Arial,Helvetica,sans-serif; text-align: center; text-decoration: none; text-transform: uppercase; transition: all 1s ease 0s; width: 75px; } #back-top a:hover { color: #000000; } #back-top span { background: url("../images/up-arrow.png") no-repeat scroll center center #DDDDDD; border-radius: 15px 15px 15px 15px; display: block; height: 75px; margin-bottom: 7px; transition: all 1s ease 0s; width: 75px; } #back-top a:hover span { background-color: #0064C9; } |
Bedankt voor de respons.quote:Op zondag 21 april 2013 23:10 schreef boem-dikkie het volgende:
http://stackoverflow.com/(...)-has-no-method-ready
Ik gok dat het iets te maken heeft met de combinatie mootools en jQuery.
Magento gebruikt standaard idd prototype en dat conflicteert ook, ik doe het zelf zo:quote:Op zondag 21 april 2013 23:22 schreef highender het volgende:
[..]
Bedankt voor de respons.
Dat lijkt inderdaad een soortgelijk probleem, ik kan alleen geen mootools vinden in de javascript map van magento, wel prototype.js en scriptaculous.js wat daarmee conflicten zou veroorzaken, dat is hier dus niet het geval.
EDIT: ik lees daar het advies om $ voor jQuery te vervangen i.v.m. een corrigerend scriptje om conflicten te voorkomen, even kijken of dat helpt.
| 1 2 3 4 5 | jQuery.noConflict(); jQuery(document).ready(function($){ // jquery scripts }); |
Ik heb nu deze gevonden die precies doet wat ik wil, maar ik wil liever een gewoon menu met knoppen dan een dropdown menu, hoe kan ik dat het beste aanpakken?quote:Op zondag 21 april 2013 21:34 schreef boem-dikkie het volgende:
[..]
jQuery filter functie werkt daar prima voor.
http://api.jquery.com/filter/
Je kunt anchors maken met een data-* element. Dan kun je in plaats van .val() bijvoorbeeld met .data('naamvankey') de data ophalen en daar op filteren.quote:Op dinsdag 23 april 2013 13:42 schreef DutchErrorist het volgende:
[..]
Ik heb nu deze gevonden die precies doet wat ik wil, maar ik wil liever een gewoon menu met knoppen dan een dropdown menu, hoe kan ik dat het beste aanpakken?
http://jetlogs.org/jquery/jquery_list_filter_multiple.html
| 1 | <a href="#" class="blabla" data-filter="rood">rood</a> |
| 1 | var fruitType= $(".blabla").data('filter'); |
Da's wel handig. En als je meerdere filter items heb is het dan gewoon net zoals met classesquote:Op dinsdag 23 april 2013 13:49 schreef boem-dikkie het volgende:
[..]
Je kunt anchors maken met een data-* element. Dan kun je in plaats van .val() bijvoorbeeld met .data('naamvankey') de data ophalen en daar op filteren.
Bijvoorbeeld een linkje:
[ code verwijderd ]
En de jQuery:
[ code verwijderd ]
Bijvoorbeeld zo: data-options='{"name":"John"}'.quote:Op dinsdag 23 april 2013 13:54 schreef ursel het volgende:
[..]
Da's wel handig. En als je meerdere filter items heb is het dan gewoon net zoals met classes
data-filter="rood rond fruit" ??
Dank je voor die JSFiddle, dat maakt het allemaal net wat duidelijker voor mijquote:Op dinsdag 23 april 2013 14:13 schreef boem-dikkie het volgende:
[..]
Bijvoorbeeld zo: data-options='{"name":"John"}'.
Zie: http://api.jquery.com/data/
Oh en een JSFiddle'tje voor dat fruit voorbeeld. Even snel alleen de kleur gedaan.
http://jsfiddle.net/uKHXs/26/
Ik probeer dat nu zo te fixen met data-options, maar dat wil me niet lukken. Zou je dat misschien ook in JSFiddle kunnen zetten? In ieder geval bedankt, want je helpt me heel erg (ben meer van het vormgeven dan het coden).quote:Op dinsdag 23 april 2013 14:13 schreef boem-dikkie het volgende:
[..]
Bijvoorbeeld zo: data-options='{"name":"John"}'.
Zie: http://api.jquery.com/data/
Oh en een JSFiddle'tje voor dat fruit voorbeeld. Even snel alleen de kleur gedaan.
http://jsfiddle.net/uKHXs/26/
Heel erg front-end gericht maar hier staan een flink aantal vacatures http://fronteers.nl/vacaturebankquote:Op dinsdag 23 april 2013 14:12 schreef Seagal het volgende:
Weet iemand toevallig nog websites specifiek gericht op vacatures met web development banen?
Thanks! Daar heb ik wel wat aan.quote:Op dinsdag 23 april 2013 15:25 schreef Black-Hole het volgende:
[..]
Heel erg front-end gericht maar hier staan een flink aantal vacatures http://fronteers.nl/vacaturebank
Wat wil je precies bereiken? Een lijst met twee filters?quote:Op dinsdag 23 april 2013 15:09 schreef DutchErrorist het volgende:
[..]
Ik probeer dat nu zo te fixen met data-options, maar dat wil me niet lukken. Zou je dat misschien ook in JSFiddle kunnen zetten? In ieder geval bedankt, want je helpt me heel erg (ben meer van het vormgeven dan het coden).
Ik heb een stuk of 9 tot 12 lijsten met onderwerpen, beetje a la startpagina. Ik wil dan dat bezoekers aan de linkerkant twee menu's hebben met knoppen voor merken en knoppen voor provincies. Als eerst wordt gewoon alle info getoond, maar als ze dan op bijvoorbeeld Drenthe drukken dan worden alleen merken in drenthe getoond. Als ze dan op een merk klikken dat hij dan ook de selectie van drenthe onthoud en dan alleen dat merk in Drenthe wordt getoond. Met een dropdown kan het nu wel alleen ik heb het liefst geen dropdown menu en bij een dropdown moet je nog je keuzes bevestigen terwijl ik wil dat ze gelijk doorgevoerd worden als je de keuze maakt.quote:Op dinsdag 23 april 2013 16:21 schreef boem-dikkie het volgende:
[..]
Wat wil je precies bereiken? Een lijst met twee filters?
| Forum Opties | |
|---|---|
| Forumhop: | |
| Hop naar: | |