سلام خسته نباشید
من یه فرمی دارم که چند لیست بازشونده داره.
کد فرم
<form
onSubmit={clickSubmit}
className="mb-3"
>
<div className="form-group">
<p className="text-center f6">A</p>
<input
onChange={handleChange("A")}
type="text"
className="form-control badge-pill mt-5"
value={A}
placeholder="A"
/>
<div className="container mt-1">
<div className="row">
<select
onChange={handleChange("b")}
className="form-control col-sm-6 mt-1 badge-pill"
>
<option>B</option>
{bs &&
bs.map((b, i) => (
<option key={i} value={b._id}>
{b.name}
</option>
))}
</select>
<select
onChange={handleChange("c")}
className="form-control col-sm-6 mt-1 badge-pill"
>
<option>C</option>
{cs &&
cs.map((c, i) => (
<option key={i} value={c._id}>
{c.name}
</option>
))}
</select>
<div className="container mt-1">
<div className="row">
<select
onChange={handleChange("d")}
className="form-control col-sm-6 mt-1 badge-pill"
>
<option>D</option>
{ds &&
ds.map((d, i) => (
<option key={i} value={d._id}>
{d.title}
</option>
))}
</select>
<input
onChange={handleChange("e")}
type="number"
className="form-control col-sm-6 mt-1 badge-pill"
placeholder="E"
value={e}
/>
<div className="container mt-3">
<div className="row">
<textarea
onChange={handleChange("f")}
type="text"
rows="10"
className="form-control"
placeholder="F"
value={f}
/>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div className="action_btn offset-lg-3">
<button className="btn btn-success mt-3">button</button>
</div>
</form>
اول اینکه میخوام یه ویژگی به یکی از این لیست ها اضافه کنم که قابلیت انتخاب چند آیتم بصورت همزمان داشته باشه
مثه این تصویر
دوم اینکه میخوام محتویات لیست ها به ترتیب حروف الفبا چیده بشه الان محتویات بصورت ترتیبی که تو دیتابیس هست نمایش میده
ممنون میشم اگه بتونید کمکم کنید
درود خوبی...
از کتابخانه select2 استفاده کنید.
پیوند زیر:
https://select2.org/getting-started/basic-usage
آیا مایل به ارسال نوتیفیکیشن و اخبار از طرف راکت هستید ؟