Select Option Bug Fixed

This commit is contained in:
2023-11-28 07:41:31 -08:00
parent eacfae19f0
commit 492bda021f
+34 -29
View File
@@ -167,7 +167,7 @@ function AddJob({ popUpHandler, categories }) {
<div className="field w-full mb-6 xl:mb-0"> <div className="field w-full mb-6 xl:mb-0">
<InputCom <InputCom
fieldClass="px-6 cursor-default" fieldClass="px-6 cursor-default"
label="currency" label="Currency"
labelClass="tracking-wide" labelClass="tracking-wide"
// inputBg="bg-slate-100" // inputBg="bg-slate-100"
// inputClass="input-curve border border-light-purple" // inputClass="input-curve border border-light-purple"
@@ -272,46 +272,51 @@ function AddJob({ popUpHandler, categories }) {
</div> </div>
<div className="sm:w-[35%] w-full"> <div className="sm:w-[35%] w-full">
<div <label
htmlFor="Job Categories" htmlFor="Job Categories"
className='className="input-label text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold block"' className="input-label text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold flex item-center gap-1"
id="checked-group"
> >
Categories Categories
</div> {props.errors.category && props.touched.category && (
<div <span className="text-[12px] text-red-500">
className="sm:flex-col flex flex-wrap px-3 mt-3" {props.errors.category}
role="group" </span>
aria-labelledby="checked-group" )}
</label>
<select
id="category"
name="category"
value={props.values.category}
className={`input-field p-2 mt-3 rounded-md placeholder:text-base text-dark-gray dark:text-white w-full h-[5.4rem] bg-slate-100 dark:bg-[#11131F] focus:ring-0 focus:outline-none border`}
onChange={props.handleChange}
onBlur={props.handleBlur}
multiple
> >
{categories ? ( {walletDetails?.loading ? (
<option className="text-slate-500 text-lg" value="">
Loading...
</option>
) : walletDetails.data.length ? (
<> <>
{/* <option className="text-slate-500 text-lg" value="">
Select a Category
</option> */}
{Object?.entries(categories).map(([key, value]) => ( {Object?.entries(categories).map(([key, value]) => (
<label <option
key={key} key={key}
className="flex gap-1 w-full items-center" className="text-slate-500 "
value={key}
> >
<Field {value}
type="checkbox" </option>
name="category"
value={key}
/>
<span className="text-[13.975px]">{value}</span>
</label>
))} ))}
</> </>
) : ( ) : (
<label className="flex gap-1 w-full items-center"> <option className="text-slate-500 text-lg" value="">
<Field type="checkbox" name="category" /> No Options Found! Try Again
<span className="text-[13.975px]">null</span> </option>
</label>
)} )}
<span className="h-5 text-sm italic text-[#cf3917]"> </select>
{props.errors.category &&
props.touched.category &&
"please select a category"}
</span>
</div>
</div> </div>
</div> </div>