I have two forms, one for a support layer and one for a sign layer. The support layer connects to my data and displays on the form. On the sign form, however, I receive the following error: Uncaught TypeError: Cannot read property 'call' of undefined
The error is in the init.js:799
I have updated my code on github at: csergent45/streetSigns · GitHub The file that I am updating is in the app/main.js file. If you would like to test it, enter an address of 100 S Main St, Decatur, Illinois. You can then click on the points which should display a form. So this works:
/* Update Support Layer Begin */ app.supportLayer.on("click", function (evt) { /* Get support information on click */ var supportId, type, address, size, material, base, rating, dateInv, inspector, comments, addrCode; // declare rest endpoint values supportId = evt.graphic.attributes.SUPPORTID; type = evt.graphic.attributes.TYPE; address = evt.graphic.attributes.ADDRESS; size = evt.graphic.attributes.SIZE_; material = evt.graphic.attributes.MATERIAL; base = evt.graphic.attributes.BASE; rating = evt.graphic.attributes.RATING; dateInv = evt.graphic.attributes.DATEINV; inspector = evt.graphic.attributes.INSPECTOR; comments = evt.graphic.attributes.COMMENTS; addrCode = evt.graphic.attributes.ADDRCODE; // Clear form of values before connecting current values document.getElementById("supportForm").reset(); /* Enter your domain item and then the element to populate */ populateSelect("TYPE", "type", "support"); populateSelect("SIZE_", "size", "support"); populateSelect("MATERIAL", "material", "support"); populateSelect("BASE", "base", "support"); populateSelect("RATING", "rating", "support"); /* Populate form with data */ document.getElementById("address").value = address; document.getElementById("supportId").value = supportId; document.getElementById("type").value = type; document.getElementById("size").value = size; document.getElementById("material").value = material; document.getElementById("base").value = base; document.getElementById("rating").value = rating; document.getElementById("dateInv").value = dateInv; document.getElementById("inspector").value = inspector; document.getElementById("comments").value = comments; document.getElementById("addrCode").value = addrCode; // Show supports form for updating app.attributesModal.modal("show"); }); /* Update Support Layer End */
And this does not work:
/* Update Sign Layer Begin */ app.signLayer.on("click"), function (evt) { var installed, signId, facing, visibility, condition, supportId, text, color1, delineator, illum, offset var mountht, backing, width, height, txtSize, numSize, comments, twoSided, attachType, attachNum, attachLoc, siteObs, signShape, color2, mutcd installed = evt.graphic.attributes.INSTALLED; signId = evt.graphic.attributes.SIGNID; facing = evt.graphic.attributes.FACING; visibility = evt.graphic.attributes.VISIBILITY; condition = evt.graphic.attributes.CONDITION_; supportId = evt.graphic.attributes.SUPPORTID; text = evt.graphic.attributes.TEXT; color1 = evt.graphic.attributes.COLOR1; delineator = evt.graphic.attributes.DELINEATOR; illum = evt.graphic.attributes.ILLUM; offset = evt.graphic.attributes.OFFSET; mountht = evt.graphic.attributes.MOUNTHT; backing = evt.graphic.attributes.BACKING; width = evt.graphic.attributes.WIDTH; height = evt.graphic.attributes.HEIGHT; txtSize = evt.graphic.attributes.TXTSIZE; numSize = evt.graphic.attributes.NUMSIZE; comments = evt.graphic.attributes.COMMENTS; twoSided = evt.graphic.attributes.TWOSIDED; attachType = evt.graphic.attributes.ATTACHTYPE; attachNum = evt.graphic.attributes.ATTACHNUM; attachLoc = evt.graphic.attributes.ATTACHLOC; siteObs = evt.graphic.attributes.SITEOBS; signShape = evt.graphic.attributes.SIGNSHAPE; color2 = evt.graphic.attributes.COLOR2; mutcd = evt.graphic.attributes.MUTCD; // Clear form of values before connecting current values document.getElementById("signForm").reset(); /* Enter your domain item and then the element to populate */ populateSelect("VISIBILITY", "visibility", "sign"); populateSelect("CONDITION_", "condition", "sign"); populateSelect("COLOR1", "color1", "sign"); populateSelect("DELINEATOR", "delineator", "sign"); populateSelect("ILLUM", "illum", "sign"); populateSelect("BACKING", "backing", "sign"); populateSelect("ATTACHTYPE", "attachType", "sign"); populateSelect("ATTACHLOC", "attachLoc", "sign"); populateSelect("SITEOBS", "siteObs", "sign"); populateSelect("SIGNSHAPE", "signShape", "sign"); populateSelect("COLOR2", "color2", "sign"); populateSelect("MUTCD", "mutcd", "sign"); /* Populate form with data */ document.getElementById("installed").value = installed; document.getElementById("signId").value = signId; document.getElementById("facing").value = facing; document.getElementById("visibility").value = visibility; document.getElementById("condition").value = condition; document.getElementById("supportId").value = supportId; document.getElementById("text").value = text; document.getElementById("color1").value = color1; document.getElementById("delineator").value = delineator; document.getElementById("illum").value = illum; document.getElementById("offset").value = offset; document.getElementById("mountht").value = mountht; document.getElementById("backing").value = backing; document.getElementById("width").value = width; document.getElementById("height").value = height; document.getElementById("txtSize").value = txtSize; document.getElementById("numSize").value = numSize; document.getElementById("comments").value = comments; document.getElementById("twoSided").value = twoSided; document.getElementById("attachType").value = attachType; document.getElementById("attachNum").value = attachNum; document.getElementById("attachLoc").value = attachLoc; document.getElementById("siteObs").value = siteObs; document.getElementById("signShape").value = signShape; document.getElementById("color2").value = color2; document.getElementById("mutcd").value = mutcd; // Show signs form for updating app.attributesSignModal.modal("show"); } /* Update Sign Layer End */
I did find it interesting that on the first one I had to add a ); but on the second one, this was not needed. Any ideas?
My click event should have been:
app.signLayer.on("click", function (evt) {
instead of:
app.signLayer.on("click"), function (evt) {
problem solved.