topic Re: jquery linklist in ArcGIS JavaScript Maps SDK Questions

jquery linklist

JacobKohute — Tue, 08 Jan 2013 15:06:51 GMT

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');
        }

Re: jquery linklist

JeffPace — Tue, 08 Jan 2013 15:34:49 GMT

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

Re: jquery linklist

JacobKohute — Tue, 08 Jan 2013 17:00:04 GMT

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');
                        }

Re: jquery linklist

PatKeegan — Fri, 11 Jan 2013 13:33:42 GMT

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

Re: jquery linklist

JacobKohute — Fri, 11 Jan 2013 14:08:36 GMT

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

Re: jquery linklist

MattLane — Fri, 11 Jan 2013 17:17:22 GMT

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); });

Re: jquery linklist

JacobKohute — Fri, 11 Jan 2013 17:24:29 GMT

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