How we implementing custom( not window.confirm ) for actions like Delete

[mogadanez]

How we implementing custom( not window.confirm ) for actions like Delete, especially for multiple forms

[Erij-Maherzia-BEN-BRAHIM]

make the click on Delete button (be sure to add the type button to prevent submitting the form) open a modal confirmation
for example:

export function YourComponent(){

const [deletingItem, setDeletingItem]= useState(false)


return (
<button type="button"  onClick={()=>setDeletingItem(true)}> Delete </button>

<ConfirmationModal isOpen={deletingItem} onClose={()=>setDeletingItem(false)} >

You are about to delete ......, Are you sure ?

<button type='button'  onClick={()=>setDeletingItem(false)}>Cancel </button>
<button type='submit'  value={itemId} name="itemId">Confirm </button>
</ ConfirmationModal>
 )
}