Knockout-Contrib / Knockout-Contrib/Knockout-Validation

Parent/Child validation rule of child onlyIf from parent in large dataset

Open
#678 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
JavaScript
Stars
1k
Forks
366
PR merge metrics
No merged PRs in 30d

Description

I have a viewmodel with a parent/child, and the child has a property with a required rule. the required rule has an onlyIf which needs to look at a parent property.

in my parent vm I have a fooParent observable equal to true or false. This is updated in the UI via a dropdown.

in my child vm fooChild I need to set the onlyIf required part based on the fooParent observable.

it all works great for small data sets, but large datasets the UI will freeze when the dropdown is changed.

Is there a way to add a required onlyIf to a child property without it freezing or locking up the UI as it builds the validation rules for each child?

Could I add the rules to the children from the parent vm or would I run into an issue with any new children that are added later through the UI not having the rule applied.

==

pseudo code.. typing from my head to try and provide a small example. this in the real world the child array would be mapped to the array coming in. the key thing is the onlyIf: in the fooChild rule.

var parentvm = function() {
     var self = this;
    self.fooParent = ko.observable(false);
    //there will be 200+ children mapped here.
    self.Children = ko.observableArray( [  new childvm(self) ]);
}

var childvm = function(parent) {
    var self = this;
   var fooChild = ko.observable().extend({   required: {  ... onlyIf: function() { return parent.fooParent() } }  })
}

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the pseudo-code in the issue and reproduce the dropdown change with 200+ child view models; no repository file or test entry point is named. Done means determining whether the validation setup causes the freeze and documenting a concrete scalable behavior or change.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
frontend, web-dev
Issue type
Bug
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.