Web App Builder Widget: Crowdsource Voting or Spatial Reddit

06-20-2016 12:44 PM
Occasional Contributor III

Hi all,

Does anyone have any thoughts on what would be required to make a version of the Edit Widget that essentially has an up and a down vote buttons on existing comments? Something that happens a lot is people put overlapping comments but also they usually can't express disagreement as well with comments that might exist. I was curious if it is possible to essentially make a "Spatial Reddit"?

The widget would essentially do the following:

1. Allow voting that changes an attribute in the database based on votes.

2. Buttons would be in place that allow you to click on existing comments and upvote them or down vote them based their existing location.

3. The option exists to based the symbology based on this changing attribute.

4. Has some of the key features of the edit widget.

5. Ideally allows one vote per user (IP Address), at minimum one vote per map instance.

Robert Scheitlin, GISP​, your thoughts would be great, especially regarding level of effort or if something already exists.


David Wasserman, AICP
0 Kudos
5 Replies
MVP Legendary Contributor


  I have not had the need to go down this road before so I don't have any suggestions or code. But I do remember seeing a JS sample that had this type of up or down vote so if it can be done in the JS API you can do it in WAB.

0 Kudos
Occasional Contributor III

Thanks Robert. Do you perhaps remember where this JS Sample was?

David Wasserman, AICP
0 Kudos
MVP Legendary Contributor


  This was the sample I was thinking of and it it not real close to what you were looking for but it may get you started:

ArcGIS API for JavaScript Sandbox

Occasional Contributor III

Thanks for sharing it. I think it will help a  lot.

David Wasserman, AICP
New Contributor II


I'm also try to create voting in Edit widget. Do you get the solution on it?

I try to calculate vote in editor widget, but the fiedvalue is not firing, no value are show in my text box.

can you help me?

here is my code

    var layerInfos = [

                            'featureLayer': layertemplate,
                            'showAttachments': true,
                            'isEditable': true,
                            'showDeleteButton': true,
                            'fieldInfos': [
                                { 'fieldName': 'NAMA_PELAPOR', 'isEditable': false, 'label': PL + ':' },
                                { 'fieldName': 'ADDRESS', 'isEditable': false, 'label': AD + ':' },
                                { 'fieldName': 'POI_NAME', 'isEditable': false, 'label': TT + ':' },
                                { 'fieldName': 'NO_TEL_PELAPOR', 'isEditable': false, 'label': TL + ':' },
                                { 'fieldName': 'CATATAN', 'isEditable': true, 'label': CT + ':' },
                                { 'fieldName': stat, 'isEditable': true, 'label': ST + ':' },
                                { 'fieldName': 'PUBLIC_VIEW', 'isEditable': true, 'label': PV + ':' },
                                { 'fieldName': 'ARAS_KEDALAMAN', 'isEditable': true, 'label': AK + ':' },
                                { 'fieldName': 'TYPE', 'isEditable': true, 'label': TY + ':' },
                                { 'fieldName': 'PENGEMASKINI', 'isEditable': false, 'label': UP + ':' },
                                { 'fieldName': 'LONGITUDE', 'isEditable': true, 'label': 'LONGITUDE' + ':' },
                                { 'fieldName': 'LATITUDE', 'isEditable': true, 'label': 'LATITUDE' + ':' }

                    var attInspector = new AttributeInspector({
                        layerInfos: layerInfos
                    }, domConstruct.create("div")); //"attributeDiv");

                    console.log({ attInspector });
                    selectQuery.objectIds = [evt.graphic.attributes.OBJECTID];
                    layertemplate.selectFeatures(selectQuery, FeatureLayer.SELECTION_NEW, function (features) {
                        if (features.length > 0) {
                            //store the current feature
                            updateFeature = features[0];

                            count_like = (updateFeature.attributes["COUNT_RATING"]) ? updateFeature.attributes["STAR_RATING"] : 0;
                            start_rating = (updateFeature.attributes["STAR_RATING"]) ? updateFeature.attributes["STAR_RATING"] : 0;

                            if (id == "33") {
                                content = "<br/><i><span id='numPeople'>" + count_like +
                                    "</span> <img style='cursor:pointer;height:20px;width:20px' src='../assets/img/thumbup.png'> Like this restaurant.</i><br/><hr/>";
                                content += attInspector.domNode.innerHTML;
                                content += "<br/><hr/>Average rating :" + start_rating;

                                console.log({ content });
                                map.infoWindow.resize(350, 200);
                                map.infoWindow.resize(350, 180);
                                map.infoWindow.show(evt.screenPoint, map.getInfoWindowAnchor(evt.screenPoint));

It will be greate if you can share your thoughts and solutions.


0 Kudos