You can create custom elements and custom validator where you can execute your javascript validation along with default one. Please take a look at our sample elements at https://github.com/episerver/EPiServer.Forms.Samples the Address or DateTime element might give you a hint.

Hop this help

Hi,

Is there any way to prevent submit without creating custom validator?

We need some way to prevent submitting under some special conditions, custom validator is not the solution in this case, so we would like to be able somehow to prevent submission (it might be in formsStepValidating event), how to achieve that? Is there any kind of flag or similar which we might set to tell the form to not do submit?

Unfortunately, there is no kind of flag that cancel form submitting. But I think custome validator can work for most of case, can you explain why it is not the solution for you?

Well we have created our own form elements by inheriting from default (e.g. TextboxElementBlock, SelectionElementBlock etc) and we are using Parsley library for client validations. So we are validating all the elements on form (pretty much data attributes based logic), not just single element.

Another thing is that we have added kind of spam protection logic to the whole form itselt (not related to single element but to whole form) so that kind of security check we also want to do globally on the top of form not on particular element.

Do you think the solution mentioned in the question (binding to submit button click) could work? then we might do our validation there + spam protection check and totally stop submitting.

Btw when doing custom validator, does it always require C# class? even when we need just frontend validation there? it seems that registering new validator requires full name of classs.

And one more thing, we had a requirement that for file upload customer wants to have link which will do Remove files action, we have implemented that with Javascript by just clearing the input value, but it seems epiforms still keeps the information that it has file somewhere since when we marked that element to required and then cleared the field it still allowed to submit form even thought the file upload was empty and submitted empty value (it should stop submission when element required and no file there)

• The solution of binding to submit button click will work. But you need to run your spam protection logic FIRST before executing default handler (which contains fields validation logic).
• Yes, register new validator required C# class for validating your data on server side. You need return true in Validate method if you don't have C# validation logic.
• You need something like _hack_clearFileInput method in EPiServerForms.js to fully clear FileUpload element. Please refer to the method _resetFormValues to see how to clear FileUpload elements.

According to your answers:

• great will try that
• yep I thought so
• I actually was checking yesterday the _hack_clearFileInput but comment was saying " /// HACK: THIS IS FOR IE only:  " so I assumed it is not solution for me (I noticed that behaviour in Firefox)

Hi Dac,

Now after we have upgraded Episerver.Forms to version 4.18 (before 4.6) the prevention of form submitting stopped to work.

We are using

$('.FormSubmitButton').on('click', function (e) {

e.preventDefault();

// here our custom validations, if fails then
e.stopPropagation();
e.stopImmediatePropagation();

.......

)}

Even when we do that default Epi on click event is triggered, propagation is not stopped, form is submitted even when it is not valid!

We have tried already multiple ways how prevent propagating that event, but no luck. What has been changed that we cannot prevent submission when we want?

We were considering also switch to

workInNonJSMode

but then Dependencies would stop working which we need.

latest finding - it is not even related to upgrade - it seems to work badly even before.
Important to mention that we have custom elements with custom views - meaning that default  epi validation is not even handling these.
But simply if we want to prevent submit, we are calling e.stopPropagation(); but id does not work, why?
Rex in your case it really worked?