Take the 2-minute tour ×
Salesforce Stack Exchange is a question and answer site for Salesforce administrators, implementation experts, developers and anybody in-between. It's 100% free, no registration required.

I have a input field with date

 date = 1/16/2013 (in the form of inputtext)

whenever I change this input text their is an another output text where this value should reflect

date1 = 1/16/2013 (in the form of outputtext)

so whenever date is changed date1 should be rendered accordingly.

how can I get it with javascript.

<script>
 function invoicedate(){
     var transaction = jQuery.trim(jQuery(".transaction").val());
    // alert(transaction);
 }
</script>
<apex:page>
 <apex:pageblocksection>
    date
      <apex:inputText value="{!ChargeDate}" styleclass="transaction" onblur="invoicedate"/>
    date1
      <apex:outputlabel value="{!chargedate}" styleclass="transaction" />
  </apex:pageblocksection>
</apex:page>
share|improve this question
    
What have you tried so far? –  Lex Jan 16 '13 at 10:14
    
included the code. –  Eagerin Sf Jan 16 '13 at 10:24
    
If you use unique id's instead of classes you should get it to work. –  Lex Jan 16 '13 at 10:26
add comment

2 Answers

up vote 0 down vote accepted

Give both of the elements a unique id instead of a class. Then use the ids to get the value from one field and put it in the other:

<script>
 function invoicedate(){
     //note the special jQuery identifier to get the visualforce-generated id
     var transaction = jQuery.trim(jQuery("[id$=transaction_input]").val());
     jQuery("[id$=transaction_output]").val(transaction);
    // alert(transaction);
 }
</script>
<apex:page>
 <apex:pageblocksection>
    date
      <apex:inputText value="{!ChargeDate}" id="transaction_input" onblur="invoicedate"/>
    date1
      <apex:outputlabel value="{!chargedate}" id="transaction_output" />
  </apex:pageblocksection>
</apex:page>
share|improve this answer
    
no change Lex. only the first value is displayed after that it is not changing –  Eagerin Sf Jan 16 '13 at 10:54
    
And if you alert the value of transaction? –  Lex Jan 16 '13 at 11:05
1  
Try using jQuery("[id$=transaction_output]").html(transaction); instead of jQuery("[id$=transaction_output]").val(transaction); –  Lex Jan 16 '13 at 11:16
    
instead of displaying date1 as outputlabel I need to display it in inputtext. then how should I declare in js? –  Eagerin Sf Jan 16 '13 at 13:45
    
I'm not sure I understand correctly; for inputTexts you use .val() and for outputLabel you use .html() –  Lex Jan 16 '13 at 13:57
add comment
<apex:page standardController="Account">
<apex:form >
    <apex:pageBlock title="My Content" mode="edit">
        <apex:pageBlockButtons >
            <apex:commandButton action="{!save}" value="Save"/>
        </apex:pageBlockButtons>
        <apex:pageBlockSection title="My Content Section" columns="2">
            <apex:inputField value="{!account.name}" />
            <apex:inputText value="{!account.site}"/>
            <apex:inputField id="text1"  onchange="writehello();" value="{!account.SLAExpirationDate__c}" />
            <apex:outputText label="Form" id="hello2"/>
            <script>
            function writehello() {
             // alert('Component id = "{!$Component.text1}"');
              var a= document.getElementById("{!$Component.text1}").value;
              //alert('Value'+a);
              document.getElementById("{!$Component.hello2}").innerHTML = a;    
            }
           </script>


        </apex:pageBlockSection>
    </apex:pageBlock>
</apex:form>

just tried and the above code works fine for me .I created a date field and my simple hello script works perfectly

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.