Creating custom lookup field in VF page for objects

Recently I got requirement in which I have to store information like Email template name, frequency of sending emails and few other fields in custom object. While selecting email template, salesforce standard look up pop should open which usually comes while creating Email Alerts (for selecting email template). Already custom fields like EmailTemplateid (text), and EmailTemplateName(text) were created in custom object. Also user want flexibility to create many records at once.

Below is sample code to create custom look up in VF page for email template:

Explanation:

First look at input elements:

• Input text with id='Template_lkid' stores email template id.
• Input text with id="Template_lkold" stores email template name.

Now look at javascript function:

JavaScript:openLookup('/_ui/common/data/LookupPage?lkfm=editPage&lknm='+templatenameid+'&lkrf=&epf=1&lktp=00X',670,'1','&lksrch=' + escapeUTF(getElementByIdCS(templatenameid).value.substring(0, 80)))";

About parameters which need to be set for replicating standard look up behaviour:

• lknm : This specify the id of input text where selected value in pop up will display
• lktp : This is object prefix( first 3 characters). in my case '00X' prefix for Email Template
• lksrch : This is search parameter. If you specify text, then in pop up system will search and show results.
• In order to store id of record selected in pop up, this function search input text field with id equal to value passed for lknm parameter appended by '_lkid'. For example, if we pass 'Template' as value for lknm parameters, then selected record id will be populated in input text field with id='Template_lkid'.

I have used <apex:inputtext/> tag inside pageblocktable, salesforce generate unique ids while rendering page. As it is repeating element, salesforce append numbers(index) starting from 0 (for first element) in front of id specified in apex:input tag. So in order to populate selected values to correct input text elements, I have created a counter variable in my wrapper. So whenever user clicks on lookup icon, I am passing the element id in javascript and extracting index (counter value) from it and then creating requird id which will be passed for lknm parameter.

In order to implement custom look up for other object, just change object prefix in javascriot openLookup function and it will work. For example, Account object prefix is '001'. Just change '00X' to '001' in order to open pop up for account records.

Snapshot

Hope this will help someone.
looking forward your comments and suggestions...