jquery linklist

[JacobKohute]

I'm having alot of trouble with a sample from the esri site. I have almost everything working but the click on a returned set of values only passes the last result in the list to the map. Any ideas?

function showResults(results) {
     //create a pick list of results
     $.each(results, function(i, result) {
        var li = $('<li class="linklist"/>');
               $('.linklist').click(function() {
               addResult(result);
               });
                                      
                                         //create the list content
                                        var content = "<a href='#'>" + result.address + "</a>";
                   li.append(content);
                                        //add the list item to the feature type list
                                        $('#searchList').append(li);
                                });
                                //refresh the featurelist so the jquery mobile style is applied
                                $('#searchList').listview('refresh');
        }

[JeffPace]

just generic, but whenever i get only the last result, that usually means i am overwriting instead of appending

[JacobKohute]

Here's the function it passes a value to if that sheds any light.

function addResult(result) {
                                //clear any existing graphics
                                map.graphics.clear();
                                //add selected geocode result to map and zoom
                                var infoTemplate = new esri.InfoTemplate("Result", "${*}");
                                var r = Math.floor(Math.random() * 250);
                                var g = Math.floor(Math.random() * 100);
                                var b = Math.floor(Math.random() * 100);

                                var symbol = new esri.symbol.SimpleMarkerSymbol(esri.symbol.SimpleMarkerSymbol.STYLE_CIRCLE, 10, new esri.symbol.SimpleLineSymbol(esri.symbol.SimpleLineSymbol.STYLE_SOLID, new dojo.Color([r, g, b, 0.5]), 5), new dojo.Color([r, g, b, 0.9]));
                                var wmloc = esri.geometry.geographicToWebMercator(result.location);
                                var attr = {
                                        "Address" : result.address
                                };

                                var graphic = new esri.Graphic(wmloc, symbol);

                                map.graphics.add(graphic);
                              
                                var ptAttr = result.attributes;
                              
                        
       
        map.centerAndZoom(wmloc,15);
                                //close the dialog
                                $('.ui-dialog').dialog('close');
                        }

[PatKeegan]

I had same issue and could not figure it out, I ended up changing the logic to just use best candidate and not provide a link list.

Anyhow, this seemed to be the issue:
http://stackoverflow.com/questions/11123829/jquery-nested-li-click-event-calls-multiple-times

[JacobKohute]

That's likely the route I'll have to take. Thanks.

[MattLane · Accepted solution]

I'm not entirely clear on what you are doing, but it seems every li you add you overwrite your click function. Since you are applying the click function to the class (.linklist) you are making all li's that have that class call that function with the last result processed.
You should be able to bind the click straight to the li variable since it is a jquery object.

var li = $('<li class="linklist"/>'); li.click(function() {   addResult(result); });

[JacobKohute]

Thanks that did it.  Changed it to li.click and it works like a charm.