Come riferimento html elemento id specificato nella Visualforce e passare sulla funzione javascript?
-
10-10-2019 - |
Domanda
Ho apice tag che generano campo di testo.
<apex:page id="my_page">
<apex:inputText id="foo" id="c_txt"></apex:inputText>
</apex:page>
Quando un utente fa clic questo campo, voglio eseguire JavaScript.
Ma quando controllo il sorgente HTML, il tag vertice che diventa tag input ha (credo) parte generata in modo dinamico.
<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">
Come si può vedere ID è parte spazzatura: (
id="j_id0:j_id3:j_id4:c_txt"
Nel mio JavaScript Sto cercando di getElementById('c_txt')
ma questo non funziona, ovviamente. Come affrontare questo ???
Aggiorna
Sembra che posso fare questo, ma non funziona ...
<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);
Gli spettacoli alert 'nullo' quindi qualcosa deve essere sbagliato.
Anche questo avviso restituisce null ...
var targetDateField = document.getElementById('{!$Component.my_page:c_txt}');
alert(targetDateField);
Soluzione 2
Ho avuto soluzione al mio problema.
$ compoent espressione globale Visualforce può essere utilizzato solo nel codice Visualforce non all'interno di Javascript per quanto riguarda la mia ricerca.
Di seguito il codice funziona benissimo. E 'in uscita il valore nel campo inputText per js messaggio di avviso Ora si può passare attributo id al Javascript e il processo qualunque sia il compito necessario.
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>
Altri suggerimenti
È possibile utilizzare la notazione $Component
in javascript, lo si utilizza in questo modo:
var e = document.getElementById("{!$Component.ComponentId}");
Una cosa da diffidare di però, è che se il vostro elemento è contenuto all'interno di vari livelli di tag Visualforce che hanno ID:
<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}");