Want to add records to drop down list on UI page

[Aaron Brown2]

Greetings!  I have a solution that I am trying to develop and can't seem to figure out if it is able to be done or not.  I have a custom UI page that I am developing for bulk adding of assets to a transfer order.  On the UI page I have a slushbucket that pulls in assets based on the from location of the transfer order however the client has asked if I can instead use Purchase Orders as the basis for the data selection.  I have a GlideRecord ajax that I built to query the data but I cannot figure out how to return the records from the Ajax into a drop down list on the UI Page.  Has anyone ever attempted this or gotten something like this to work?  I have a drop down list on the UI page and I can hard code options to the drop down using code on the UI page but I need it to be more dynamic than that.

Any assistance would be greatly appreciated.  I followed the steps on servicenowguru to build the UI Page.

GlideDialogWindow: Advanced Popups Using UI Pages - ServiceNow Guru

[Anil Lande · Accepted solution]

Hi,

Are you able to return data from GlideAjax to UI page (anything like helloworld)?

If yes then you can build an object return it by doing JSON.stringify.

Once you receive it in UI page parse it using JSON.parse and repeat for all elements and add them as options.

Jelly forEach using JSON object

Access JSON value in jelly?

Thanks,

Anil Lande

[Aaron Brown2]

Thank you so much for the information.  I was able to take what you sent and have the information filter into the dropdown options by using the code below.

<select aria-labelledby="select_stage_label" class="form-control" name="externalPO" id="externalPO" onchange="loadLineItems(event.target.value);">
  <option disabled="disabled" selected="selected">${gs.getMessage('Select a Purchase Order')}</option>
    <j2:forEach items="$[jvar_jsonObj]" var="jvar_json">
      <div id="incident-$[jvar_json.purchaseOrder]-$[jvar_json.externalPO]-content" class="my-incident-content">
        <!--<option value="value">'List Box visible select option'</option-->
        <!---<p> Results: $[jvar_json.purchaseOrder]-$[jvar_json.externalPO] </p>-->
        <option value='$[jvar_json.purchaseOrder]'>$[jvar_json.externalPO]</option>
      </div>
    </j2:forEach>
</select>