Tuesday 15 August 2017

Siebel Auto Complete Plugin :- Part 1

Hello All,

In Siebel Dropdown fields (LOV) we have option to enter some Letter and related Option are shown in Dropdown, as shown in below image.











But in Normal Text Fields we have to enter the complete information there is no option of auto-complete.
We can extend the Option for auto fill for normal text fields also by the below mentioned Method.









  • We need to use a 3rd party Plugin that Offers Auto Complete option
  • I am using file from TypeAhead, http://twitter.github.io/typeahead.js/
  • Include the file in Our PR file 
  • Call Method in PR file
  • We can either retrieve the Option from Fixed set of value as in this example or From a file (.txt) or at run-time by querying Database (will take this in further articles)
Sample PR Code 

you can download typeahead.js file and PR file from here

PR File : https://drive.google.com/open?id=0B52024rQ9Hc0NXQxWTR1TEtUbzg
JS file : https://drive.google.com/open?id=0B52024rQ9Hc0LURFbTQ1aDNiTzg

if (typeof(SiebelAppFacade.AutoComplete) === "undefined") {

SiebelJS.Namespace("SiebelAppFacade.AutoComplete");
define("siebel/custom/AutoComplete", ["siebel/phyrenderer","siebel/custom/typeahead"],
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 );
             
                /* Static List of Control Identifier which will be displayed in Carousel; */
             
            }
         

            SiebelJS.Extend( AutoComplete, SiebelAppFacade.PhysicalRenderer );


AutoComplete.prototype.ShowUI = function(){
                SiebelAppFacade.AutoComplete.superclass.ShowUI.call( this );
var pm = this.GetPM();

}

/// bind events function
     AutoComplete.prototype.BindEvents = function(){
SiebelAppFacade.AutoComplete.superclass.BindEvents.call( this );
var pm = this.GetPM();
var controls = this.GetPM().Get("GetControls");

// read out Description field
$('[aria-label="Alternate Phone #"]').dblclick(function(){

// var controls = pm.Get( "GetControls" );
             var cntrl = controls[ "Description2" ];
// alert(controls);
var Status = pm.ExecuteMethod( "GetFieldValue", cntrl );
//alert(Status);
responsiveVoice.speak( Status );
});

/////////////////////////////////

 var substringMatcher = function(strs) {
 return function findMatches(q, cb) {
var matches, substringRegex;

// an array that will be populated with substring matches
matches = [];

// regex used to determine if a string contains the substring `q`
substrRegex = new RegExp(q, 'i');

// iterate through the pool of strings and for any string that
// contains the substring `q`, add it to the `matches` array
$.each(strs, function(i, str) {
 if (substrRegex.test(str)) {
matches.push(str);
 }
});

cb(matches);
 };
};

var states = ['Alabama', 'Alaska', 'Arizona', 'Arkansas', 'California',
 'Colorado', 'Connecticut', 'Delaware', 'Florida', 'Georgia', 'Hawaii',
 'Idaho', 'Illinois', 'Indiana', 'Iowa', 'Kansas', 'Kentucky', 'Louisiana',
 'Maine', 'Maryland', 'Massachusetts', 'Michigan', 'Minnesota',
 'Mississippi', 'Missouri', 'Montana', 'Nebraska', 'Nevada', 'New Hampshire',
 'New Jersey', 'New Mexico', 'New York', 'North Carolina', 'North Dakota',
 'Ohio', 'Oklahoma', 'Oregon', 'Pennsylvania', 'Rhode Island',
 'South Carolina', 'South Dakota', 'Tennessee', 'Texas', 'Utah', 'Vermont',
 'Virginia', 'Washington', 'West Virginia', 'Wisconsin', 'Wyoming'
];

//$('#1_Last_Name').typeahead({    /// tt-menu  tt-open



$('[aria-label="Alternate Phone #"]').typeahead({
 hint: true,
 highlight: true,
 minLength: 1
},
{
 name: 'states',
 source: substringMatcher(states)
});

  //define colour, Border and Width Scheme

$('.tt-menu').css({ "background": "#F5F5F5", "width": "155px","border-style": "solid"})


////////////////////////////////
};

return AutoComplete;
}
());
return "SiebelAppFacade.AutoComplete";
});
}

Working Example of the above is :




Will be sharing further advaced option te fetch data from Files and Siebel Database in further Articles.
Your Comments are most welcomed ..

4 comments:

  1. Very innovative. Appreciate your effort on implementing this and spreading the knowledge among us.

    ReplyDelete
  2. Hi Rahul...eagerly waiting for its 2nd part(fetch data from Files and Siebel Database ) :-)

    ReplyDelete
    Replies
    1. http://www.siebelfoundations.com/2017/08/auto-complete-siebel-text-fields-part-1.html, check this

      Delete
  3. http://www.siebelfoundations.com/2017/08/auto-complete-siebel-text-fields-part-1.html, for advance version

    ReplyDelete

Siebel GoTo View - Handling Realtime cases

 Hello All,  We all must have used GoTo view functionality of siebel to navigate to a particular view from current view. What if the require...