I’m building a web site ala autos.yahoo.com on servicos.mpl.pt/comparador/css1.php
I have a sidebar with filtering options grouped in an accordion.
The accordion panels get populated via jquery like:
//getMarcas
$(function() {
//get tag feed
$.getJSON("marcascloud.php?callback=?", function(data) {
//create list for tag links
$("<ul class='twocol'>").attr("id", "tagListMarcas").appendTo("#tagMarcas");
//create tags
$.each(data.tags, function(i, val) {
//create item
var li = $("<li class='twocol'>");
//create link
$("<a>").text(val.marca+" ("+val.nummodelos+")").attr({
title:"Veja todos os modelos " + val.marca,
'class':"aul",
click: function(){ QS('marca[]='+ val.idmarca );return false;}
}).appendTo(li);
//add to list
li.appendTo("#tagListMarcas");
});
});
});
A couple of things I need to achieve:
- how to apply an onclick event to each list item?
The sidebar structure:
<div id="sidebar">
<p>
<div id="accordion">
<h3><a name="marcas">Marca</a></h3>
<div id="tagMarcas">
<p>Seleccione até 4 marcas na lista abaixo</p>
<p>
</p>
</div>
At the moment the generated code for the unordered list on the sidebar is:
<ul id="tagListMarcas" class="twocol">
<li class="twocol"><a href="#" class="aul" title="Veja todos os modelos Abarth">Abarth (1)</a></li>
<li class="twocol"><a href="#" class="aul" title="Veja todos os modelos Alfa Romeo">Alfa Romeo (21)</a></li>
<li class="twocol"><a href="#" class="aul" title="Veja todos os modelos Aston Martin">Aston Martin (23)</a></li><li class="twocol"><a href="#" class="aul" title="Veja todos os modelos Audi">Audi (259)</a></li>
<li class="twocol"><a href="#" class="aul" title="Veja todos os modelos Bentley">Bentley (8)</a></li>
</ul>
My onclick event is not being assigned.
- after being able to assign the onclick event, what would the function look like so I can pass all the parameters chosen to the server side script result.php that queries the database?
- how do I make a jquery load call to populate the content div with the results?
Hope I was clear explaining.
Thankx in advance.