POST
|
Hi all, I am trying to use the JQuery auto-complete widget with my widget. My goal is to create an input text box where users can enter a county (that would auto-complete) then, when the auto-completed county value is entered have a function that would allow users to extract data by the selected county extent. here is what I have so far. I would select features values for the auto-complete input box as such: I get a 404 error when trying to achieve this first task. error: POST http://localhost:58479/layout-master/demos/[object%20Object] 404 (Not Found) jquery.min.js:4send jquery.min.js:4m.extend.ajax jquery.min.js:4m.(anonymous function) jquery.min.js:4$.autocomplete.source Map-Widget-Panel-carousel-BasemapList-Legend-%20Tool.html:484e.widget._search jquery-ui.min.js:7(anonymous function) jquery-ui.min.js:6e.widget.search jquery-ui.min.js:7(anonymous function) jquery-ui.min.js:6(anonymous function)
//build query task
var queryTask = new QueryTask("http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Census_USA/MapServer/3");
//create an array
var aStateNames = [];
//build query filter
var query = new Query();
query.returnGeometry = false;
query.outFields = ["STATE_NAME"];
query.where = "OBJECTID > 0";
queryTask.execute(query, function (results) {
//parse results and add to autocomplete widget
dojo.forEach(results.features, function (value, index) {
aStateNames.push(value.attributes.STATE_NAME);
});
}, function (error) {
alert("Error: " + error);
});
$("#states").autocomplete({
source: aStateNames
});
and then extract by the selected value:
var queryTask = new QueryTask("http://webgisdevint1/arcgis/rest/services/Alex_Try/Counties/MapServer/0");
queryTask.on("complete", addToMap)
var query = new Query();
query.returnGeometry = true;
query.outFields = ["STATE_NAME"];
query.where = "STATE_NAME = '" + aStateNames+ "'";
query.outSpatialReference = map.spatialReference;
queryTask.execute(query, function (featureSet) {
var AOI = featureSet.features[0].geometry;
var graphic = new Graphic(AOI, symbol);
var features = [];
features.push(graphic);
var fSet = new FeatureSet();
fSet.features = features;
How can I have the auto-complete widget work and then hook it up to the extract function? Any idea, help is welcome!
... View more
09-22-2014
09:39 AM
|
0
|
15
|
5044
|
POST
|
Thank you for your help! I will reshape my code. Alex
... View more
09-18-2014
09:50 AM
|
0
|
0
|
464
|
POST
|
Sorry, In your sample (that works perfectly) I do get the "Hook click" alert in window, but it still does not trigger the function that allows me to insert a new layer. I cannot figure out why. It must be easy but I don't see what I am missing. I also get a "Uncaught TypeError: undefined is not a function" My new map is here. Thank you for your help and also the great work! Alex
... View more
09-17-2014
09:37 AM
|
0
|
3
|
464
|
POST
|
That is quite amazing! It does trigger the "hook click" alert! Should I modify my insert new layer script so that it triggers the "add layer"? Thanks, Alex PS: I am very impressed, thank you again!
... View more
09-16-2014
10:57 AM
|
0
|
5
|
464
|
POST
|
Riyas, Thank you. It seems like your test work like a charm and your explanation was very clear. Should I not use bootstrap for this InserNewlayer function then? Is there something similar to popover in dojo that I could use? Thank you, Alex
... View more
09-15-2014
09:18 AM
|
0
|
8
|
817
|
POST
|
Ha. Wrong environment again. Man this Friday is tough! 🙂 Well I finally decided to choose a random ESRI sample. So I am sure there is no mistake and can see the TOC in action.
... View more
09-12-2014
02:34 PM
|
0
|
1
|
817
|
POST
|
Alright I added a public layer so the TOC would work. The Add layer is already public (ESRI's sample). Let me know if you can see the TOC now.
... View more
09-12-2014
11:14 AM
|
0
|
3
|
817
|
POST
|
Oh let me fix that sorry that was on the test environment.
... View more
09-12-2014
11:09 AM
|
0
|
4
|
817
|
POST
|
Hi all, I am trying to understand why the "insert new layer" of the TOC widget does not work with my script. It seems like I hooked the buttons correctly using on(domByID) technic. Not quite sure why the "Insert New Layer of the TOC widget does not work in my script. Here is my map. TOC widget is here
... View more
09-12-2014
10:43 AM
|
0
|
16
|
1985
|
POST
|
Hi all, I am using the TOC widget. I am trying to add the "Insert New Layer" capability to my web map. However the "Add" button that is hooked by ID to the JS function does not seem to trigger. My map is here. I Have everything set up as such: Here is my javascript for the TOC
//TOC
map.on('layers-add-result', function (evt) {
dynaLayer1.setVisibleLayers([1, 2, 4]);
toc = new TOC({
map: map,
layerInfos: [{
layer: dynaLayer1,
title: "Layers",
slider: true
}]
}, 'tocdiv');
toc.startup();
toc.on('load', function () {
if (console)
console.log('TOC loaded');
dom.byId("InsertNewLayer").disabled = false;
});
});
map.addLayers([dynaLayer1]);
on(dom.byId("InsertNewLayer"), 'click', function(evt){
if (dynaLayer2 !=null){
map.removeLayer (dynaLayer2);
toc.layerInfos.splice(1, 1);// remove it.
dynaLayer2 = null;
}
dynaLayer2 = new ArcGISDynamicMapServiceLayer(dom.byId("NewLayerURL").value, {
opacity: 0.8
});
var h = map.on('layer-add-result', function(evt){
toc.layerInfos.splice(1, 0, {
layer: dynaLayer2,
title: "DynamicMapServiceLayer2",
// collapsed: true, // whether this root layer should be collapsed initially, default false.
slider: true, // whether to display a transparency slider.
autoToggle: false //whether to automatically collapse when turned off, and expand when turn on for groups layers. default true.
});
toc.refresh();
h.remove();
if (dynaLayer2.initialExtent){
map.setExtent(dynaLayer2.initialExtent);
}
});
});
map.addLayer(dynaLayer2);
Here is the HTML: <div class="popover-markup" style="margin-top:-18px; margin-left:840px;"> <a href="#" class="trigger" style="right: 250px; color: yellow;">Add Layer</a> <div class="head hide">Add layer</div> <div class="content hide"> <div class="form-group"> <input id="NewLayerURL" size="110" type="text" class="form-control" value="http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Census_USA/MapServer"/> </div> <button id="InsertNewLayer" disabled="disabled" class="btn btn-default btn-block">Add...</button> </div> <div class="footer hide">test</div> </div> <!--End PopOver--> If anyone has any tips, ideas.... that would be very helpful, Thank you, Alex
... View more
09-11-2014
03:15 PM
|
0
|
0
|
736
|
POST
|
That works better! Thanks. Now I still have the same type of error for dynaLayer2. Originally I had:
on(dom.byId("InsertNewLayer"), 'click', function (evt) {
if (dynaLayer2 != null) {
map.removeLayer(dynaLayer2);
toc.layerInfos.splice(1, 1);// remove it.
dynaLayer2 = null;
}
dynaLayer2 = new ArcGISDynamicMapServiceLayer(dom.byId("NewLayerURL").value, {
opacity: 0.8
});
});
//var h = map.on('layer-add-result', function(evt){
var h = dynaLayer2.on('load', function (evt) {
toc.layerInfos.splice(1, 0, {
layer: dynaLayer2,
title: "DynamicMapServiceLayer2",
// collapsed: true, // whether this root layer should be collapsed initially, default false.
slider: true, // whether to display a transparency slider.
autoToggle: false //whether to automatically collapse when turned off, and expand when turn on for groups layers. default true.
});
toc.refresh();
h.remove();
});
Now, I have this:
on(dom.byId("InsertNewLayer"), 'click', function (evt) {
if (dynaLayer2 != null) {
map.removeLayer(dynaLayer2);
toc.layerInfos.splice(1, 1);// remove it.
dynaLayer2 = null;
}
dynaLayer2 = new ArcGISDynamicMapServiceLayer(dom.byId("NewLayerURL").value, {
opacity: 0.8
});
//var h = map.on('layer-add-result', function(evt){
var h = dynaLayer2.on('load', function (evt) {
toc.layerInfos.splice(1, 0, {
layer: dynaLayer2,
title: "DynamicMapServiceLayer2",
// collapsed: true, // whether this root layer should be collapsed initially, default false.
slider: true, // whether to display a transparency slider.
autoToggle: false //whether to automatically collapse when turned off, and expand when turn on for groups layers. default true.
});
toc.refresh();
h.remove();
});
});
Everything works fine except the button Add... in the popover (Add Layer) does not seem to be hooked correctly to the URL.
<!--Add Layer PopOver-->
<div class="popover-markup" style="margin-top:-18px; margin-left:840px;">
<a href="#" class="trigger" style="right: 250px; color: yellow;">Add Layer</a>
<div class="head hide">Add layer</div>
<div class="content hide">
<div class="form-group">
<input type="text" class="form-control" placeholder="Enter Layer's URL here…">
</div>
<button id="InsertNewLayer" disabled="disabled" type="submit" class="btn btn-default btn-block">Add...</button>
</div>
<div class="footer hide">test</div>
</div>
<!--End PopOver-->
</div>
Not so sure why yet. Am I missing something here? Thank you for your help, Alex
... View more
09-11-2014
02:00 PM
|
0
|
0
|
558
|
POST
|
Hi all, I am trying to programmatically add layer to my map and TOC via the TOC widget. However I am getting an error : "Cannot read property 'on' of undefined" when running the script. Not too sure what that means. Anyway, my map is here. The idea is to click on a button and automatically add a layer to both TOC and map using bootstrap popover. As showed below Any help is welcome! Alex
... View more
09-11-2014
01:24 PM
|
0
|
2
|
1183
|
POST
|
Ok I found the issue. The great script you guys provided had to be placed before bootstrap cdn.js and JQuery.js. It seems like it need to load before these js modules. Not clear why... but it works like a charm now. Thank you for all your help! Alex
... View more
09-10-2014
01:08 PM
|
0
|
0
|
171
|
Title | Kudos | Posted |
---|---|---|
1 | 10-31-2016 11:46 AM | |
1 | 10-15-2014 02:17 PM | |
1 | 11-19-2015 09:14 AM | |
1 | 10-29-2015 04:38 PM | |
1 | 02-02-2015 09:55 AM |
Online Status |
Offline
|
Date Last Visited |
11-05-2021
12:09 PM
|