1

I have below code where after I do enter an auto complete input text value I need to click elsewhere for the apex class method {!applyfiler} to work. But I need to call that method instantly after input text value enterred without any further click. Can someone please help me here?

Apex page code

 <apex:pageblockSectionItem > 
       <apex:outputText rendered="{!userType == 'Admin' || userType == 'HomeOffice' || userType == 'Field'}">Compliance Incident Transaction Name</apex:outputText>
            <apex:inputText styleClass="apexCITautocomplete" value="{!selectedCIT}" id="Rep">
        <apex:actionSupport event="onchange" action="{!applyfiler}" rerender="pb"/>
     </apex:inputtext> 
    </apex:pageblockSectionItem> 
8
  • I think you can use onKeyPress event, but why would you want to call a method like this? If there is a query or a DML you will very likely to hit the limits and break everything
    – Novarg
    Jan 5, 2017 at 8:37
  • What could be an alternative? Can you please let me know if somehow by javascript that possible? Jan 5, 2017 at 8:39
  • I think that you should apply the "onkeyup" event to your action support. Jan 5, 2017 at 8:39
  • I can't find such example, trying out that in google. Jan 5, 2017 at 8:42
  • I see that you are building and autocomplete component. You can use onkeypress or onkeyup instead of onchange event. I think you should use an actionfunction and call it only when user has typed 2 or more characters. OR you can use a pre-built component Autocomplete v2
    – manjit5190
    Jan 5, 2017 at 8:46

2 Answers 2

2

You can use onKeyPress, as said. But you may want to consider to make it smarter than making a SOQL query on each key that was pressed. For example using javascript you can wait to make a call (remote action) until 3 characters are added.

If the size of the table you are quering allows it you can then select all that start with those 3 characters.

ex: SELECT Name FROM Object__c WHERE Name Like 'abc%' and do further filtering client-side.

In this case you have only 1 SOQL query.

6
  • @Nielson. It calls the method before I complete entering the input text. Thus showing erroneous result. Both onkeyup and onkeypress works kind of similar fashion. Jan 5, 2017 at 8:53
  • What kind of result are you getting? Onkeypress you should execute the query and bind it to your autocomplete list. If the usermeanwhile typed more charachters you should filter the result list based on those characters (or block typing while you refresh the list using the query)
    – Nielsm
    Jan 5, 2017 at 9:01
  • Did you checkout the package that someone added to the comments of your question? Sounds like you can just steal a bit from their implementation: blogforce9.blogspot.be/2013/10/…
    – Nielsm
    Jan 5, 2017 at 9:01
  • Before I do select the input text value from the suggestions, onkeypress or onkeyup calls the method. Hence my selected value is not sent. Thus causing wrong results. Jan 5, 2017 at 9:06
  • Yes looking into it. But I don't think adding component will at all be permissible here. :( Jan 5, 2017 at 9:07
2
<script src="//ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
<script> 
window.$j = jQuery.noConflict(); 
$j(document).ready(function(){ 
$j('input[id$=Rep]').on('input', function () { 
   applyfilter($j(this).val());
}); 
}); 

</script>

<apex:actionfunction action="{!applyfiler}" name="applyfilter" rerender="pb">
  <apex:param assignto="{!selectedCIT}" name="param1" value="">
</apex:actionfunction>
<apex:pageblockSection>
<apex:pageblockSectionItem > 
       <apex:outputText rendered="{!userType == 'Admin' || userType == 'HomeOffice' || userType == 'Field'}">Compliance Incident Transaction Name</apex:outputText>
            <apex:inputText styleClass="apexCITautocomplete" value="{!selectedCIT}" id="Rep">
     </apex:inputtext> 
    </apex:pageblockSectionItem>
8
  • It calls the method before I complete entering the input text. Thus showing erroneous result. Both onkeyup and onkeypress works kind of similar fashion. Jan 5, 2017 at 8:52
  • Can you please guide me how to do that using Javascript function? I have no depth knowledge in javascript but I think that could be the perfect way. Jan 5, 2017 at 8:58
  • I found a start for your problem with JQuery: stackoverflow.com/questions/7105997/… Jan 5, 2017 at 9:10
  • Yes this exactly is the case but how may I use this? Jan 5, 2017 at 9:14
  • 1
    You have to include the JQuery script. Then bind your event with JQuery like in my previous link. Then in the change event, call your apex method like this: stackoverflow.com/questions/21047775/… Jan 5, 2017 at 9:17

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .