Hi all,
I am trying to implement attribute edit using attribute inspector, the service is displaying but pop up info not getting displayed.
If the problem is with the proxy setting, can anybody help with it. i am using IIS server.
here is the code
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<!--The viewport meta tag is used to improve the presentation and behavior of the samples
on iOS devices-->
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
<title>Editable FeatureLayer in Selection Only Mode with Attribute Inspector</title>
<link rel="stylesheet" href="http://js.arcgis.com/3.14/dijit/themes/claro/claro.css">
<link rel="stylesheet" href="http://js.arcgis.com/3.14/esri/css/esri.css">
<style>
html, body {
height: 100%; width: 100%;
margin: 0;
padding: 0;
overflow: hidden;
}
#mapDiv{
margin: 0;
padding:0;
}
#detailPane{
height:20px;
color:#570026;
font-size:12pt;
font-weight:600;
overflow:hidden;
}
.dj_ie .infowindow .window .top .right .user .content { position: relative; }
.dj_ie .simpleInfoWindow .content {position: relative;}
.esriAttributeInspector {height:100px;}
.esriAttributeInspector .atiLayerName {display:none;}
.esriAttributeInspector .atiButton{
margin-top:1px;
margin-right:45px;
}
</style>
<script src="http://js.arcgis.com/3.14/"></script>
<script>
var map;
var updateFeature;
require([
"esri/map",
"esri/layers/FeatureLayer",
"esri/dijit/AttributeInspector",
"esri/symbols/SimpleLineSymbol",
"esri/symbols/SimpleFillSymbol",
"esri/Color",
"esri/layers/ArcGISDynamicMapServiceLayer",
"esri/config",
"esri/tasks/query",
"dojo/query",
"dojo/parser",
"dojo/dom-construct",
"dijit/form/Button",
"dijit/layout/BorderContainer", "dijit/layout/ContentPane", "dojo/domReady!"
], function(
Map, FeatureLayer, AttributeInspector,
SimpleLineSymbol, SimpleFillSymbol, Color,
ArcGISDynamicMapServiceLayer, esriConfig,
Query,dojoQuery,
parser, domConstruct, Button
) {
parser.parse();
// refer to "Using the Proxy Page" for more information: https://developers.arcgis.com/javascript/jshelp/ags_proxy.html
// esriConfig.defaults.io.proxyUrl = "/proxy/";
map = new Map("mapDiv", {
basemap: "streets",
center: [78.20, 19.00],
zoom: 11
});
map.on("layers-add-result", initSelectToolbar);
var petroFieldsMSL = new ArcGISDynamicMapServiceLayer("http://gisserver.cgg.gov.in/arcgis/rest/services/IRR/srsp_canal_WRK1/MapServer");
petroFieldsMSL.setDisableClientCaching(true);
map.addLayer(petroFieldsMSL);
var petroFieldsFL = new FeatureLayer("http://gisserver.cgg.gov.in/arcgis/rest/services/IRR/srsp_canal_WRK1/FeatureServer/1", {
mode: FeatureLayer.MODE_SELECTION,
outFields: ["objectid","code", "codename", "length", "description", "status_work", "la_status", "ip_status"]
});
var selectionSymbol = new SimpleFillSymbol(
SimpleFillSymbol.STYLE_NULL,
new SimpleLineSymbol(
"solid",
new Color("yellow"),
2
),
null
);
petroFieldsFL.setSelectionSymbol(selectionSymbol);
petroFieldsFL.on("edits-complete", function() {
petroFieldsMSL.refresh();
});
map.addLayers([petroFieldsFL]);
function initSelectToolbar(evt) {
var petroFieldsFL = evt.layers[1].layer;
var selectQuery = new Query();
map.on("click", function(evt) {
selectQuery.geometry = evt.mapPoint;
petroFieldsFL.selectFeatures(selectQuery, FeatureLayer.SELECTION_NEW, function(features) {
if (features.length > 0) {
//store the current feature
updateFeature = features[0];
map.infoWindow.setTitle(features[0].getLayer().name);
map.infoWindow.show(evt.screenPoint, map.getInfoWindowAnchor(evt.screenPoint));
}
else {
map.infoWindow.hide();
}
});
});
map.infoWindow.on("hide", function() {
petroFieldsFL.clearSelection();
});
var layerInfos = [
{
'featureLayer': petroFieldsFL,
'showAttachments': false,
'isEditable': true,
'fieldInfos': [
{'fieldName': 'objectid', 'isEditable': false, 'objectid': 'objectid:'},
{'fieldName': 'code', 'isEditable': false, 'CANAL CODE': 'Acreage:'},
{'fieldName': 'codename', 'isEditable': false, 'label': 'CANAL NAME:'},
{'fieldName': 'length', 'isEditable': false, 'label': 'LENGTH IN METERS:'},
{'fieldName': 'description', 'isEditable': false, 'label': 'CANAL DESCRIPTION:'},
{'fieldName': 'status_work', 'isEditable': true, 'tooltip': 'WORK PROGRESS', 'label': 'WORK PROGRESS STATUS:'},
{'fieldName': 'la_status', 'isEditable': true, 'tooltip': 'LAND AQUISITION', 'label': 'LAND AQUISITION STATUS:'},
{'fieldName': 'ip_status', 'isEditable': true, 'tooltip': 'IP CREATED', 'label': 'IP CREATED STATUS:'}
]
}
];
var attInspector = new AttributeInspector({
layerInfos: layerInfos
}, domConstruct.create("div"));
//add a save button next to the delete button
var saveButton = new Button({ label: "Save", "class": "saveButton"},domConstruct.create("div"));
domConstruct.place(saveButton.domNode, attInspector.deleteBtn.domNode, "after");
saveButton.on("click", function() {
updateFeature.getLayer().applyEdits(null, [updateFeature], null);
});
attInspector.on("attribute-change", function(evt) {
//store the updates to apply when the save button is clicked
updateFeature.attributes[evt.fieldName] = evt.fieldValue;
});
attInspector.on("next", function(evt) {
updateFeature = evt.feature;
console.log("Next " + updateFeature.attributes.objectid);
});
attInspector.on("delete", function(evt) {
evt.feature.getLayer().applyEdits(null, null, [evt.feature]);
map.infoWindow.hide();
});
map.infoWindow.setContent(attInspector.domNode);
map.infoWindow.resize(350, 240);
}
});
</script>
</head>
<body class="claro">
<div data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'headline', gutters:false" style="width:100%;height:100%;">
<div id="detailPane" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'top'">
Click a field to display the attribute inspector with customized fields.
</div>
<div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'center'" id="mapDiv"></div>
</div>
</body>
</html>
What's the exact problem you are having? Are you just wanting to know how to set-up the proxy? If so, start here - Using the proxy | Guide | ArcGIS API for JavaScript and Working with Proxies | ArcGIS for Developers
Here's the github:
There's also some info on setting-up the proxy in this forum thread - Basic Viewer Print Widget in IE
If you still have problems, let me know.