Siebel Auto Complete Functionality :- Part 2

Hello All ,

This post is continuation of post Autocomplete in Siebel ,in this post i have tried to remove the dependency of 3rd party Files as it has its own Encapsulated classes and methods which we could not control much.

So in this post lets try to achieve the functionality using native siebel jQuery Framework,

• jQuery function autocomplete() can be used to bring the feature , since its native siebel jQuery Framework we need worry about the layout or CSS

• Source , the source is the data set from which the searched value appears in drop down source has 2 components , Request and Response 

 Code snippet that does the magic :-)

Define source to hold the Suggestions/Options for auto fill, is a Array of keywords as below,

var tags = [ "AAKASH", "ABHISHEK", "MOHIT", "ROHIT", "BHANU", "PRITAM", "RAHUL" ];

 Define function that reads the user input and searches the source using RegExp function of jQuery.

$( '.siebui-ctrl-textarea').autocomplete(
{  source: function( request, response ) {
          var matcher = new RegExp( "^" + $.ui.autocomplete.escapeRegex( request.term ), "i" );
          response( $.grep( tags, function( item ){
              return matcher.test( item );
          }) );
      }
});


Working Code ,

video here,

PR File ,

if (typeof(SiebelAppFacade.AutoComplete) === "undefined") {  SiebelJS.Namespace("SiebelAppFacade.AutoComplete");  define("siebel/custom/AutoComplete", ["siebel/phyrenderer"], function () { SiebelAppFacade.AutoComplete = (function () {  function AutoComplete( pm ) { /* Be a good citizen. Let Superclass constructor function gets executed first */ SiebelAppFacade.AutoComplete.superclass.constructor.call( this, pm );  }  SiebelJS.Extend( AutoComplete, SiebelAppFacade.PhysicalRenderer );  /// bind events function  AutoComplete.prototype.BindEvents = function(){ SiebelAppFacade.AutoComplete.superclass.BindEvents.call( this );  var tags = [ "AAKASH", "ABHISHEK", "MOHIT", "ROHIT", "BHANU", "PRITAM", "RAHUL" ]; //////bind Autocomplete with all the text area fields //////  $( '.siebui-ctrl-textarea').autocomplete({ source: function( request, response )  {  var matcher = new RegExp( "^" + $.ui.autocomplete.escapeRegex( request.term ), "i" );  response( $.grep( tags, function( item ){ return matcher.test( item ); }) );  } });  };  return AutoComplete;  } ());  return "SiebelAppFacade.AutoComplete"; });  }

In my next post i will try to extend this to read the data from Siebel Database then manually passing in variable.