Show Confirmation Popup before Changing Switch ON/OFF State in React JS using Ant Design Components
HTML-код
- Опубликовано: 13 июн 2024
- #reactjs #antd #switch #CodeWithAamir
In this video tutorial I have explained how to show confirmation popup before changing Switch ON/OFF state in React JS using Ant Design Components
This video focuses on
- How to show confirmation popup before changing Switch ON/OFF state in React JS using Ant Design Components
- How to show confirmation popup before changing Checkbox checked state in React JS using Ant Design Components
- How to use antd PopConfirm component to show confirmation popup for confirming user action
- How to show confirmation popup conditionaly
- How to switch off antd Switch without confirmation popup and switch ON with confirmation popup
- How to disable confirmation popup using ant design UI in react js app
- How to customize antd popconfirm title, description, ok button etc.
- How to implement onConfirm function for antd switch state change
- How to manage antd switch ON/OFF using react useState hooks
- How to use custom icon in antd popconfirm components using react js app
- How to add onClick function on antd Switch
- How to add onClick function on antd Checkbox
- How to mange two UI controls using one react state
If you are new to ant-design, I have already added an intro video on ant-design and overview of its components at • Ant Design UI library ... link, please go through that video to set up the ground for further components implementation.
For more details on ant-design, please visit its documentation at ant.design/components
Happy Coding!
This is exactly what i was looking for the delete confirmation. i would use that.
Glad to hear it was helpful @Hakan Ahmet
Nice as usually!
Thanks again!
If want to show confirmation on switch off then how to do that?
I got warning in Popup and Modal in v5 please explain me to use it. Thank you.
What warning/error you are facing?
@@CodeWithAamir Thank new version change for it.
Hii amir needed a help on this
const onSubmit =(){
props.form.validateFields((err, fields Values)=>{
If(timeto
Hi @Deadmax Max,
I believe here you need a Rule that links two input controls together and in the rule need a condition that checks the value of other field control. I have explained that dependent rule information in following video where we made the password and confirm password as linked ruled form validation.
ruclips.net/video/ajp8hmAKEhM/видео.html
Please let me know if that helped or need any more help on that.
Thanks
Hii amir can you please show me how I can keep my second field of form disabled until user select the first field in and 3 please help🙏🙏🙏
Hi @Deadmax,
Can you pleases let me know the type of both fields?
@@CodeWithAamir datepickers
Hi @Deadmax,
In the 2nd datePicker you can set disabled={!FIRST_FIELD_VALUE} so in case if FIRST_FIELD_VALUE is null or "" then the 2nd datePicker will be disabled. And to set FIRST_FIELD_VALUE you can declare it like a state variable and update that in onChange props of 1st DatePicker .
I hope you got the idea. Please let me know if you need any more information on that. Thanks
@@CodeWithAamir thx amir