انتخاب همه موارد در سلکت باکس
سلام
چطوری میتونم تو یک سلکت باکس هم کاربر بتونه یک مورد انتخاب کنه هم اگه گزینه انتخاب همه رو زد همه براش انتخاب بشه ؟
برای name سلکت باکس از [] استفاده کردم
فقط دارم اطلاعات از طریق ajax از دیتابیس میگیرم وقتی یکی انتخاب میکنم تو جدول ایدی رو ذخیره میکنه
وای برای انتخاب همه مشکل دارم چیکار باید کرد ؟
ثبت پرسش جدید
پاسخ‌ها
3
سلام
دوست عزیز یک نمونه کد واستون نوشتم و شما میتونید به صورت کل یا تک تک سلکت کنید و مقدار ارایه ای انتخاب شده را در ajax استفاده کنید.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Multiple Select</title>
<style>
body {
padding: 0;
margin: 0;
box-sizing: border-box;
}
.content {
display: flex;
height: 100vh;
max-height: 100%;
justify-content: center;
align-items: center;
}
.card {
height: 500px;
width: 750px;
border-radius: 12px;
border: 1px solid rgb(177, 177, 177);
box-shadow: 2px 2px 4px #0000;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
</style>
</head>
<body>
<div class="content">
<div class="card">
<div>
<h3>List Names</h3>
<ul id="item-list"></ul>
</div>
<div class="card-body">
<label for="name">Choose your Name:</label>
<select name="name" id="name">
<option value="">Select</option>
<option value="Mina">Mina</option>
<option value="Hasan">Hasan</option>
<option value="Javid">Javid</option>
<option value="Zahra">Zahra</option>
</select>
<button id="btn">Select All</button>
</div>
</div>
</div>
<script type="text/javascript">
const select = document.getElementById("name");
const button = document.getElementById("btn");
const list = document.getElementById("item-list");
let selected = [];
select.addEventListener('change', () => {
if (select.value == "") {
selected = [];
list.innerHTML = "";
}
if (select.value !== "" && !selected.includes(select.value)) {
selected.push(select.value);
const li = document.createElement('li');
selected.forEach((item) => {
li.innerHTML = item
});
list.appendChild(li);
}
})
button.addEventListener('click', () => {
selected = [];
const selectElement = document.querySelectorAll('[name=name]');
const optionValues = [...selectElement[0].options]
.filter(x => x.value !== "")
.map((opt) => {
selected.push(opt.value);
});
list.innerHTML = "";
selected.forEach((item) => {
const li = document.createElement('li');
li.innerHTML = item
list.appendChild(li);
});
console.log(selected)
})
</script>
</body>
</html>
@shift.delete
ممنونم ازتون ، من نمیخام به شکل دکمه برای انتخاب همه باشه
تو خود select میخام گزینه انتخاب همه باشه
]
و تو کنترلر به شکل زیر نوشتم که به صورت تکی ذخیره میشه ولی انتخاب کل نتونستم
$validated = $request->validate([
'province' => 'required',
'city' => 'required',
'region' => 'required',
]);
$region = Region::findOrFail($request->region);
User::find(auth()->user()->id)->regions()->attach($region);گفتگوهای مرتبط
شاید پاسخ شما همین‌جا باشد
شما میتونید select جایگزین دکمه کنید و از حالت click به change تغییر پیدا میکنه
- در قسمت انتخاب منطقه قبل از post کردن شما باید مقدار را یکی یکی بگیرید و داخل ارایه بریزید و ارایه را به string تبدیل کنید و در اخر به اینصورت 'منطقه 1,منطقه 2,منطقه 3' میفرستید.