Removing empty fields in Popups

[NEvatt]

Hi there,

I am trying to configure my Web AppBuilder application to only display fields in my popups that have content.  This particular application has hundreds of layers, so going in by hand within my ArcGIS Webmap, is not really an option. 

Ideally, I would like to be able to edit the infowindow settings similar to this post but I can't seem to find the infowindow settings within "2D" version of the map.  WIthin MapManager.js one can edit the "3D" version.  Anyone know another way of getting access to the info window?

thanks,

Nat

[MihkelMänna]

I have the same question. I would also want to know how could I change the order of divs within the popup/infowindow. Has anyone got an idea how to edit popups and accomplish these things in Web AppBuilder?

[NEvatt]

I have created a jQuery hack to get this to work.  I know this isn't the preferred way, but it works for me, so if anyone else can benefit from it, great.  (@mihkelmanna)

What I have done is added a map click listener which hides the popup, goes through the table in the popup looking for empty values, removes them and then displays the popup afterwards.  There is a 750 ms delay via a setTimeout call.

I have put this in a custom widget within Web Appbuilder, but essentially it works inside any widget that opens from start-up.

/* *****************The listeners *************** */

on(theMap, "click", function (e) {
                //on(theMap.infoWindow, "show", function (e) {
                hideShowTable();
            })

            $(".esriPopupWrapper").on('click', '.titleButton.prev', function () {
                hideShowTable();
            });

            $(".esriPopupWrapper").on('click', '.titleButton.next', function () {
                hideShowTable();
            });

/* ************************ The Function ****************** */

            function hideShowTable() {
                var table = $(".attrTable");
                $(".contentPane").css("display", "none");
                setTimeout(function () {

                    var numCols = $("tr", table).length;
                    i = 0;

                    $('.attrTable tr').each(function () {
                        var _hide = true;
                        $(this).find('td:nth-child(2)').each(function () {
                            var currentVal = $(this).html().replace(/ /g, '')
                            if (currentVal != "") {
                                _hide = false;
                            }
                        });

                        if (_hide) {
                            $(this).hide();
                        }
                    });
                    $(".contentPane").css("display", "block");
                    checkBlockDropdown();
                }, 750);
            }