Primeiramente é bom estar escrevendo novamente hehehe. Faz tempo que queria postar algo mas sempre (por algum inconveniente ou destino) ficava sem tempo. Bom vamos lá ...
Antes de tudo tu já deves ou pelo menos tem uma noção de para que utilizamos ferramentas como Freemarker ou mesmo o Velocity? Não?? ... Eu gosto de falar deles com geradores de código HTML em tempo de execução, isto é, essas ferramentas me possibilitam criar componentes em código HTML a partir de um modelo pré-definido. Conseguiu entender agora? Se a reposta ainda é não fique tranquilo, isso é mais fácil do que parece.
Bom, nada melhor do que um exemplo não é? Então supondo que o modelo gere um código HTML onde eu tenho um Label (contendo a tescrição do item) e um Input (que receberá valores passados pelo usuário), algo mais ou menos assim:
O código Java por sua vez irá passar alguns váriáveis para o modelo. Neste exmplo vou usar o Velocity, segue:
E por sua vez temos o código do arquivo myTemplate.vm:
Espero que você que estava meio em dúvida se tinha entendido ou não tenha compreendido como isso funciona. Senão não adianta continuar hahaha ... brincadeira.
Exemplinho até agora foi bonito mas não falamos nada de jQuery, bom se você prestou atenção viu que meu código Java está passando um parâmetro que não está sendo utilizado no Velocity. Consegue descobrir? ... hehehe ... se olhar bem verá que tem o parâmtro isEditable não é usado de modo algum no myTemplate.vm. Mas então para que serve? Bom se você lembra o assunto do tópico verá que queremos usar jQuery no nosso Velocity, para isso vamos usar o parâmetro isEditable para gerar um código JavaScript e modificar o nosso Input, tudo isso usando uma linha do jQuery :D ... segue o novo myTemplate.vm:
Repare que em vez de eu usar o seletor do jQuery como uma só string acabei separando em duas: "#" e "${id}_input_". Isso porque se o # ficar ao lado do $ a API não irá gerar corretamente a tag, causando um transtorno e que sem dúvida o fará perder muito tempo.
Note que # e $ são palavras a ferramenta também utiliza internamente. Por isso alguns sites aconselham que em vez de usar: $(seletor), utilizar a forma extença jQuery(seletor).
Antes de tudo tu já deves ou pelo menos tem uma noção de para que utilizamos ferramentas como Freemarker ou mesmo o Velocity? Não?? ... Eu gosto de falar deles com geradores de código HTML em tempo de execução, isto é, essas ferramentas me possibilitam criar componentes em código HTML a partir de um modelo pré-definido. Conseguiu entender agora? Se a reposta ainda é não fique tranquilo, isso é mais fácil do que parece.
Bom, nada melhor do que um exemplo não é? Então supondo que o modelo gere um código HTML onde eu tenho um Label (contendo a tescrição do item) e um Input (que receberá valores passados pelo usuário), algo mais ou menos assim:
O código Java por sua vez irá passar alguns váriáveis para o modelo. Neste exmplo vou usar o Velocity, segue:
VelocityContext context = new VelocityContext();
context.put("id", "my_velocity_id"); //id padrão
context.put("isEditable", true); //se o Input pode ser editado
context.put("text", "Descrição do Item"); //adicionado a Label
context.put("value", "Valor do Item"); //adicionado ao Input
StringWriter w = new StringWriter();
Velocity.mergeTemplate("myTemplate.vm", "UTF-8", context, w);
E por sua vez temos o código do arquivo myTemplate.vm:
<center>
<div style="border:1px solid black; padding: 2px 2px 2px 2px">
<label id="${id}_label_">${text}</label> <input id="${id}_input_" value="${value}" />
</div>
</center>
Espero que você que estava meio em dúvida se tinha entendido ou não tenha compreendido como isso funciona. Senão não adianta continuar hahaha ... brincadeira.
Exemplinho até agora foi bonito mas não falamos nada de jQuery, bom se você prestou atenção viu que meu código Java está passando um parâmetro que não está sendo utilizado no Velocity. Consegue descobrir? ... hehehe ... se olhar bem verá que tem o parâmtro isEditable não é usado de modo algum no myTemplate.vm. Mas então para que serve? Bom se você lembra o assunto do tópico verá que queremos usar jQuery no nosso Velocity, para isso vamos usar o parâmetro isEditable para gerar um código JavaScript e modificar o nosso Input, tudo isso usando uma linha do jQuery :D ... segue o novo myTemplate.vm:
<center>
<div style="border:1px solid black; padding: 2px 2px 2px 2px">
<label id="${id}_label_">${text}</label> <input id="${id}_input_" value="${value}" />
</div>
</center>
## Se isEditable for false
#if (!${isEditable})
<script type="text/javascript">
## modo normal de utilizar no Velocity -- funciona!
$("#"+"${id}_input_").attr("readonly","readonly");
</script>
#end
Repare que em vez de eu usar o seletor do jQuery como uma só string acabei separando em duas: "#" e "${id}_input_". Isso porque se o # ficar ao lado do $ a API não irá gerar corretamente a tag, causando um transtorno e que sem dúvida o fará perder muito tempo.
Note que # e $ são palavras a ferramenta também utiliza internamente. Por isso alguns sites aconselham que em vez de usar: $(seletor), utilizar a forma extença jQuery(seletor).
