Как динамически добавлять поля ввода Primefaces с помощью JQuery
Я пытаюсь динамически добавлять метки и текстовые поля из Primefaces на мою веб-страницу. Я хочу использовать JQuery. До сих пор я понимаю ту же задачу только с Primefaces, и она работает довольно хорошо, но у меня есть некоторые особенности поведения, которых я хочу избежать.
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui">
<h:head>
<script type="text/javascript">
$(document).ready(function() {
var counter = 2;
$("#addButton").click(function(){
var newTextBoxDiv = $(document.createElement('div')).attr("id",'TextBoxDiv' + counter);
<!--
This line causes trouble. If I use it nothing is rendered on page.
If I use <h:inputText /> the page is rendered but the functionality does
not work
-->
newTextBoxDiv.html("<p:inputText />");
newTextBoxDiv.appendTo("#TextBoxesGroup");
counter++;
});
});
</script>
</h:head>
<h:body>
<ui:insert>
<ui:include src="/protected/header.xhtml" />
</ui:insert>
<h:form>
<div id="test"></div>
<div id='TextBoxesGroup'></div>
<input type='button' value='Add Button' id='addButton' />
<input type='button' value='Remove Button' id='removeButton' />
</h:form>
</h:body>
</html>
Я был бы признателен за некоторые подсказки к учебникам по этой теме или по простой ошибке в моем коде. решение для этой проблемы. Заранее спасибо :)