json-schema-form / angular-schema-form

Generate forms from a JSON schema, with AngularJS!
https://json-schema-form.github.io/angular-schema-form
MIT License
2.47k stars 653 forks source link

condition is not supported for IE #984

Open yinbiao opened 6 years ago

yinbiao commented 6 years ago

Enhancement

As a user, when i use “radios-inline” to crontrol some text input to hidden,so i use "condition" in these text input, exp: condition: "model.absolute"

Expected behaviour

I expected it worked for ie, firefix, chrome

Actual behaviour

It actually worked for firefix, chrome, but it raise exception in IE8, it shows: TypeError: Object not supported “getAttribute" attribute or method

Debug: condition: function(args) { 174 // Do we have a condition? Then we slap on an ng-if on all children, 175 // but be nice to existing ng-if. 176 console.log(args); 177 if (args.form.condition) { 178 var evalExpr = 'evalExpr(' + args.path + 179 '.condition, { model: model, "arrayIndex": $index})'; 180 if (args.form.key) { 181 var strKey = sfPathProvider.stringify(args.form.key); 182 evalExpr = 'evalExpr(' + args.path + '.condition,{ model: model, "arrayIndex": $index, ' + 183 '"modelValue": model' + (strKey[0] === '[' ? '' : '.') + strKey + '})'; 184 } 185 186 var children = args.fieldFrag.children || args.fieldFrag.childNodes; 187 console.log(children); 188 for (var i = 0; i < children.length; i++) { 189 var child = children[i]; 190 console.log(child); 191 var ngIf = child.getAttribute('ng-if'); 192 child.setAttribute( 193 'ng-if', 194 ngIf ? 195 '(' + ngIf + 196 ') || (' + evalExpr + ')' 197 : evalExpr 198 ); 199 } 200 } 201 },

In the ie console, it shows: \<NodeList length="2">\<\/NodeList> \<p class="hz-help ($::form.htmlClasss$}" sf-field="3" ng-bind-html="form.helpvalue">\<\/p> EmptyTextNode TypeError: Object not supported “getAttribute" attribute or method

yinbiao commented 6 years ago

I added a conditional judgment, then it worked in IE: if(child.getAttribute){ var ngIf = child.getAttribute('ng-if'); child.setAttribute( 'ng-if', ngIf ? '(' + ngIf + ') || (' + evalExpr + ')' : evalExpr ); }

Anthropic commented 6 years ago

@yinbiao thanks for taking the time to make a clear issue. Can you confirm when you say it worked that it shows and hides the field as expected or just doesn't error? It looks above that the added if condition would exclude the code from running in IE at all wouldn't it?

scottux commented 6 years ago

@yinbiao Any particular version of IE?

scottux commented 6 years ago

And this is weird, it looks like it is failing because it is trying to call getAttribute on an EmptyTextNode. Maybe we should skip those.

edclements commented 5 years ago

I think this is a duplicate of https://github.com/json-schema-form/angular-schema-form/issues/903 which is fixed in 0.8.14

yinbiao commented 5 years ago

@Anthropic yes , it not running on IE, but shows and hides the field as expected and doesn't error,

yinbiao commented 5 years ago

@scottux I only tested on a version of the IE browser,it should be ie 8