Skip to content

Commit 88f5694

Browse files
mchapmanmchapman
committed
feat(styling) Add has-error class to fields in sub schemas (for BS3)
1 parent 589595b commit 88f5694

File tree

7 files changed

+325
-57
lines changed

7 files changed

+325
-57
lines changed

‎dist/forms-angular.js

Lines changed: 37 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
/*! forms-angular 2015-02-20 */
1+
/*! forms-angular 2015-02-23 */
22
'use strict';
33

44
var formsAngular = angular.module('formsAngular', [
@@ -30,22 +30,6 @@ formsAngular.controller('BaseCtrl', [
3030

3131
$rootScope.$broadcast('fngFormLoadStart', $scope);
3232

33-
// Invalid field styling for BS3 - only works for one level of nesting
34-
$scope.hasError = function(name, index) {
35-
var form = $scope[$scope.topLevelFormName];
36-
var field;
37-
if (typeof index === 'undefined') {
38-
field = form['f_' + name.replace(/\./g,'_')];
39-
} else {
40-
var parts = name.split('.');
41-
form = form['form_' + parts[0] + index];
42-
field = form[name.replace(/\./g,'-')];
43-
}
44-
if (field && field.$invalid) {
45-
return true;
46-
}
47-
};
48-
4933
formGenerator.decorateScope($scope, formGenerator, recordHandler, sharedStuff);
5034
recordHandler.decorateScope($scope, $modal, recordHandler, ctrlState);
5135

@@ -303,7 +287,7 @@ formsAngular
303287
if (options.subschema && fieldInfo.name.indexOf('.') !== -1) {
304288
// Schema handling - need to massage the ngModel and the id
305289
var compoundName = fieldInfo.name;
306-
var root = options.subschemaRoot;
290+
var root = options.subschemaroot;
307291
var lastPart = compoundName.slice(root.length+1);
308292
if (options.index) {
309293
modelString += root + '[' + options.index + '].' + lastPart;
@@ -534,7 +518,7 @@ formsAngular
534518
for (var arraySel = 0; arraySel < subKeyArray.length; arraySel++) {
535519
var topAndTail = containerInstructions(subKeyArray[arraySel]);
536520
template += topAndTail.before;
537-
template += processInstructions(info.schema, null, {subschema: true, formStyle: options.formstyle, subkey: schemaDefName + '_subkey', subkeyno: arraySel, subschemaRoot: info.name});
521+
template += processInstructions(info.schema, null, {subschema: true, formStyle: options.formstyle, subkey: schemaDefName + '_subkey', subkeyno: arraySel, subschemaroot: info.name});
538522
template += topAndTail.after;
539523
}
540524
subkeys.push(info);
@@ -562,7 +546,7 @@ formsAngular
562546
template += ' </div> ';
563547
}
564548

565-
template += processInstructions(info.schema, false, {subschema: true, formstyle: info.formStyle, model: options.model, subschemaRoot: info.name});
549+
template += processInstructions(info.schema, false, {subschema: true, formstyle: info.formStyle, model: options.model, subschemaroot: info.name});
566550

567551
template += ' </div>' +
568552
'</div>';
@@ -814,7 +798,7 @@ formsAngular
814798
if (thisSubkeyList.hasOwnProperty(keyField)) {
815799
// Not (currently) concerned with objects here - just simple types and lookups
816800
if (dataVal[arrayOffset][keyField] !== thisSubkeyList[keyField] &&
817-
(!dataVal[arrayOffset][keyField].text || dataVal[arrayOffset][keyField].text !== thisSubkeyList[keyField])) {
801+
(typeof dataVal[arrayOffset][keyField] === 'undefined' || !dataVal[arrayOffset][keyField].text || dataVal[arrayOffset][keyField].text !== thisSubkeyList[keyField])) {
818802
matching = false;
819803
break;
820804
}
@@ -2006,7 +1990,19 @@ formsAngular.factory('formGenerator', function (
20061990
$scope.setFormDirty($event);
20071991
};
20081992

2009-
exports.decorateScope = function($scope, formGeneratorInstance, recordHandlerInstance, sharedStuff) {
1993+
exports.hasError = function(formName, name, index, $scope) {
1994+
var form = $scope[$scope.topLevelFormName];
1995+
if (formName !== 'null') {
1996+
form = form[formName.replace('$index', index)];
1997+
}
1998+
var field = form[name];
1999+
if (field && field.$invalid) { // am in two minds about adding && field.$dirty
2000+
return true;
2001+
}
2002+
};
2003+
2004+
2005+
exports.decorateScope = function($scope, formGeneratorInstance, recordHandlerInstance, sharedStuff) {
20102006
$scope.record = sharedStuff.record;
20112007
$scope.phase = 'init';
20122008
$scope.disableFunctions = sharedStuff.disableFunctions;
@@ -2064,6 +2060,10 @@ formsAngular.factory('formGenerator', function (
20642060
return formGeneratorInstance.add(fieldName, $event, $scope);
20652061
};
20662062

2063+
$scope.hasError = function(form, name, index) {
2064+
return formGeneratorInstance.hasError(form, name, index, $scope);
2065+
};
2066+
20672067
$scope.unshift = function (fieldName, $event) {
20682068
return formGeneratorInstance.unshift(fieldName, $event, $scope);
20692069
};
@@ -2157,7 +2157,21 @@ formsAngular.factory('formMarkupHelper', [
21572157
classes += ' col-sm-' + inputSizeHelper.sizeAsNumber(info.size);
21582158
closeTag += '</div>';
21592159
}
2160-
template += '<div' + addAllService.addAll(scope, 'Group', classes, options)+' ng-class="{\'has-error\': hasError(\'' + info.name + '\', $index)}"';
2160+
2161+
var modelControllerName;
2162+
var formName = null;
2163+
var parts = info.name.split('.');
2164+
2165+
if (options && typeof options.subkeyno !== 'undefined') {
2166+
modelControllerName = options.subschemaroot.replace(/\./g, '-') + '-subkey' + options.subkeyno + '-' + parts[parts.length-1];
2167+
} else if (options.subschema) {
2168+
formName = 'form_' + parts[0] + '$index';
2169+
modelControllerName = info.name.replace(/\./g, '-');
2170+
} else {
2171+
modelControllerName = 'f_' + info.name.replace(/\./g,'_');
2172+
}
2173+
2174+
template += '<div' + addAllService.addAll(scope, 'Group', classes, options)+' ng-class="{\'has-error\': hasError(\'' + formName + '\',\'' + modelControllerName + '\', $index)}"';
21612175
closeTag += '</div>';
21622176
} else {
21632177
if (exports.isHorizontalStyle(options.formstyle)) {

‎dist/forms-angular.min.js

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎js/controllers/base.js

Lines changed: 0 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -19,22 +19,6 @@ formsAngular.controller('BaseCtrl', [
1919

2020
$rootScope.$broadcast('fngFormLoadStart', $scope);
2121

22-
// Invalid field styling for BS3 - only works for one level of nesting
23-
$scope.hasError = function(name, index) {
24-
var form = $scope[$scope.topLevelFormName];
25-
var field;
26-
if (typeof index === 'undefined') {
27-
field = form['f_' + name.replace(/\./g,'_')];
28-
} else {
29-
var parts = name.split('.');
30-
form = form['form_' + parts[0] + index];
31-
field = form[name.replace(/\./g,'-')];
32-
}
33-
if (field && field.$invalid) {
34-
return true;
35-
}
36-
};
37-
3822
formGenerator.decorateScope($scope, formGenerator, recordHandler, sharedStuff);
3923
recordHandler.decorateScope($scope, $modal, recordHandler, ctrlState);
4024

‎js/directives/form.js

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -58,7 +58,7 @@ formsAngular
5858
if (options.subschema && fieldInfo.name.indexOf('.') !== -1) {
5959
// Schema handling - need to massage the ngModel and the id
6060
var compoundName = fieldInfo.name;
61-
var root = options.subschemaRoot;
61+
var root = options.subschemaroot;
6262
var lastPart = compoundName.slice(root.length+1);
6363
if (options.index) {
6464
modelString += root + '[' + options.index + '].' + lastPart;
@@ -289,7 +289,7 @@ formsAngular
289289
for (var arraySel = 0; arraySel < subKeyArray.length; arraySel++) {
290290
var topAndTail = containerInstructions(subKeyArray[arraySel]);
291291
template += topAndTail.before;
292-
template += processInstructions(info.schema, null, {subschema: true, formStyle: options.formstyle, subkey: schemaDefName + '_subkey', subkeyno: arraySel, subschemaRoot: info.name});
292+
template += processInstructions(info.schema, null, {subschema: true, formStyle: options.formstyle, subkey: schemaDefName + '_subkey', subkeyno: arraySel, subschemaroot: info.name});
293293
template += topAndTail.after;
294294
}
295295
subkeys.push(info);
@@ -317,7 +317,7 @@ formsAngular
317317
template += ' </div> ';
318318
}
319319

320-
template += processInstructions(info.schema, false, {subschema: true, formstyle: info.formStyle, model: options.model, subschemaRoot: info.name});
320+
template += processInstructions(info.schema, false, {subschema: true, formstyle: info.formStyle, model: options.model, subschemaroot: info.name});
321321

322322
template += ' </div>' +
323323
'</div>';
@@ -569,7 +569,7 @@ formsAngular
569569
if (thisSubkeyList.hasOwnProperty(keyField)) {
570570
// Not (currently) concerned with objects here - just simple types and lookups
571571
if (dataVal[arrayOffset][keyField] !== thisSubkeyList[keyField] &&
572-
(!dataVal[arrayOffset][keyField].text || dataVal[arrayOffset][keyField].text !== thisSubkeyList[keyField])) {
572+
(typeof dataVal[arrayOffset][keyField] === 'undefined' || !dataVal[arrayOffset][keyField].text || dataVal[arrayOffset][keyField].text !== thisSubkeyList[keyField])) {
573573
matching = false;
574574
break;
575575
}

‎js/services/form-generator.js

Lines changed: 17 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -604,7 +604,19 @@ formsAngular.factory('formGenerator', function (
604604
$scope.setFormDirty($event);
605605
};
606606

607-
exports.decorateScope = function($scope, formGeneratorInstance, recordHandlerInstance, sharedStuff) {
607+
exports.hasError = function(formName, name, index, $scope) {
608+
var form = $scope[$scope.topLevelFormName];
609+
if (formName !== 'null') {
610+
form = form[formName.replace('$index', index)];
611+
}
612+
var field = form[name];
613+
if (field && field.$invalid) { // am in two minds about adding && field.$dirty
614+
return true;
615+
}
616+
};
617+
618+
619+
exports.decorateScope = function($scope, formGeneratorInstance, recordHandlerInstance, sharedStuff) {
608620
$scope.record = sharedStuff.record;
609621
$scope.phase = 'init';
610622
$scope.disableFunctions = sharedStuff.disableFunctions;
@@ -662,6 +674,10 @@ formsAngular.factory('formGenerator', function (
662674
return formGeneratorInstance.add(fieldName, $event, $scope);
663675
};
664676

677+
$scope.hasError = function(form, name, index) {
678+
return formGeneratorInstance.hasError(form, name, index, $scope);
679+
};
680+
665681
$scope.unshift = function (fieldName, $event) {
666682
return formGeneratorInstance.unshift(fieldName, $event, $scope);
667683
};

‎js/services/form-markup-helper.js

Lines changed: 15 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -64,7 +64,21 @@ formsAngular.factory('formMarkupHelper', [
6464
classes += ' col-sm-' + inputSizeHelper.sizeAsNumber(info.size);
6565
closeTag += '</div>';
6666
}
67-
template += '<div' + addAllService.addAll(scope, 'Group', classes, options)+' ng-class="{\'has-error\': hasError(\'' + info.name + '\', $index)}"';
67+
68+
var modelControllerName;
69+
var formName = null;
70+
var parts = info.name.split('.');
71+
72+
if (options && typeof options.subkeyno !== 'undefined') {
73+
modelControllerName = options.subschemaroot.replace(/\./g, '-') + '-subkey' + options.subkeyno + '-' + parts[parts.length-1];
74+
} else if (options.subschema) {
75+
formName = 'form_' + parts[0] + '$index';
76+
modelControllerName = info.name.replace(/\./g, '-');
77+
} else {
78+
modelControllerName = 'f_' + info.name.replace(/\./g,'_');
79+
}
80+
81+
template += '<div' + addAllService.addAll(scope, 'Group', classes, options)+' ng-class="{\'has-error\': hasError(\'' + formName + '\',\'' + modelControllerName + '\', $index)}"';
6882
closeTag += '</div>';
6983
} else {
7084
if (exports.isHorizontalStyle(options.formstyle)) {

0 commit comments

Comments
 (0)