Cakephp: динамически изменять форму с помощью JQuery

Question

Я пытаюсь динамически добавлять элементы в форму Cakephp:

<?php echo $javascript->link('jquery',false); ?>
<script language="javascript" type="text/javascript">
 function addFormField() {
 var id = parseInt(document.getElementById("id").value);
 $('.divTxt').append("<p id='row" + id + "'><label for='txt" + id + "'>Field " + id + " <input type='text' size='20' name='txt[]' id='txt" + id + "'> <a href='#' onClick='removeFormField(\"#row" + id + "\"); return false;'>Remove</a><p>");
 document.getElementById("id").value = id+1;
 }
</script>

<?php echo $this->Form->create('Booking');  ?>
<input type="hidden" id="id" value="1">
<div id="divTxt"></div>
<?php echo $this->Form->end('Save Post'); ?>
<p><a href="#" onClick="addFormField(); return false;">Add</a></p>

Я думаю, что мой вызов $ ('. DivTxt') неверен из-за особенностей создания форм CakePHP. Кто-нибудь может указать, как это можно сделать правильно?

Answer 1

Вы должны обернуть свой код в

$('document').ready(function(){
    // Put your ``var id = `` code in here.
});

Что происходит, так это то, что код выше var id = ... работает во время загрузки страницы до того, как форма будет выведена. Если вы включите буферизацию вывода в PHP, это поможет, но это не надежное решение для этого. Функция готовности (см. Выше):

И вам нужно получить доступ к div с помощью #the_id, а не .the_id. Это для занятий.

Answer 2

Быстрый ответ на ваш вопрос: вы должны назвать его как $("#divTxt"), а не $(".divTxt"), что означает class=divTxt, и вы хотите id=divTxt

Старайтесь не смешивать jQuery с необработанным dhtml.Вы можете получить доступ к элементам формы в jQuery с помощью $("#id").val() и установить его с помощью $("#id").val(newValue)