Security

Add icons to xml dashboard and change the icon based on the count

karthi25
Path Finder

I have an requirement to add icons to the xml dashboard and need to change the icon based on the result.

Something like the below image:
alt text

Since, I don't have permissions to use javascript/jquery inside, I only need to use CSS and XML.
Can anyone please help me to do it.

0 Karma
1 Solution

vnravikumar
Champion

Hi @karthi25

Please Check this and let me know, In this sample based on value range(0-20,21-100) two images where shown.

<form>
  <label>icon</label>
  <fieldset submitButton="false">
    <input type="text" token="value">
      <label>Sample value(1-100)</label>
    </input>
  </fieldset>
  <row>
    <panel>
      <html>
        <body>
          <tr>
            <td>
            <img src="$path$"/>
          </td>
          </tr>
        </body>
      </html>
    </panel>
    <panel>
      <single>
        <search>
          <query>|makeresults |eval temp=$value$ | table temp</query>
          <progress>
            <condition match="'result.temp' >=0 AND 'result.temp' <21">
              <set token="path">/static/app/search/img1.png</set>
            </condition>
            <condition match="'result.temp' >=21 AND 'result.temp' <=100">
              <set token="path">/static/app/search/img2.jpg</set>
            </condition>
          </progress>
          <earliest>$earliest$</earliest>
          <latest>$latest$</latest>
        </search>
      </single>
    </panel>
  </row>
</form>

View solution in original post

vnravikumar
Champion

Hi @karthi25

Please Check this and let me know, In this sample based on value range(0-20,21-100) two images where shown.

<form>
  <label>icon</label>
  <fieldset submitButton="false">
    <input type="text" token="value">
      <label>Sample value(1-100)</label>
    </input>
  </fieldset>
  <row>
    <panel>
      <html>
        <body>
          <tr>
            <td>
            <img src="$path$"/>
          </td>
          </tr>
        </body>
      </html>
    </panel>
    <panel>
      <single>
        <search>
          <query>|makeresults |eval temp=$value$ | table temp</query>
          <progress>
            <condition match="'result.temp' >=0 AND 'result.temp' <21">
              <set token="path">/static/app/search/img1.png</set>
            </condition>
            <condition match="'result.temp' >=21 AND 'result.temp' <=100">
              <set token="path">/static/app/search/img2.jpg</set>
            </condition>
          </progress>
          <earliest>$earliest$</earliest>
          <latest>$latest$</latest>
        </search>
      </single>
    </panel>
  </row>
</form>

View solution in original post

vnravikumar
Champion

@karthi25, Have you tried?

0 Karma
Did you miss .conf21 Virtual?

Good news! The event's keynotes and many of its breakout sessions are now available online, and still totally FREE!