jQuery: Лучшая практика для заполнения выпадающий?
First change to $value
<div class="form-group">
<label>Category</label>
<select class="form-control bg-dark btn-dark text-white" id="drpcategory" name="drpcategory" required>
<?php
$category = ''.$dir.'/template/post/category.txt';
$category2 = file($category, FILE_IGNORE_NEW_LINES);
foreach($category2 as $value)
{
echo "<option value='".$value."'>".$value."</option>";
}
?>
</select>
затем добавьте URL
<script>
$(function()
{
$('#form').submit(function(e)
{
e.preventDefault();
$.ajax({
url:'folder/filename.php',
type: 'post',
data: '{ID:" . $Row[0] . "}',
success: function(result) {
console.log(result);
}
});
});
$('#drpcategory').on('change',function()
{
$("#form").submit();
});
});
запрос на попытку
if(isset([110]
затем добавьте URL
[111]
запрос на попытку
[112] Результат будет / должен быть отправлен обратно та же страница
REQUEST['ID']))
Результат будет / должен быть отправлен обратно та же страница
5 ответов
Андреас Греч был довольно близко ... это на самом деле это (обратите внимание на ссылку на на это вместо элемента в цикле):
var $dropdown = $("#dropdown");
$.each(result, function() {
$dropdown.append($("<option />").val(this.ImageFolderID).text(this.Name));
});
Я использую плагин jquery selectboxes . Он превращает ваш пример в:
$('#idofselect').ajaxAddOption('/Admin/GetFolderList/', {}, false);
Конечно - сделать options массивом строк и использовать .join ('') вместо + = каждый раз через цикл. Небольшое снижение производительности при работе с большим количеством опций ...
var options = [];
$.getJSON("/Admin/GetFolderList/", function(result) {
for (var i = 0; i < result.length; i++) {
options.push('<option value="',
result[i].ImageFolderID, '">',
result[i].Name, '</option>');
}
$("#theSelect").html(options.join(''));
});
Да. Я все еще работаю со строками все время. Верьте или нет, это самый быстрый способ создания фрагмента DOM ... Теперь, если у вас есть только несколько вариантов, он выиграет Это действительно важно - используйте технику Дриас демонстрирует , если вам нравится стиль. Но имейте в виду, что вы вызываете внутренний анализатор HTML браузера i * 2 раз, а не один раз, и модифицируете DOM каждый раз в цикле ... с достаточным количеством опций. в конечном итоге вы заплатите за это, особенно в старых браузерах.
Примечание: Как отмечает Джастис, это развалится, если ImageFolderID и Name не закодировано правильно ...
$.getJSON("/Admin/GetFolderList/", function(result) {
var options = $("#options");
//don't forget error handling!
$.each(result, function(item) {
options.append($("<option />").val(item.ImageFolderID).text(item.Name));
});
});
То, что я делаю выше, - это создание новой <опция> и добавление его в список options (при условии, что options - это идентификатор выпадающего элемента.
PS Мой javascript немного ржавый, поэтому синтаксис может быть не идеальным
Самый быстрый способ - это:
$.getJSON("/Admin/GetFolderList/", function(result) {
var optionsValues = '<select>';
$.each(result, function(item) {
optionsValues += '<option value="' + item.ImageFolderID + '">' + item.Name + '</option>';
});
optionsValues += '</select>';
var options = $('#options');
options.replaceWith(optionsValues);
});
Согласно эта ссылка - самый быстрый способ, потому что вы оборачиваете все в один элемент при любой вставке DOM.