View Full Version : adding onClickAction to text

21 Oct 2010, 1:22 PM
Hi Guys,

I have an application where I present a list of filters that get sent back to the server for DB level filtering. I want the delete filter to be a (x) - for example, imagine a shopping cart with each filter displayed like so:

Home > Computer Hardware > Motherboards > Intel Motherboards (x) > Price : $100 - $200 (x) (1-20 of 117 Results)

where each red x sends an action to the server to remove the filter.

For the life of me, I haven't been able to figure out a way to do this. I've tried all sorts of variants of something like this, but it's just not working:

function AJAXgetFiltersFromSession(){

var divTracker = new Array();
var filtData = [];
url: '/api/filters',
method: 'GET',
success : function(result) {
d = Ext.decode(result.responseText);
filtData = d.data;
var ret = " ";
for (var k in filtData){
var filt_div_id = 'filt_' + k;
ret += "<div id='"+ filt_div_id + "'>" +
k + "=" + filtData[k] +
"&nbsp;<id='del' style='color:red'>(x)</div>";
divTracker[filt_div_id] = k;
div = Ext.get('filters_list');

for (var i in divTracker){
var tdiv = 'filt_'+divTracker[i];
Ext.get(tdiv).on('click', function(eventObj, elRef) {
alert('myDiv click Handler, source elment ID: ' + elRef.id);
exception : function () {
console.info(arguments); // on excepton, push it to fireBug

title: 'ERROR!',
msg: 'Could not get filters list!',
buttons: Ext.MessageBox.OK,
icon: Ext.MessageBox.ERROR

Right now, it's just showing an alert(...) with the elRef.id, to prove I'ts working. Once I get a clue of how to make this work I'll write the proper Click handler.

But for now, clearly I don't know what I'm doing! There must be a simple way to do this??

Can somebody point me in the right direction? An example?


25 Oct 2010, 9:36 AM

25 Oct 2010, 9:53 AM
Use a DataView with a click listener.