Görselformada belirtilen html öğesi kimliğine nasıl başvurulur ve javascript işlevine nasıl yönlendirilir?

Question

Giriş metni alanı oluşturan apex etiketim var.

<apex:page id="my_page"> 
    <apex:inputText id="foo" id="c_txt"></apex:inputText> 
</apex:page> 

Birisi bu alanı tıklattığında, javascript'i çalıştırmak istiyorum.

Ancak HTML kaynağını kontrol ettiğimde, giriş etiketi olan bu apex etiketi (sanırım) dinamik olarak oluşturulmuş bir parçaya sahiptir. Eğer id görebileceğiniz gibi

<input type="text" size="50" value="Tue Nov 16 00:00:00 GMT 2010" 
name="j_id0:j_id3:j_id4:c_txt" id="j_id0:j_id3:j_id4:c_txt"> 

benim JavaScript ben getElementById('c_txt') çalışıyorum ise önemsiz kısmı :(

id="j_id0:j_id3:j_id4:c_txt" 

var ama bu tabii ki çalışmaz. başa nasıl bu

???

GÜNCELLEME

bunu yapabilirim gibi görünüyor ama çalışmıyor ...

<apex:includeScript value="{!URLFOR($Resource.datepickerjs)}"></apex:includeScript> 

<apex:inputText id="foo" id="c_txt" onclick="javascript:displayDatePicker()" /> 

datepickerjs

var elem = getElementById('c_txt'); 
alert(elem); 

uyarı gösteriyor 'boş' öylesine bir şey yanlış olmalı. Hatta bu uyarı null döndürür

...

var targetDateField = document.getElementById('{!$Component.my_page:c_txt}'); 
alert(targetDateField); 

Answer 1

benim sorununa çözüm var.

$ Compoent global visualforce ifadesi, yalnızca benim arama yaptığım kadarıyla Javascript'in içinde olmayan görsel kodda kullanılabilir.

Aşağıdaki kodlar düzgün çalışıyor. InputText alanındaki değeri js uyarı mesajına gönderir. Artık id özniteliğini Javascript'e aktarabilir ve gerekli olan her şeyi işleyebilirsiniz.

Created Date: <apex:inputText id="dah" value="{!created}" size="50" 
onclick="javascript:go('{!$Component.dah}')"></apex:inputText> 

<script> 
    function go(field) { 
    var huh = document.getElementById(field).value; 
    alert(huh); //returns the string u put inside of input text field 
    } 
</script> 

Answer 2

Sen javascript $Component notasyonu kullanabilirsiniz, bunu gibi kullanabilirsiniz:

var e = document.getElementById("{!$Component.ComponentId}"); 

Bir şey olsa dikkatli olmak, sizin eleman Visualforce etiketlerin çeşitli düzeylerde içinde bulunur ise hangi sahip kimlikleri:

<apex:pageBlock id="theBlock"> 
    <apex:pageBlockSection id="theBlockSection"> 
     <apex:commandLink action="{!someAction}" value="LINK!" id="theLink"/> 

// snip 

// in javascript you would reference this component using: 
document.getElementById("{!$Component.theBlock.theSection.theLink}");