Search and update record widget

ImranrasheeM
Tera Contributor

I am looking for a widget using which I can search for a record from custom table, once the record is populated I need to have a submit button. Which will update the opened record.

I tried initially with record producer, with client script I populated the record details. It works with onchange. My issue over here is when user search for the record and directly try to submit which out giving time to validate it.

Any suggestions on this?

9 REPLIES 9

@ImranrasheeM 

then please use catalog item and not record producer for this

1 variable where user enters passcode, then it will search record from custom table based on this code

Then they can validate

If my response helped please mark it correct and close the thread so that it benefits future readers.

Regards,
Ankur
✨ Certified Technical Architect  ||  ✨ 9x ServiceNow MVP  ||  ✨ ServiceNow Community Leader

@Ankur Bawiskar My issue over here is that I have a variable here called passcode and onchange of it, the custom table record populates. This onchange will work only when user clicks somewhere within the page. But when user gives the value  within the field and then direct goes to submit, then the validation error occurs.

@ImranrasheeM 

if you are using normal variable then person has to click somewhere so that onChange runs

If you want as soon as person types in the search should happen then you need to create a widget with input and then associate that widget with variable of type "Custom"

But logically if you see if you allow user to type INC and user is continuing to type then it should ideally search once the entire number is entered

If my response helped please mark it correct and close the thread so that it benefits future readers.

 

Regards,
Ankur
✨ Certified Technical Architect  ||  ✨ 9x ServiceNow MVP  ||  ✨ ServiceNow Community Leader

@ImranrasheeM 

Something like this should help you get started and remember you can set the variable value from that widget

HTML:

<div>
  <label for="incidentSearch">Incident Number:</label>
  <input id="incidentSearch" ng-model="c.keyword" ng-change="c.keywordSearch()" type="text" placeholder="Type incident number..." autocomplete="off">
  <div ng-if="c.showResults">
    <div ng-if="data.incidents.length > 0">
      <table class="table">
        <tr>
          <th>Number</th>
          <th>Short Description</th>
        </tr>
        <tr ng-repeat="inc in data.incidents">
          <td>{{inc.number}}</td>
          <td>{{inc.short_description}}</td>
        </tr>
      </table>
    </div>
    <div ng-if="data.incidents.length === 0 && c.keyword">
      <p>No incidents found for "{{c.keyword}}".</p>
    </div>
  </div>
</div>

Client:

api.controller = function() {
  var c = this;
  c.showResults = false;

  c.keywordSearch = function() {
    if (c.keyword && c.keyword.length > 2) { // Trigger search after 3 characters
      c.data.action = "keyword_search";
      c.data.keyword = c.keyword;
      c.server.update().then(function() {
        c.showResults = true;
      });
    } else {
      c.showResults = false;
      c.data.incidents = [];
    }
  };
};

Server:

(function() {
  data.incidents = [];
  if (input && input.action === "keyword_search" && input.keyword) {
    var inc = new GlideRecord("incident");
    // Search for incident numbers containing the input (case-insensitive)
    inc.addQuery('number', 'CONTAINS', input.keyword);
    inc.query();
    while (inc.next()) {
      data.incidents.push({
        "number": inc.number.toString(),
        "short_description": inc.short_description.toString()
      });
    }
  }
})();

Output:

incident search widget.gif

I believe I have answered your question and you can take it further from here

If my response helped please mark it correct and close the thread so that it benefits future readers.

Regards,
Ankur
✨ Certified Technical Architect  ||  ✨ 9x ServiceNow MVP  ||  ✨ ServiceNow Community Leader

@ImranrasheeM 

Hope you are doing good.

Did my reply answer your question?

If my response helped please mark it correct and close the thread so that it benefits future readers.

Regards,
Ankur
✨ Certified Technical Architect  ||  ✨ 9x ServiceNow MVP  ||  ✨ ServiceNow Community Leader