haacked / aspnet-client-validation

A client validation library for ASP.NET MVC that does not require jQuery

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Removed inputs still get validated

max-maurice opened this issue · comments

When using the watch option, removed inputs still get validated. In my case, I did the following:

  1. Dynamically add inputs, leaving required fields blank
  2. Submit the form. As it is invalid, validation errors for the new inputs appear.
  3. Remove the invalid inputs.
  4. Submit the form. A JS error appears: TypeError: input.form is null. The input in question is not part of the form anymore (input.isConnected is false).

I see the same, but in my case I did the following:

  1. Load a page with a jQuery DataTable
  2. Remove a row of that table
  3. Try to submit the form. With logging turned on I see TypeError: input.form is null [aspnet-validation.js:857:30].

EDIT: Stack traces from FireFox and Chrome below

Validation error TypeError: input.form is null
    removeError https://localhost:44314/lib/aspnet-client-validation/dist/aspnet-validation.js:1017
    ValidationService https://localhost:44314/lib/aspnet-client-validation/dist/aspnet-validation.js:1088
    step https://localhost:44314/lib/aspnet-client-validation/dist/aspnet-validation.js:142
    verb https://localhost:44314/lib/aspnet-client-validation/dist/aspnet-validation.js:123
    __awaiter https://localhost:44314/lib/aspnet-client-validation/dist/aspnet-validation.js:117
    __awaiter https://localhost:44314/lib/aspnet-client-validation/dist/aspnet-validation.js:113
    ValidationService https://localhost:44314/lib/aspnet-client-validation/dist/aspnet-validation.js:1032
    tasks https://localhost:44314/lib/aspnet-client-validation/dist/aspnet-validation.js:788
    getFormValidationTask https://localhost:44314/lib/aspnet-client-validation/dist/aspnet-validation.js:788
    cb https://localhost:44314/lib/aspnet-client-validation/dist/aspnet-validation.js:835
    trackFormInput https://localhost:44314/lib/aspnet-client-validation/dist/aspnet-validation.js:862
    addInput https://localhost:44314/lib/aspnet-client-validation/dist/aspnet-validation.js:897
    scanInputs https://localhost:44314/lib/aspnet-client-validation/dist/aspnet-validation.js:933
    scan https://localhost:44314/lib/aspnet-client-validation/dist/aspnet-validation.js:1148
    init https://localhost:44314/lib/aspnet-client-validation/dist/aspnet-validation.js:1127
    bootstrap https://localhost:44314/lib/aspnet-client-validation/dist/aspnet-validation.js:1139
    <anonymous> https://localhost:44314/js/site.js?v=OMefjl7xclgyLyDcNGMNwnYl7bG2e3N65EC-1QO__VE:8
Validation error TypeError: Cannot read properties of null (reading 'querySelectorAll')
    at ./src/index.ts.ValidationService.removeError (aspnet-validation.js:1017:33)
    at ValidationService.<anonymous> (aspnet-validation.js:1088:30)
    at step (aspnet-validation.js:142:23)
    at Object.next (aspnet-validation.js:123:53)
    at aspnet-validation.js:117:71
    at new Promise (<anonymous>)
    at ./src/index.ts.__awaiter (aspnet-validation.js:113:12)
    at aspnet-validation.js:1032:37
    at aspnet-validation.js:788:68
    at Array.map (<anonymous>)

Would checking if input.form is not null on line 1017 be too simplistic of a fix?

// Removing an error from one input should also remove it from others with the same name (i.e. for radio button and checkbox lists).
if (input.form) {
    var inputs = input.form.querySelectorAll("input[name=\"".concat(input.name, "\"]"));
    for (var i = 0; i < inputs.length; i++) {
        this.swapClasses(inputs[i], this.ValidationInputValidCssClassName, this.ValidationInputCssClassName);
    }
}

Worth a try. Does anyone have a super simple repro I can include in the demos app?

Nevermind, I have a PR.