Paradox
2 سال پیش توسط Paradox مطرح شد
3 پاسخ

انتخاب همه موارد در سلکت باکس

سلام
چطوری میتونم تو یک سلکت باکس هم کاربر بتونه یک مورد انتخاب کنه هم اگه گزینه انتخاب همه رو زد همه براش انتخاب بشه ؟
برای name سلکت باکس از [] استفاده کردم
فقط دارم اطلاعات از طریق ajax از دیتابیس میگیرم وقتی یکی انتخاب میکنم تو جدول ایدی رو ذخیره میکنه
وای برای انتخاب همه مشکل دارم چیکار باید کرد ؟


ثبت پرسش جدید
Banana Life
@shift.delete 2 سال پیش مطرح شد
0

سلام
دوست عزیز یک نمونه کد واستون نوشتم و شما میتونید به صورت کل یا تک تک سلکت کنید و مقدار ارایه ای انتخاب شده را در 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>

Paradox
تخصص : در حال یادگیری
@paradox 2 سال پیش آپدیت شد
0

@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);

Banana Life
@shift.delete 2 سال پیش مطرح شد
0

شما میتونید select جایگزین دکمه کنید و از حالت click به change تغییر پیدا میکنه

  • در قسمت انتخاب منطقه قبل از post کردن شما باید مقدار را یکی یکی بگیرید و داخل ارایه بریزید و ارایه را به string تبدیل کنید و در اخر به اینصورت 'منطقه 1,منطقه 2,منطقه 3' میفرستید.

برای ارسال پاسخ لازم است وارد شده یا ثبت‌نام کنید

ورود یا ثبت‌نام