Hi there,
To disallow special characters in the email field, you can create a custom field validation function following the official documentation available here: https://developer.ninjaforms.com/codex/client-side-field-validation/.
I have attempted to create a code block that will prevent the use of special characters in the email field. You can utilize the following code in your child theme’s JS file or with the “Simple Custom CSS and JS” free plugin available at “https://projectdmc.org/plugins/custom-css-js/“.
// Create a new object for custom validation of Email field
var myCustomFieldController = Marionette.Object.extend({
initialize: function() {
// On the Form Submission's field validation...
var submitChannel = Backbone.Radio.channel('submit');
this.listenTo(submitChannel, 'validate:field', this.validateField);
// on the Field's model value change...
var fieldsChannel = Backbone.Radio.channel('fields');
this.listenTo(fieldsChannel, 'change:modelValue', this.validateField);
},
validateField: function(model) {
// Only validate email fields
if ('email' != model.get('type')) return;var value = model.get('value');
// Check if the field is required and empty
if (model.get('required') && !value) {
Backbone.Radio.channel('fields').request('add:error', model.get('id'), 'required-error', 'This field is required');
return;
}
// Check for special characters
if (value && !this.isValidEmail(value)) {
Backbone.Radio.channel('fields').request('add:error', model.get('id'), 'invalid-email-error', 'Email address contains invalid characters');
} else {
Backbone.Radio.channel('fields').request('remove:error', model.get('id'), 'invalid-email-error');
}
},
isValidEmail: function(email) {
// This regex allows only letters, numbers, dots, and @ symbol
var regex = /^[a-zA-Z0-9@.]+$/;
return regex.test(email);
}
});
// Run the code after Document Ready
jQuery(document).ready(function($) {
// Instantiate our custom field's controller, defined above.
new myCustomFieldController();
});
⚠️ Note: We are not affiliated with the suggested plugin. If the code is not working, we will not be able to help, as you know it requires custom coding, which is beyond our scope. I have tested it, and it worked fine on my own sandbox website.
Please keep in mind you can also reach out to our Customer Success team who are well-equipped to dive deeper into this issue with you. Plus, by logging this problem, it’ll help us keep track of it and ensure we’re working on a solution that’ll benefit not just you, but all of our users facing similar challenges.