I am having trouble closing the modal after clicking the add button. The form in the modal is used for uploading data to a database. The upload function works correctly, but I'm unsure how to close the modal upon clicking the add button. I am currently using daisyUI.
Here is the code snippet:
<label htmlFor="add-doc" className="btn btn-sm btn-success ml-auto mb-3">
Add Document
</label>
<input type="checkbox" id="add-doc" className="modal-toggle" />
<div className="modal">
<div className="modal-box">
<h3 className="font-bold text-lg mb-5">Add Document</h3>
<div className="form-control">
<label className="input-group mb-5">
<span>Document Name</span>
<input
type="text"
placeholder="document name"
className="input input-bordered"
name="docName"
onChange={fieldHandler}
/>
</label>
<label className="input-group mb-3">
<span>Document Location</span>
<input
type="text"
placeholder="document location"
className="input input-bordered"
name="docLoc"
onChange={fieldHandler}
/>
</label>
<label className="label">
<span className="label-text">Insert photo of document location</span>
</label>
<input
type="file"
className="file-input w-full max-w-xs"
name="photoLoc"
// onChange={fieldHandler}
/>
</div>
<div className="modal-action">
<label htmlFor="add-doc" className="btn">
Cancel{" "}
</label>
<label
onClick={handleDocSubmit.bind(this)}
htmlFor="add-doc"
className="btn btn-success"
>
<button>Add</button>
</label>
</div>
</div>
</div>