Sign Up ›

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
JNicJNic 

Javascript / apex / reRender problems

Hi guys.

 

Bit of a conundrum here...

 

I've got a VF page that has an inputText field that users use to scan in barcodes using a handheld barcode scanner.

The barcode scanner merely act like a keyboard: it translates the scan to keys, then types those keys and hits enter.

 

What I'd like to do, is have users scan a barcode, then conduct an apex query. If the results are good, it updates a record, if the results are bad - it throws a pageMessage.

 

I got some JS that checks when the enter key is hit, and then I envoke the apex. However, there seems to be an issue with the sequence of reRendering and apex, and JS.

 

When I do the scan into the input field - the page does a refresh - but the apex:PageMessage that should display does not...

 

Here's what I have so far:

 

 

<apex:page standardController="terminalPrepOrder__c" extensions="terminalPrepOrderController" >
    <apex:variable var="prp" value="{!terminalPrepOrder__c}"/>

        function checkEnter(e){ <!-- e is event object passed from function invocation -->
            var characterCode <!--literal character code will be stored in this variable -->

            if(e && e.which){ <!--if which property of event object is supported (NN4) -->
                e = e
                characterCode = e.which <!-- character code is contained in NN4's which property -->
            }
            else{
                e = event
                characterCode = e.keyCode <!-- character code is contained in IE's keyCode property -->
            }

            if(characterCode == 13){ <!-- if generated character code is equal to ascii 13 (if enter key) -->
                alert("clicked enter");
                otherFindTerminal(); <!--  submit the form -->
                return false;
            }
            else{
            return true
            }
        }
    </script>

    <apex:pageMessages id="msgs"/>
    <apex:form id="theForm">
        <apex:actionFunction name="findTerminal" action="{!otherFindTerminal}" reRender="msgs"/>
        <apex:outputText value="Scan Terminal Barcode "/>
        <apex:inputText value="{!searchBarcode}" onkeypress="checkEnter(event)"/>
        <apex:commandButton value="Find" action="{!otherFindTerminal}" id="hitMe" reRender="msgs"/>
    </apex:form>

 Controller:

 

	public PageReference otherFindTerminal() {  
        try {
            if (searchBarcode != '') {
              terminal__c enteredTrm = [select Id from Terminal__c T where T.barcodeNumber__c = :searchBarcode limit 1];        
           
             terminalPrepOrder__c trmPrp = (terminalPrepOrder__c) controller.getRecord();
           
             trmPrp.Terminal__c = enteredTrm.Id;
             update trmPrp;
            }
            else if (searchBarcode == '' ) {
                ApexPages.Message invalidSearch = new ApexPages.Message(ApexPages.Severity.ERROR, 'Invalid barcode.');
                ApexPages.addMessage(invalidSearch);
            }
        }
        catch (exception e) {
        
            ApexPages.Message noTrm = new ApexPages.Message(ApexPages.Severity.ERROR, searchBarcode + ' not found. Please enter the Terminal barcode.');
            ApexPages.addMessage(noTrm);
        }
        return null;
    }

 

 

 

So when I click the commandButton - it functions perfectly - It does the query, and rerenders the messages...

 

When I use the input field and hit enter... it refreshes the page but does nothing...

 

 

Please help!

Thanks

Best Answer chosen by Admin (Salesforce Developers) 
sforce2009sforce2009

This is the example I have executed on basis of Your code and it works. Check this and tell me

Here is the link to screenshot

<apex:page standardController="Account" extensions="AccountTest" id="thePage">
    <apex:variable var="prp" value="test"/> 

    <script src="../../soap/ajax/18.0/connection.js" type="text/javascript"></script>

    <script type="text/javascript">

        function checkEnter(e){ <!-- e is event object passed from function invocation -->
            var characterCode <!--literal character code will be stored in this variable -->

            if(e && e.which){ <!--if which property of event object is supported (NN4) -->
                e = e
                characterCode = e.which <!-- character code is contained in NN4's which property -->
            }
            else{
                e = event
                characterCode = e.keyCode <!-- character code is contained in IE's keyCode property -->
            }
            if(characterCode == 13){ <!-- if generated character code is equal to ascii 13 (if enter key) -->
                //alert("clicked enter");
                otherFindTerminal();
                
            }
            else {
            return true;
            }
            return false;
        }
    </script>

    <apex:form id="theForm">
    

   
        <apex:actionFunction name="otherFindTerminal" action="{!otherFindTerminal}" reRender="out"/>

      
        <apex:outputText value="Scan Terminal Barcode"/>
        
        <apex:inputText id="searchBarcode" onkeypress="return checkEnter(event)" >
         </apex:inputText>
         

                <apex:commandLink value="Find" action="{!otherFindTerminal}" id="theCommand" />
    </apex:form>
    <apex:outputPanel id="out">
            <apex:pageMessages />
            
        </apex:outputPanel>
</apex:page>

public with sharing class AccountTest {

   public AccountTest(ApexPages.StandardController ctlr)
   {}
   public pageReference otherFindTerminal() {  
        
            ApexPages.Message noTrm = new ApexPages.Message(ApexPages.Severity.ERROR, ' not found. Please scan the Terminal barcode.');
            ApexPages.addMessage(noTrm);
        return null;
}
}

 

All Answers

imuino2imuino2
  if(characterCode == 13){ <!-- if generated character code is equal to ascii 13 (if enter key) -->
                alert("clicked enter");
                otherFindTerminal(); <!--  submit the form -->
                return false;
            }

otherfindTerminal() is not defined in javascript to do what you want you need to define an apex:actionFunction this component allows you to call a method on your controller by javascript code. in your case it should be like this

 

<apex:actionFunction action="{!otherFindTerminal}" name="otherFindTerminal"/>

 

action is the method to call in the controller, and name is the name the function will have on javascript, it doesnt have to have the same name you can choose any you want for the javascript function.

Include that code in your page. You already have the javascript code that calls the function.

If you have any doubt let me know.

 

Ignacio.
JNicJNic

Thanks Ignacio,

 

I've changed it to the following:

 

 

    <script>

        function checkEnter(e){ <!-- e is event object passed from function invocation -->
            var characterCode <!--literal character code will be stored in this variable -->

            if(e && e.which){ <!--if which property of event object is supported (NN4) -->
                e = e
                characterCode = e.which <!-- character code is contained in NN4's which property -->
            }
            else{
                e = event
                characterCode = e.keyCode <!-- character code is contained in IE's keyCode property -->
            }

            if(characterCode == 13){ <!-- if generated character code is equal to ascii 13 (if enter key) -->
                alert("clicked enter");
                otherFindTerminal();
                return false;
            }
            else{
            return true
            }
        }
    </script>


    <apex:form id="theForm">
        <apex:pageMessages id="msgs"/>
        <apex:actionFunction name="otherFindTerminal" action="{!otherFindTerminal}" reRender="msgs"/>
        <apex:outputText value="Scan Terminal Barcode "/>
        <apex:inputText value="{!searchBarcode}" onkeypress="checkEnter(event);"/>
        <apex:commandButton value="Find" action="{!otherFindTerminal}" id="hitMe" reRender="msgs"/>
    </apex:form>

 But still, it just refreshes the page without any messages rendered...

 

I even did a test of changing the method to display a message no matter what:

 

	public PageReference otherFindTerminal() {  
        try {
            if (searchBarcode != '') {
            	ApexPages.Message testSearch = new ApexPages.Message(ApexPages.Severity.ERROR, 'test message.');
                ApexPages.addMessage(testSearch);
                
             /*terminal__c enteredTrm = [select Id from Terminal__c T where T.barcodeNumber__c = :searchBarcode limit 1];        
           
             terminalPrepOrder__c trmPrp = (terminalPrepOrder__c) controller.getRecord();
           
             trmPrp.Terminal__c = enteredTrm.Id;
             update trmPrp;
             */
             return null;
            }
            else if (searchBarcode == '' ) {
                ApexPages.Message invalidSearch = new ApexPages.Message(ApexPages.Severity.ERROR, 'Invalid barcode.');
                ApexPages.addMessage(invalidSearch);
                return null;
            }
        }
        catch (exception e) {
        
            ApexPages.Message noTrm = new ApexPages.Message(ApexPages.Severity.ERROR, searchBarcode + ' not found. Please enter the Terminal barcode.');
            ApexPages.addMessage(noTrm);
            return null;
        }
        return null;
    }

 

And still... nothing...

 

I'm missing something here.

 

 

 
stephanstephan

Two thing:

 

1) Comments in JavaScript should be like this

 

// this is a comment

 

or like this

 

/* this is another comment */

 

Using <!-- HTML comment syntax --> will cause an error.

 

2) Try using Firefix with the Firebug extensions to help identify other errors in your javascript.

 
JNicJNic

Thanks Stephan,

 

I don't think that's a correct statement - building in visualforce takes care of comment syntax. I've used this comment syntax on many other functioning pages.

 

I've installed firebug but there are no errors...

 

The method is called correctly already. That much I know because it does the "return null;" refresh that occurs when the pageReference method is called. The only issue is that it doesn't render any messages...
sforce2009sforce2009

Put a return false; at the end of the checkEnter JS function. Try putting the PageMessages tag into a outPutPanel and rerender the outputPanel.
Philip_FPhilip_F

Nice one, Srinivas!  That was the exact solution for a similar problem I was having.  Thanks.

 

Cheers,

-Philip
JNicJNic

No dice guys...

 

I've modified it as such:

 

 

<apex:page standardController="terminalPrepOrder__c" extensions="terminalPrepOrderController" id="thePage">
    <apex:variable var="prp" value="{!terminalPrepOrder__c}"/> 

    <script src="../../soap/ajax/18.0/connection.js" type="text/javascript"></script>

    <script type="text/javascript">

        function checkEnter(e){ <!-- e is event object passed from function invocation -->
            var characterCode <!--literal character code will be stored in this variable -->

            if(e && e.which){ <!--if which property of event object is supported (NN4) -->
                e = e
                characterCode = e.which <!-- character code is contained in NN4's which property -->
            }
            else{
                e = event
                characterCode = e.keyCode <!-- character code is contained in IE's keyCode property -->
            }
            if(characterCode == 13){ <!-- if generated character code is equal to ascii 13 (if enter key) -->
                alert("clicked enter");
                otherFindTerminal();
                return false;
            }
            else {
            return true
            }
            return false;
        }
    </script>
    
        <apex:outputPanel id="msgs">
            <apex:pageMessages />
        </apex:outputPanel>


    <apex:form id="theForm">

        <apex:actionFunction name="otherFindTerminal" action="{!otherFindTerminal}" reRender="msgs"/>
        <apex:outputText value="Scan Terminal Barcode"/>
        <apex:inputText value="{!searchBarcode}" onkeypress="checkEnter(event)" id="searchBarcode"/>
        <apex:commandLink value="Find" action="{!otherFindTerminal}" id="theCommand" />
    </apex:form>
</apex:page>

 

 

	public pageReference otherFindTerminal() {  
        try {
            if (searchBarcode != '') {
            terminal__c scannedTrm = [select Id from terminal__c T where T.barcodeNumber__c = :searchBarcode limit 1];
        
            terminalPrepOrder__c trmPrp = (terminalPrepOrder__c) controller.getRecord();
            trmPrp.terminal__c = scannedTrm.id;
    
            update trmPrp;
    
            Controller = new ApexPages.standardController(trmPrp);
            return Controller.view();
            }
            else if (searchBarcode == '' ) {
                ApexPages.Message invalidSearch = new ApexPages.Message(ApexPages.Severity.ERROR, 'Invalid barcode.');
                ApexPages.addMessage(invalidSearch);
            }
        }
        catch (exception e) {
        
            ApexPages.Message noTrm = new ApexPages.Message(ApexPages.Severity.ERROR, searchBarcode + ' not found. Please scan the Terminal barcode.');
            ApexPages.addMessage(noTrm);
        }
        return null;
}

 

 

 

 

The page "spins" and refreshes or something... so no message appears

If I call the command directly by clicking the commandLink - it works perfectly...

 

Is there a way to use the checkEnter(e) function to simulate a click on the command link, thus calling the method in a manner that visualforce understands?

 

Action function doesn't work...

 

 

Maybe I can do this whole thing in AJAX without touching apex?

I don't know much about JS... I try and stay away from it, but the fact that I have an input device that's hitting enter really means I have to use JS to check for enter THEN call apex...

 
sforce2009sforce2009

its simple

replace inputText with this. return is the culprit :)

<apex:inputText value="{!searchBarcode}" onkeypress="return checkEnter(event)" id="searchBarcode"/>
JNicJNic

Hmm that didn't seem to work either Srinivas...

 

 

But... good news... I have gotten some results... not the results I need... but results none-the-less...

 

Here's what I have now:

 

PAGE:

 

<apex:page standardController="terminalPrepOrder__c" extensions="terminalPrepOrderController" sidebar="false" showHeader="false" id="thePage">
    <apex:variable var="prp" value="{!terminalPrepOrder__c}"/> 

    <script src="../../soap/ajax/18.0/connection.js" type="text/javascript"></script>

    <script type="text/javascript">

        function checkEnter(e){ <!-- e is event object passed from function invocation -->
            var characterCode <!--literal character code will be stored in this variable -->

            if(e && e.which){ <!--if which property of event object is supported (NN4) -->
                e = e
                characterCode = e.which <!-- character code is contained in NN4's which property -->
            }
            else{
                e = event
                characterCode = e.keyCode <!-- character code is contained in IE's keyCode property -->
            }
            if(characterCode == 13){ <!-- if generated character code is equal to ascii 13 (if enter key) -->
                otherFindTerminal();
                return true;
            }
            else {
            return false;
            }
            return false;
        }

    </script>
  
    <apex:pageBlock title="Find a Terminal">
        <apex:outputPanel id="msgOp">
            <apex:pageMessages id="msg"/>
        </apex:outputPanel>
        <apex:pageBlockSection title="Current Terminal">
            <apex:pageBlockSectionItem >
                <apex:outputLabel value="Terminal"/>
                <apex:outputField value="{!prp.Terminal__c}" id="terminal"/>
            </apex:pageBlockSectionItem>
        </apex:pageblockSection>
    </apex:pageBlock>

    <apex:form id="theForm">
        <apex:actionFunction name="checkEnter" action="{!otherFindTerminal}" reRender="terminal, msg, msgOp" focus="searchBarcode"/>
        <apex:outputText value="Scan Terminal Barcode"/>
        <apex:inputText value="{!searchBarcode}" onkeypress="checkEnter(event)" id="searchBarcode"/>
        <apex:commandLink value="Find" action="{!otherFindTerminal}" id="theCommand" reRender="terminal, msg, msgOp"/>
    </apex:form>
</apex:page>

 

CONTROLLER

 

public with sharing class terminalPrepOrderController {

    public string searchBarcode; //The barcode that has been scanned
    public terminalPrepOrder__c trmPrp {get;set;}

    public String getSearchBarcode()
    {
      return searchBarcode;
    }

    public void setSearchBarcode(String newSB)
    {
       searchBarcode = newSB;
    }

	//page constructor
    public ApexPages.StandardController controller;
    public terminalPrepOrderController(ApexPages.StandardController controller) {

        this.controller = controller;
        terminalPrepOrder__c trmPrp = (terminalPrepOrder__c) controller.getRecord();	
	
    }
	
	public pageReference otherFindTerminal() {  
        terminalPrepOrder__c trmPrp = (terminalPrepOrder__c) controller.getRecord();
        try {
            if (searchBarcode != '') {
	            terminal__c scannedTrm = [select Id from terminal__c T where T.barcodeNumber__c = :searchBarcode limit 1];
	            trmPrp.terminal__c = scannedTrm.id;
	            update trmPrp;
	            
	            ApexPages.Message invalidSearch = new ApexPages.Message(ApexPages.Severity.CONFIRM, 'Found ' + scannedTrm.id);
	            ApexPages.addMessage(invalidSearch);
				return null;
            }
            else if (searchBarcode == '' ) {
                ApexPages.Message invalidSearch = new ApexPages.Message(ApexPages.Severity.ERROR, 'Invalid barcode.');
                ApexPages.addMessage(invalidSearch);
				return null;
            }
        }
        catch (exception e) {
            ApexPages.Message noTrm = new ApexPages.Message(ApexPages.Severity.ERROR, searchBarcode + ' not found. Please scan the Terminal barcode.');
            ApexPages.addMessage(noTrm);
			return null;
        }
        return null;
    }
}

 

 

Now, heres the problem:

 

 

If I simply start typing in the input box, the function runs, and calls apex regardless of whether or not I press enter... it simply runs on every key press. I know this, because it does rerender the pageMessages and I see them return errors.

 

Now... the other issue is, that I tested simply clicking enter in the input box and nothing happens... the page just refereshes! That's the issue:

When a user pushes enter in an input box, it does... something... refreshes the page... tries to submit a form... I dunno...

 

 

What's going on here?!

 
sforce2009sforce2009

This is the example I have executed on basis of Your code and it works. Check this and tell me

Here is the link to screenshot

<apex:page standardController="Account" extensions="AccountTest" id="thePage">
    <apex:variable var="prp" value="test"/> 

    <script src="../../soap/ajax/18.0/connection.js" type="text/javascript"></script>

    <script type="text/javascript">

        function checkEnter(e){ <!-- e is event object passed from function invocation -->
            var characterCode <!--literal character code will be stored in this variable -->

            if(e && e.which){ <!--if which property of event object is supported (NN4) -->
                e = e
                characterCode = e.which <!-- character code is contained in NN4's which property -->
            }
            else{
                e = event
                characterCode = e.keyCode <!-- character code is contained in IE's keyCode property -->
            }
            if(characterCode == 13){ <!-- if generated character code is equal to ascii 13 (if enter key) -->
                //alert("clicked enter");
                otherFindTerminal();
                
            }
            else {
            return true;
            }
            return false;
        }
    </script>

    <apex:form id="theForm">
    

   
        <apex:actionFunction name="otherFindTerminal" action="{!otherFindTerminal}" reRender="out"/>

      
        <apex:outputText value="Scan Terminal Barcode"/>
        
        <apex:inputText id="searchBarcode" onkeypress="return checkEnter(event)" >
         </apex:inputText>
         

                <apex:commandLink value="Find" action="{!otherFindTerminal}" id="theCommand" />
    </apex:form>
    <apex:outputPanel id="out">
            <apex:pageMessages />
            
        </apex:outputPanel>
</apex:page>

public with sharing class AccountTest {

   public AccountTest(ApexPages.StandardController ctlr)
   {}
   public pageReference otherFindTerminal() {  
        
            ApexPages.Message noTrm = new ApexPages.Message(ApexPages.Severity.ERROR, ' not found. Please scan the Terminal barcode.');
            ApexPages.addMessage(noTrm);
        return null;
}
}

 

This was selected as the best answer
JNicJNic

Yup... That did it... I don't know what was wrong with mine... I overwrote it all with yours and it works perfectly.

 

Thank you so much for your help!!!
sforce2009sforce2009

Thats good to hear.. anytime.. If I can offer any help, I would be happy to do so...
JNicJNic

Now I've got another problem... my reRender doesn't seem to work... It only reRenders the Terminal field...

 

 

<apex:page standardController="terminalPrepOrder__c" extensions="terminalPrepOrderController" sidebar="false" showHeader="false" id="thePage" >
    <apex:variable var="prp" value="{!terminalPrepOrder__c}"/> 
    <apex:variable var="inlineStyle" value="width:30px;"/>
    <apex:variable var="unmetStyle" value="font-style:italic;color:orange;font-weight:bold;"/>

    <script src="../../soap/ajax/18.0/connection.js" type="text/javascript"></script>

    <apex:outputPanel id="script">
    <script type="text/javascript">
        window.onload = setFocus
        function setFocus() {
            
            document.getElementById('{!$Component.thePage.terminalPb.searchBarcodeForm.searchBarcodeSection.searchBarcodeSectionItem.searchBarcodePanelGroup.searchBarcode}').focus();
        }
    
        function checkEnter(e){ <!-- e is event object passed from function invocation -->
            var characterCode <!--literal character code will be stored in this variable -->

            if(e && e.which){ <!--if which property of event object is supported (NN4) -->
                e = e
                characterCode = e.which <!-- character code is contained in NN4's which property -->
            }
            else{
                e = event
                characterCode = e.keyCode <!-- character code is contained in IE's keyCode property -->
            }
            if(characterCode == 13){ <!-- if generated character code is equal to ascii 13 (if enter key) -->
                findBcTrm(); <!-- call the apex function specified in the actionFunction -->
            }
            else {
            return true;
            }
            return false;
        }
        
        function inlineJsFunction(s) {
            //alert("Got " + s);
            if (document.getElementById('{!$Component.thePage.requirementForm.inlineId}').value == '') {
                document.getElementById('{!$Component.thePage.requirementForm.inlineId}').value = s;
                inlineActionFunction();
            }
        }
        
        function inlineJsOnBlur() {
            blurInlineActionFunction();
        }
    </script>
    </apex:outputPanel>

    <apex:sectionHeader title="{!prp.Name}" subtitle="Select a Terminal"/>

    <apex:outputPanel style="display: block; margin-bottom: 1em; margin-top: 0em;">
        <apex:outputText value="« " />
        <apex:outputLink value="/{!LEFT(prp.id,15)}">
            Back to {!prp.name}
        </apex:outputLink>
    </apex:outputPanel>

    <apex:outputPanel rendered="{!prp.Type__c = 'Removal'}">
        <apex:pageMessage severity="warning" strength="1" summary="Modifying Removals"/>
        This prep order is for a <b>removal</b>. Typically, these are created with a specific Terminal scheduled for removal.
        <br></br>&#8226; If this removal prep order already contains a Terminal, you should contact the user who assigned this to you for confirmation on this change.
        <br></br>&#8226; <b>Do not remove Terminals that are not scheduled for removal.</b>
    </apex:outputPanel>

    <apex:outputPanel rendered="{!AND(prp.Type__c = 'Install', prp.approvalStatus__c != 'Submitted')}" >
        <apex:pageMessage severity="info" strength="1" summary="Reccomending Terminals"/>
        &nbsp; This page allows you to reccomend a Terminal for installation.
        <br></br>&nbsp; &#8226; Locate the Terminal by <b>Barcode, or Lookup</b>
        <br></br>&nbsp; &#8226; Review the requirements information to ensure it meets its needs, and submit for approval if required.
    </apex:outputPanel>
d
    <apex:outputPanel rendered="{!prp.approvalStatus__c = 'Submitted'}">
        <apex:pageMessage severity="warning" strength="1" summary="Submitted for approval"/>
        The Terminal selected has been submitted for approval.
        <br></br>&#8226; <b>You cannot change Terminals during the approval process.</b>
        <br></br>&#8226; If the Terminal is approved, it will be able to be prepped for shipment.
        <br></br>&#8226; You can <b>recall</b> the approval request on the Terminal Prep Order page if you have made a mistake in selection.
    </apex:outputPanel>

    <apex:form id="searchBarcodeForm">
        <apex:pageBlock title="Find a Terminal" id="findTerminalPb">
            <apex:outputPanel id="msgs">
                <apex:pageMessages id="msg"/>
            </apex:outputPanel>
            <apex:pageMessage strength="2" severity="warning" summary="Failed Requirements" detail="This terminal does not meet it's requirements, it may not be approved." rendered="{!prp.requirementGrade__c = 'Fail'}"/>
            <apex:actionFunction name="findBcTrm" action="{!findBcTrm}" reRender="findTerminalPb" focus="searchBarcode" status="otherFindTerminalStatus"/>
            <apex:pageBlockSection columns="1" id="searchBarcodeSection">
                <apex:pageBlockSectionItem id="searchBarcodeSectionItem">
                    <apex:outputLabel value="Scan Terminal Barcode "/>
                    <apex:panelGroup id="searchBarcodePanelGroup">
                        <apex:inputText id="searchBarcode" value="{!searchBarcode}" onkeypress="return checkEnter(event)" />
                        <apex:commandLink value="Find" action="{!findBcTrm}" id="theCommand" />
                        <apex:actionStatus id="otherFindTerminalStatus" >
                            <apex:facet name="start">
                                <apex:image url="{!$Resource.spinner}" />
                            </apex:facet>
                        </apex:actionStatus>
                    </apex:panelGroup>
                </apex:pageBlockSectionItem>
                <apex:pageBlockSectionItem rendered="{!prp.Type__c = 'Install'}">
                    <apex:outputLabel value="Requested terminal model"/>
                    <apex:outputField value="{!prp.requestedTerminalModel__c}"/>
                </apex:pageBlockSectionItem>
            </apex:pageBlockSection>
            <apex:pageBlockSection title="Current Terminal">
                <apex:pageBlockSectionItem >
                    <apex:outputLabel value="Terminal"/>
                    <apex:outputField value="{!prp.Terminal__c}" id="terminal"/>
                </apex:pageBlockSectionItem>
                <apex:pageBlockSectionItem >
                    <apex:outputLabel value="Origin"/>
                    <apex:outputField value="{!prp.originLocation__c}" />
                </apex:pageBlockSectionItem>
                <apex:pageBlockSectionItem >
                    <apex:outputLabel value="Model"/>
                    <apex:outputField value="{!prp.Terminal__r.kioskModel__c}" id="kioskModel"/>
                </apex:pageBlockSectionItem>
                <apex:pageBlockSectionItem >
                    <apex:outputText value=" "/>
                    <apex:outputField value="{!prp.originLocation__r.Address__c}" id="address"/>
                </apex:pageBlockSectionItem>
                <apex:pageBlockSectionItem >
                    <apex:outputLabel value="Barcode"/>
                    <apex:outputField value="{!prp.Terminal__r.barcode__c}"/>
                </apex:pageBlockSectionItem>
                <apex:pageBlockSectionItem >
                    <apex:outputText value=" "/>
                    <apex:outputPanel >
                        <apex:outputField value="{!prp.originLocation__r.City__c}"/>,&nbsp;
                        <apex:outputField value="{!prp.originLocation__r.State__c}" />
                    </apex:outputPanel>
                </apex:pageBlockSectionItem>
                <apex:pageBlockSectionItem >
                    <apex:outputLabel value="Housing Id"/>
                    <apex:outputField value="{!prp.Terminal__r.housingId__c}"/>
                </apex:pageBlockSectionItem>
                <apex:pageBlockSectionItem >
                    <apex:outputText value=" "/>
                    <apex:outputField value="{!prp.originLocation__r.Country__c}"/>
                </apex:pageBlockSectionItem>
                <apex:pageBlockSectionItem >
                    <apex:outputLabel value="Condition"/>
                    <apex:outputField value="{!prp.Terminal__r.condition__c}"/>
                </apex:pageBlockSectionItem>
                <apex:pageBlockSectionItem >
                    <apex:outputText value=" "/>
                    <apex:outputField value="{!prp.originLocation__r.zipPostal__c}"/>
                </apex:pageBlockSectionItem>
                <apex:pageBlockSectionItem >
                    <apex:outputLabel value="Serial number"/>
                    <apex:outputField value="{!prp.Terminal__r.serialNumber__c}"/>
                </apex:pageBlockSectionItem>
                <apex:pageBlockSectionItem >
                    <apex:outputText value=" "/>
                    <apex:outputText value=" "/>
                </apex:pageBlockSectionItem>
                <apex:pageBlockSectionItem >
                    <apex:outputLabel value="Terminal Id"/>
                    <apex:outputField value="{!prp.Terminal__r.terminalId__c}"/>
                </apex:pageBlockSectionItem>
            </apex:pageblockSection>
        </apex:pageBlock>
    </apex:form>
    
</apex:page>

 

ctrlr

public with sharing class terminalPrepOrderController {

    public string searchBarcode; //The barcode that has been scanned
	public terminalPrepOrder__c trmPrp {get;set;}

//Get the search barcode
    public String getSearchBarcode()
    {
      return searchBarcode;
    }

//Do what this does... I don't know what this is for, but I need it!
    public void setSearchBarcode(String newSB)
    {
       searchBarcode = newSB;
    }

	//page constructor
    public ApexPages.StandardController controller;
    public terminalPrepOrderController(ApexPages.StandardController controller) {

        this.controller = controller;
        terminalPrepOrder__c trmPrp = (terminalPrepOrder__c) controller.getRecord();	
    }

    //Find the barcoded Terminal based on the scan - call this via JS checkEnter(e) function
	public void findBcTrm() {  
        terminalPrepOrder__c trmPrp = (terminalPrepOrder__c) controller.getRecord();
        try {
            if (searchBarcode != '') {
	            terminal__c trm = [select Id, name from terminal__c T where T.barcodeNumber__c = :searchBarcode limit 1];
	            trmPrp.terminal__c = trm.id;
	            update trmPrp;

	            ApexPages.Message success = new ApexPages.Message(ApexPages.Severity.CONFIRM, 'Found barcode ' + searchBarcode + ' on ' + trm.name);
	            ApexPages.addMessage(success);
				//return null;
            }
            else if (searchBarcode == '' ) {
                ApexPages.Message invalidSearch = new ApexPages.Message(ApexPages.Severity.ERROR, 'Please scan a barcode.');
                ApexPages.addMessage(invalidSearch);
				//return null;
            }
        }
        catch (exception e) {
            ApexPages.Message noTrm = new ApexPages.Message(ApexPages.Severity.ERROR, searchBarcode + ' not found applied to a Terminal. Please apply the barcode to a Terminal, and try again.');
            ApexPages.addMessage(noTrm);
			//return null;
        }
        //return null;
    }
}

 

 

all the additional fields on terminalPb do not update (originLocation, housing id etc....)

 

Why's that?

 

 

 
saharisahari

Need urgent help with this.

 

Onchange event on inputtext does;nt seem to work.

 

<apex:inputtext id="apexText" value="{!apextext}" onchange="test()" / >

 

<apex:inputtext id="apexText" value="{!apextext}" onchange="test()" / >

 

where test() is a java script function.

 

Actually i am using javascript function to populate this field.

My requirement is, whenever this inputtext field value changes, the pageblock table shud be rerendered based on the populated value.

 

For this, i tried 

Action function , Action status also.

 

But nnothing works.

 

but for the same inputtext field , instead of populating it using javascript, i tried typing in and then this onchange event works.

 

I need to find a way to rerender the pageblock table when ever this inputtext field value changes.

 

Any help is greatly appreciated.

Here is the code

 

 

 

  $(document).ready(function() {

    

  $('#datepicker').datepicker({

   onSelect: function(dateText, inst) { 

var theDate = new Date(Date.parse($("#datepicker").datepicker('getDate')));

//theDate= theDate.format('yyyy-mm-dd');

   //$("#getSetSinglePicker").val(theDate);

   document.getElementById("{!$Component.apextext}").value=theDate;

   

 }

});

     });

 to populate the inputtext...which works fine.
<apex:inputtext id="apexText" value="{!apextext}" onchange="test()" / >
<apex:outputPanel id="panel">
    <apex:pageBlockTable id="table" value="{!EventList}" var="e" rendered="{!NOT(ISNULL(EventList))}" >
        <apex:column value="{!e.Subject}" headerValue="Subject"/>
        <apex:column value="{!e.ActivityDate}" headerValue="Activity Date"/>
    </apex:pageBlockTable>
    </apex:outputPanel>
 
table that needs to be rerendered
Please help!

<apex:inputtext id="apexText" value="{!apextext}" onchange="test()" / >
JNicJNic

Just a thought... can you make an actionFunction that has no action, just a rerender:

 

 

<apex:actionFunction name="myRerenderFunction" rerender="panel" />

 

<apex:inputtext id="apexText" value="{!apextext}" onchange="test(); myRerenderFunction()" / >
<apex:outputPanel id="panel">
    <apex:pageBlockTable id="table" value="{!EventList}" var="e" rendered="{!NOT(ISNULL(EventList))}" >
        <apex:column value="{!e.Subject}" headerValue="Subject"/>
        <apex:column value="{!e.ActivityDate}" headerValue="Activity Date"/>
    </apex:pageBlockTable>
    </apex:outputPanel>
 
table that needs to be rerendered
Please help!

<apex:inputtext id="apexText" value="{!apextext}" onchange="test()" / >   <-- Redundant?

 

 

 

You can also try rerendering the table itself too... I find I have to play around with what I actually rerender alot of the time...
JNicJNic

You know what..  just noticed that the field is being populated by JS.

 

AFAIK, the onChange will NOT work if the CHANGE is performed by JS...

 

You may have to call the "myRerenderFunction" from the same JS script that is updating the field... that's the problem!
saharisahari

Thanks a lot for the reply!!

Yeah just got it solved using apexfunction

and yes, the main problem was the onchange event was not working on the input text field...

 

Came across lot of issues and finally got it!!!
PrajnaPrajna

All,

 

Controller method does not get invoked....Can you help me with this??

 

VF page

 function populateList(){
    
        refreshSelectedCountries();
    
    
    }
   

 

<apex:pageBlockSectionItem dataStyleClass="dependentFieldBlockCountry" id="p2">

                                <apex:outputLabel value="{!$ObjectType.Contact.fields.Countries_Discussed__c.Label}" for=""/>

                                <apex:outputPanel >

                                <apex:inputHidden id="textv1" value="{!selectedvalues1}"/>

                                 <apex:actionFunction name="refreshSelectedCountries" action="{!refreshSelectedCountries}" reRender="selectedCountries"/>

                                  <apex:actionRegion >

                                

                                 <!-- Modified for Request 3204 -->

                                  <apex:selectList id="countriesDiscussed" multiselect="true" size="7" styleClass="dependentOptionsCountry" value="{!movedCountries}" >

                                        <apex:selectOptions value="{!countrySelectOptions}">

                                            

                                          </apex:selectOptions>

                                        

                                    </apex:selectList>

                                 <!-- Modified for Request 3204 -- End -->  

                                  <apex:outputPanel style="display: inline-block; vertical-align: top;">

                                        <a href="#" class="moveRightButton" onclick="return populateList()">Move right</a>

                                        <br/>

                                        <br/>

                                        <a href="#" class="moveLeftButton">Move left</a>

                                  </apex:outputPanel>

                                     

                                       

                                

                                  <apex:outputPanel id="selectedCountries">

                                           

                                            

                                            <select multiple="multiple"  size="7" class="dependentSelectedCountry" id="para3" >

                                            <apex:repeat value="{!selectedCountryOptions}"  var="opt1" id="para1">

                                                <option value="{!opt1.value}" id="para2"> {!opt1.value} </option>

                                              

                                            </apex:repeat>

                                            </select>

                                        </apex:outputPanel>

                                  </apex:actionRegion>                                                     

                                                              </apex:outputPanel>

                        </apex:pageBlockSectionItem> 

 

 

 

Controller Method

 

public PageReference refreshSelectedCountries(){

            populateCountry();

            return null;

    }