I would like to submit a radzen template form with multiple tabs, validation should only occur on the visible tabs and I want to highlight a tab once the tab contains an invalid control.
The validation works on all tabs if the rendermode of the tabs is set to client.But I want the validation to work only on the visible tabs, not on all tabs that are "available". To handle the validation I could use the OnInvalidSubmit, but it only gives the FormInvalidSubmitEventArgs wich doesn't contain the form fields it self, hence it is impossible to trace the invalid fields and find out on which tab they reside.
I tried creating a solution with multiple RadzenTemplateForms where every tab page contains its own template, OnSubmit I could easily check if the tabs containing the templateform are valid, if not valid I could highlight the invalid tab. But I dont think this is supported at least I am unable to create a proper razor page to do this.
As you can see I am a bit stuck, can you be so kind to point me in the right direction?
I don't think there is an easy solution to that problem considering the current implementation. The InvalidSubmit event provides the validation error messages. Maybe you can somehow map those messages back to fields (e.g. by having a dictionary). Alternatively you can use RadzenSteps which will validate your form on every step - your user can't get on the next step if the current one has validation errors.
Thanks for your quick reply! Mapping the error messages back to the control it belongs too, is gonna be a tough one (Can't access the components property of the Templateform), and dirty. Even if I would be able to track down the control, I still won't know on wich tab it resides.
RadzenSteps is a great solution, but will not work for what we need. Based on dropdowns the visibility of tab pages will be set.
To be sure, multiple templateforms on one page is not supported?
And validation will only be working on all tabs, instead of the visible one only?
There is no such property. You can however map an error message to a tab index (just a number).
It is supported but you can't submit them as one. RadzenTemplateForm is just the <form> HTML element. You can't nest them and you can submit them at once.
If you use server mode tab rendering only the visible tab will be validated. But then all components in the other tabs will never validate - only the once from the current page.
To be honest I think your current implementation is quite difficult to implement regardless of using Radzen components or not. It would be also very hard for your users - hiding and showing tabs, switchings tabs on validation errors would be a frustrating user experience. I think in most cases users expect only the current page of data to validate and not to be able to switch to a different page if the current one is invalid. Also the submit button is usually in the last page - the user can't submit at any point and get validation errors. Again this is just my opinion - your business requirements could demand the current implementation.
I understand the logic behind validating only the visible tab in server mode. But in client mode it would be more logical to only validate the visible or only the non-disabled tabs. Right now in client mode it validates all tabs..
Happy to hear multiple templateforms is supported! I dont need to nest them, but still I am unable to combine multiple templateforms with tabs..
This can't be done. All components in a RadzenTemplateForm are validated at once.
You can't submit them all at once as I have told you before. You can probably have a separate model for every class and separate Submit/InvalidSubmit handlers. That's all I can think of.
Not sure what stops you at the moment. Set the Data property and add components inside.