CodeIgniter, Jquery — добавить выпадающее меню в форму

Привет, я хотел бы помочь, пожалуйста. Я создал форму в CodeIgniter, в которой я хочу сохранить название фильма и актеров, которые играют в нем. Мой код выглядит следующим образом:

<?php echo form_open().PHP_EOL; ?>

<div class="form-group">
<label for="title">Title *</label>
<?php echo form_input('title', set_value('title', html_escape($movie->title)), 'class="form-control"'); ?>
<?php echo form_error('title'); ?>
</div>

<h4>Cast</h4>
<button type="button" id="add_actor" class="btn btn-primary btn-sm">Add Actor</button>
<hr>
<ul class="list-unstyled" id="cast"></ul>

<div class="form-group">
<?php echo form_submit('save', 'Save', 'class="btn btn-primary"').PHP_EOL; ?>
</div>

<?php echo form_close().PHP_EOL; ?>

<script>
$(document).ready(function() {
var output = '<li style="margin-bottom:5px;">\
<div class="row">\
<div class="col-md-6">\
<?php echo form_dropdown("actors", $actors, null, "class=\"form-control\""); ?>\
</div>\
<div class="col-md-6">\
<input type="text" name="character[]" class="form-control"\ placeholder="Character" />\
</div>\
</div>\
</li>';

$('#add_actor').click(function() {
$('#cast').append(output);
});
});

На firebug я получаю это как вывод:

<script>
$(document).ready(function() {
var output = '<li style="margin-bottom:5px;">;\
<div class="row">;\
<div class="col-md-6">;\
<select name="actors" class="form-control">
<option value="5">Keira Knightley</option>
<option value="7">Matthew Goode</option>
<option value="6">Benedict Cumberbatch</option>
<option value="2">Christian Bale</option>
<option value="10">Jude Law</option>
<option value="4">Daniel Craig</option>
<option value="3">Brad Pitt</option>
<option value="1">Johnny Depp</option>
<option value="9">Sean Bean</option>
<option value="8">Pierce Brosnan</option>
<option value="11">Ed Harris</option>
<option value="12">Judi Dench</option>
</select>\
</div>\
<div class="col-md-6">\
<input type="text" name="character[]" class="form-control"\ placeholder="Character" />\
</div>\
</div>\
</li>';

$('#add_actor').click(function() {
$('#cast').append(output);
});
});
</script>

Я, вероятно, предполагаю, что ошибка вызвана тем, что form_dropdown () не имеет \ в конце строки.

Итак, что я пытаюсь сделать в основном, когда я нажимаю кнопку «Добавить актера», jquery добавит в мою форму строку, в которой должно быть выпадающее меню для выбора актера, а рядом с этим выпадающим полем ввода для ввода персонаж актера в фильме. Когда я снова нажимаю кнопку «Добавить актера», я снова выполняю тот же процесс, чтобы ввести следующего актера в фильм и т. Д. И т. Д.

Однако код в теге script не работает так, как я ожидал. На самом деле jquery жалуется на синтаксическую ошибку. Я проверяю свой код и пробую некоторые изменения, но безрезультатно.

Как я могу сделать эту работу правильно?

1

Решение

Вы должны увидеть ошибку вроде Uncaught SyntaxError: Unexpected token ILLEGAL в вашей консоли, поскольку вы плохо отформатировали строковый литерал.

добавлять \ в конце каждой строки для output

var output = '<li style="margin-bottom:5px;">\
<div class="row">\
<div class="col-md-6">\
<?php echo form_dropdown("actors", $actors); ?>\
</div>\
<div class="col-md-6">\
<input type="text" name="character[]" class="form-control"\ placeholder="Character" />\
</div>\
</div>\
</li>';

Вы не можете начать новую строку с середины строкового литерала, не сказав компилятору, что строка продолжается в следующей строке, поэтому в вашем случае вы можете использовать \ оператор, как указано выше, чтобы указать, что.

Демо-версия: скрипка

0

Другие решения

Других решений пока нет …

По вопросам рекламы [email protected]