Select to view content in your preferred language

Editing the Pop Ups Text Boxes for Comments in Web App Builder

9652
24
Jump to solution
10-07-2015 04:24 PM
DavidWasserman
Frequent Contributor

Hi All,

I have been slowly trying to pick up the ArcGIS API and Javascript, and I want to make what seems like should be an easy CSS edit to the infoWindow in web app builder. I was curious if someone could give me an understanding of where within the edit widget (or the layer list widget?) the relevant JS/CSS files might be.

My goal is to make the pop up for creating features with the edit widget:

1. Larger in terms of size for the textArea.

2. Create a submit button rather than hitting the X. to close the widget.

Attribute inspector

I have been experimenting a bit with this, but I think part of the reason I can't see changes might just be because of cache or other issues. I would appreciate any guidance if anyone has any about where to look.

David

David Wasserman, AICP
0 Kudos
24 Replies
CameronJohnsen
Deactivated User


Will this work with WAB 2.0? I am trying to do this to a WAB Application on my root folder to get the text field larger and the text to wrap but it doesn't seem to be working. I need to get the exact results @David Wasserman got with his text field. Any help is greatly appreciated.

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

Cameron,

  The web maps attribute configuration take presidence over the setting in the edit widgets config.json. So open the web map in AGOL map viewer and choose to configure popups for your layer and choose the field you want to be multi-line and choose the "Configure Attributes" link and then choose textbox type = Multiple Line. Save your changes and now the edit widget will display that field as a text area in the edit widgets popup. You can then edit the css rule to set the height of all text areas in the edit widgets css rules:

/*textArea*/

.jimu-widget-edit-infoWindow .esriAttributeInspector .dijitTextBox.dijitTextArea {

  height: 32px;

}

CameronJohnsen
Deactivated User

Where did you add this into the CSS file? The change to the config file seems pretty straight forward so I believe I have that correct. I believe my error is where I am changing the CSS file.

0 Kudos
DavidWasserman
Frequent Contributor

Hey Cameron,

I have not tested since 1.2-1.3. I am not sure if it will work in 2. I hope this help.

David

David Wasserman, AICP
CameronJohnsen
Deactivated User

Thank you, I was missing the step of configuring the attribute fields in AGOL map viewer.