我正在使用自動完成進(jìn)行輸入，我的用戶可以從數(shù)據(jù)庫中選擇多個用戶，并且我想在我的表單中提交這些選擇的用戶，其中操作轉(zhuǎn)到在數(shù)據(jù)庫中執(zhí)行 INSERT 的 php 文件。所以這是輸入，我希望選定的用戶出現(xiàn)在p#selecionados但用戶一次選擇一個：<form id="formCriaJogo" method="post" action="./components/insert.php"> <label>Other users</label> <input type="text" name="autor" id="autor" placeholder="Write users name" /> <div id="autorLista"></div> <p id="selecionados"></p> <button type="submit">Insert</button></form>這是執(zhí)行自動完成的 jquery 代碼：$(document).ready(function() { $('#autor').keyup(function() { var query = $(this).val();; if (query != '') { $.ajax({ url: "./components/search.php", method: "POST", data: { query: query }, success: function(data) { $("input#autor").css("margin-bottom", '0'); $("#autorLista").css("display", 'block'); $('#autorLista').fadeIn(); $('#autorLista').html(data); }, error: function(error) { console.log(error); } }); } }); $('input#autor').on('change', function() { alert($('input[name=autor]:checked', '#formCriaJogo').val()); }); });此外，這里是search.php進(jìn)行搜索：<?phpinclude_once "../connection/connection.php";if (isset($_POST['query'])) { $link = new_db_connection(); $stmt = mysqli_stmt_init($link); $output = ''; $input = $_POST['query'];現(xiàn)在單擊的輸入 type=radio 值包含用戶的 id 和名稱我希望p#selecionados中的用戶名只是為了向他們展示他選擇的內(nèi)容，并在提交我的表單時發(fā)送選擇的用戶的 id 和名稱。
1 回答
慕碼人8056858
TA貢獻(xiàn)1803條經(jīng)驗 獲得超6個贊
您可以在 jquery 中創(chuàng)建一個array，因此，每當(dāng)您從自動完成框中選擇一個選項時..將該值放在 jquery 中的該數(shù)組中。我使用checkbox而不是radio-button在下面的代碼中，并且每當(dāng)用戶選擇將數(shù)據(jù)插入數(shù)組的任何選項時，即：index并且當(dāng)insert單擊按鈕時，所選數(shù)據(jù)將顯示在p#selecionados標(biāo)簽中，并且 ajax 將調(diào)用以將您選擇的數(shù)據(jù)發(fā)送到 php 頁面。我還添加了value='" . $id_user."," . $name_user . "'您可以使用.split()分隔符將其拆分,以獲取兩者userid和username. 示例代碼：
var index = [];
//when check-box is changed
$('input[name=autor]').change(function() {
//checking if checkbox is check put it in array
if ($(this).is(':checked')) {
index.push($(this).val());
console.log(index)
} else {
//if uncheck remove the element from array
if ((index1 = index.indexOf($(this).val()) !== -1)) {
index.splice($.inArray(index1, index), 1);
console.log("remove");
}
}
});
//when insert button is click
$("button").click(function() {
//clear the p tag content
$("p#selecionados").html("");
for (var i = 0; i < index.length; i++) {
//append all selected check box
$("p#selecionados").append(index[i] + "<br />");
console.log("userid & username" + index[i]);
}
if (index != '') {
$.ajax({
url: "yourphp_page_name",
method: "POST",
data: {
//sending array to php
data: index
},
success: function(data) {
//do something
},
error: function(error) {
//do something
}
});
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<input type='checkbox' value='" . $id_user."," . $name_user . "' name='autor'>" . $name_user . <br/>
<input type='checkbox' value='" . $id_user."," . $name_user . "' name='autor'>" . $name_user . <br/>
<button type="submit">Insert</button> <br/><br/> Selected data :
<p id="selecionados"></p>
然后在您的 php 方面，您需要得到它，array即：data使用$_POST['data']然后分解您的數(shù)組并根據(jù)您的要求使用它。
- 1 回答
- 0 關(guān)注
- 161 瀏覽
添加回答
舉報
0/150
提交
取消