WAB Customizing for Beginners

582
9
02-23-2018 08:10 AM
BrianBulla
Regular Contributor

Hi,

I want to take a Web App that I create using WAB 2.7 and customize it.  What I want to do is create a custom form that opens up when a user clicks on a feature in the map (ie. a Manhole) and then collect information on the form which would then be stored in a related table to the feature.

Yes, I know there is already a Collector app, but we do not want to use that.

I do some ArcPro tool development in Visual Studio, so I was hoping I could use that to help with this, but I literally have zero knowledge of web development, so I'm not really sure of where to start with this.

Any assistance is appreciated.

Thanks!

0 Kudos
9 Replies
RickeyFight
MVP Regular Contributor
BrianBulla
Regular Contributor

Hi Rickey,

Thanks for those links.  I will definitely look through those.

I did manage to pull the site I created in WAB 2.7 into Visual Studio.  It seems like using the 'Download' as apposed to just copy/paste all the folders/files works more efficiently.

When I run the site in debug mode in VS2012, I can get the site to show up in Chrome.  What I notice though is that once I add the JS reference to the index.html (ie. I add 

 <link rel="stylesheet" href="https://js.arcgis.com/3.23/esri/css/esri.css">
 <script src="https://js.arcgis.com/3.23/"></script>

between the <head> tags, then my site stalls when loading (see image below) and just sits with the default 'loading' bars flashing on the screen.  I've been going through this document as a guide (step #2):

Build your first application | Guide | ArcGIS API for JavaScript 3.23 

Any ideas as to what I am doing wrong??

0 Kudos
DerekLaw
Esri Community Moderator

Hi Brian,

FYI, this recent webinar video might also be a good place to start

https://community.esri.com/people/GRehkemper-esristaff/blog/2018/02/23/extending-the-web-appbuilder-... 

Hope this helps,

BrianBulla
Regular Contributor

Hi Derek,

Thanks for responding.  I'm realizing that I definitely know nothing about web programming, but I think I figured out my problem to the above question is that the index.html file is really just controlling the loading page for the map.

I guess what I need to figure out is what one (of the hundreds) of files in the WebApp contains the code for adjusting say the 'click' event of a layer.  

For now, all I want to do is show an alert("Hello World"); message when a certain layer gets clicked.

Can you give any guidance on where this is happening within the file structure the WAB creates??

0 Kudos
RobertScheitlin__GISP
MVP Esteemed Contributor

Brian,

   The MapManager.js file in the jimu.js folder is where to start.

BrianBulla
Regular Contributor

Thanks Robert!

0 Kudos
DerekLaw
Esri Community Moderator

FYI Brian, when it comes to WAB development and customization, Robert Scheitlin, GISP is "THE" man.

Thanks for your contributions Robert!

BrianBulla
Regular Contributor

Nice....yes, Robert seems to be the one to answer questions on here and has helped me in the past.  Thanks Robert!!

On that note rscheitlin , will you be at the Dev Conference in March?? I might need to track you down to pick your brain on some ArcPad apps I want to convert into a WebApp.

0 Kudos
RobertScheitlin__GISP
MVP Esteemed Contributor

Yes I will be. See you there.

0 Kudos