Hello,
I want to validate my form on server side. I'm using dx-form, and this form contains many dx-items.
Normal flow of application would be like this:
- User clicks submit buttons.
- Client side validations fires.
- An ajax call to server side upon client validation successfully.
- Server throws error with information, what field error has occurred and error message.
- Client receives this error.
Now I want to display this as an error message on given field.
How can I do this?
I've read documentation here: Server-Side ValidationBut it does not illustrate this scenario.
Form - Server-side validation
Answers approved by DevExpress Support
Hi,
Thank you for your clarification. The same approach is applicable to the dxForm widget. It uses our data editors in its container. So, the Data Validation concept is applicable there as well.
Use the Validation demo as a starting point and add "custom" validation rules with validationCallback by using the syntax illustrated in the aforementioned help section: Server-Side Validation. Should you need further clarification, feel free to ask. I will be happy to help you.
See Also:
Validate and Submit the Form
Thanks,
Alessandro
Show previous comments
(1)
Hi,
Thank you for your clarification. In this scenario, you can use the following logic:
JavaScriptvar fnEditor = $("#formContainer").dxForm("instance").getEditor("FirstName");
$.getJSON(SERVICE_URL).done(function (result) {
fnEditor.option({
validationError: { message: result[0].title },
isValid: false
});
});
https://codepen.io/anon/pen/EqXaYg
The key idea is to access the required editor instance via the getEditor method and specify the validationError and isValid options explicitly based on the server result. I hope this helps you.
RA
6 years ago
Thanks Alessandro for this solution.It worked well for me.
I don't know why this is not documented with help section: Server-Side Validation.
Hi,
The approach you chosen does not use the built-in validationCallback. This is the standard way to implement server-side validation. So, it is documented in the aforementioned article. As for your approach, it uses the custom logic with a separate button and manual callback to the server.
Hi,
The help section you mentioned contains a sample that sends the server request and accepts the result from the server along with the error message:
. Please let me know if I missed anything important.
Hello Alessandro
I think you did not understand my question.
Where is submit button in the example given in documentation?
Where is a dx-form instance in the example?
In question, I've clearly mentioned that user clicks a submit button.
Also I've mentioned that I'm using dx-form.
Please read the question carefully.