Change color of results fields in Enhanced Search Widget

[SteveAdams]

Making good progress on my Web App builder project...but still learning.

The enhanced search widget is really great, I appreciate the work on putting it together.

Is there a way or place I can change the color of the results field data that is returned?

The field label and the results are the same color.

[RobertScheitlin__GISP]

Steve,

   Are you saying that you want to change the color of the text attribute name label to something different the the attribute value text? If so you would need to look at how the result list is created in the widgets List.js

[SteveAdams]

I think that is correct, for example I am searching an address to bring back the school they would attend based on that address, so the results that popup after searching would be:

School:  Washington Elementary

The label "School:" and the value it returns Washington Elementary are all the same color, and kind of blend together.  I was thinking of changing the Washington Elementary to a different color or bolding it or something to offset it from the label.

[RobertScheitlin__GISP]

Steve,

  OK, since the Italics is not enough difference for you then you can just ass a line of code to the List.js and some css to the style.css for this:

css:

.search-list-item .attTitle {
  color:blue;
}

List.js (add line 10):

        if(item.rsltcontent !== ""){
          var attArr = item.rsltcontent.split('<br>');
          var attValArr;
          var label;
          var attTitle;
          var arrayLength = attArr.length;
          for (var i = 0; i < arrayLength; i++) {
            attValArr = attArr.split('</em>: ');
            attTitle = domConstruct.create("em");
            domClass.add(attTitle, "attTitle");

[SteveAdams · Accepted solution]

Very nice!  Thanks Robert! Worked perfectly.

[AmitKokje2]

That is very helpful Robert.

The tweak formats the attributes in the widget's result area.

is it possible to replicate similar modification to the results in the pop-up window as well?

Amit

[AmitKokje2]

Hi Robert,

Based on your response to Steve Adams, I managed to configure attributes in  the results window.

If there is only one attribute to display as in this case, Tweaking of list.js works very well.

However if there are number of fields to display as resultant attributes, by default the configuration picks up last field / attribute (for example shape.length / area in most of the cases).

Is there way to configure the display attribute to a specific field?  (Asset ID or Asset name for example).

Thus the result list will only display selected feature with one Attribute while popup will display full attributes, avoiding unnecessary duplications attributes.

Amit

[RobertScheitlin__GISP]

Amit,

   I am not sure I understand. The code provided work for more than one attribute.

There is a popup only setting for each field you configure.

[SteveAdams]

This has been working great, but I am moving to 2.3 and it doesn't seem to work.

I have it working at ArcGIS Web Application 

But on my test site, I can't seem to get the labels to change.

[RobertScheitlin__GISP]

Steve,

  Result formatting was not part of the 1.3.0.2 version of the eSearch at your working app is running so you must have made some code edits to get that. In the 2.3 version of eSearch this is configurable using the widgets settings UI. Have you set the result formatting using the widgets settings UI?