Skip to content
Snippets Groups Projects
Commit 4d7b6561 authored by Allen Gilliland's avatar Allen Gilliland
Browse files

use angular events for a much cleaner implementation of our form stuff that...

use angular events for a much cleaner implementation of our form stuff that avoids a bunch of dependent code.
parent 659e48b0
Branches
Tags
No related merge requests found
Showing
with 133 additions and 137 deletions
......@@ -44,8 +44,8 @@ DatabasesControllers.controller('DatabaseList', ['$scope', 'Metabase', function(
});
}]);
DatabasesControllers.controller('DatabaseEdit', ['$scope', '$routeParams', '$location', 'Metabase', 'MetabaseForm',
function($scope, $routeParams, $location, Metabase, MetabaseForm) {
DatabasesControllers.controller('DatabaseEdit', ['$scope', '$routeParams', '$location', 'Metabase',
function($scope, $routeParams, $location, Metabase) {
// takes in our API form database details and parses them into a map of usable form field values
var parseDetails = function(engine, details) {
......@@ -82,25 +82,25 @@ DatabasesControllers.controller('DatabaseEdit', ['$scope', '$routeParams', '$loc
// update an existing Database
var update = function(database, details) {
MetabaseForm.clearFormErrors($scope.form);
$scope.$broadcast("form:reset");
database.details = buildDetails(database.engine, details);
Metabase.db_update(database, function (updated_database) {
$scope.database = updated_database;
$scope.$broadcast("form:success", "Successfully saved!");
$scope.$broadcast("form:api-success", "Successfully saved!");
}, function (error) {
MetabaseForm.parseFormErrors($scope.form, error);
$scope.$broadcast("form:api-error", error);
});
};
// create a new Database
var create = function(database, details) {
MetabaseForm.clearFormErrors($scope.form);
$scope.$broadcast("form:reset");
database.org = $scope.currentOrg.id;
database.details = buildDetails(database.engine, details);
Metabase.db_create(database, function (new_database) {
$location.path('/' + $scope.currentOrg.slug + '/admin/databases/' + new_database.id);
}, function (error) {
MetabaseForm.parseFormErrors($scope.form, error);
$scope.$broadcast("form:api-error", error);
});
};
......
......@@ -10,47 +10,47 @@
<!-- form -->
<div class="Grid-cell Cell--2of3">
<form class="Form-new bordered rounded shadowed" name="form" novalidate>
<div class="Form-field" ng-class="{'Form--fieldError': form.engine.$error.message !== undefined}">
<mb-form-label form="form" display-name="Database type" field-name="engine"></mb-form-label>
<div class="Form-field" mb-form-field="engine">
<mb-form-label display-name="Database type" field-name="engine"></mb-form-label>
<label class="Select Form-offset">
<select name="engine" ng-model="database.engine" ng-options="type as properties.name for (type, properties) in form_input.engines"></select>
</label>
</div>
<div class="Form-field" ng-class="{'Form--fieldError': form.name.$error.message !== undefined}">
<mb-form-label form="form" display-name="Name" field-name="name"></mb-form-label>
<div class="Form-field" mb-form-field="engine">
<mb-form-label display-name="Name" field-name="name"></mb-form-label>
<input class="Form-input Form-offset full" name="name" placeholder="How would you like to refer to this database?" ng-model="database.name" required autofocus />
<span class="Form-charm"></span>
</div>
<!-- TODO: database type dependent inputs -->
<div class="FormInputGroup" ng-show="database.engine == 'postgres'">
<div class="Form-field" ng-class="{'Form--fieldError': form.host.$error.message !== undefined}">
<mb-form-label form="form" display-name="Host" field-name="host"></mb-form-label>
<div class="Form-field" mb-form-field="host">
<mb-form-label display-name="Host" field-name="host"></mb-form-label>
<input class="Form-input Form-offset full" name="host" placeholder="localhost" ng-model="details.host" required />
<span class="Form-charm"></span>
</div>
<div class="Form-field" ng-class="{'Form--fieldError': form.port.$error.message !== undefined}">
<mb-form-label form="form" display-name="Port" field-name="port"></mb-form-label>
<div class="Form-field" mb-form-field="port">
<mb-form-label display-name="Port" field-name="port"></mb-form-label>
<input class="Form-input Form-offset full" name="port" placeholder="5432" ng-model="details.port" required />
<span class="Form-charm"></span>
</div>
<div class="Form-field" ng-class="{'Form--fieldError': form.dbname.$error.message !== undefined}">
<mb-form-label form="form" display-name="Database name" field-name="dbname"></mb-form-label>
<div class="Form-field" mb-form-field="dbname">
<mb-form-label display-name="Database name" field-name="dbname"></mb-form-label>
<input class="Form-input Form-offset full" name="dbname" placeholder="What is the name of your database?" ng-model="details.dbname" />
<span class="Form-charm"></span>
</div>
<div class="Form-field" ng-class="{'Form--fieldError': form.user.$error.message !== undefined}">
<mb-form-label form="form" display-name="Database username" field-name="user"></mb-form-label>
<div class="Form-field" mb-form-field="user">
<mb-form-label display-name="Database username" field-name="user"></mb-form-label>
<input class="Form-input Form-offset full" name="user" placeholder="What username do you use to login to the database?" ng-model="details.user" required />
<span class="Form-charm"></span>
</div>
<div class="Form-field" ng-class="{'Form--fieldError': form.pass.$error.message !== undefined}">
<mb-form-label form="form" display-name="Database password" field-name="pass"></mb-form-label>
<div class="Form-field" mb-form-field="pass">
<mb-form-label display-name="Database password" field-name="pass"></mb-form-label>
<input class="Form-input Form-offset full" name="pass" placeholder="*******" ng-model="details.pass" />
<span class="Form-charm"></span>
</div>
......@@ -60,7 +60,7 @@
<button class="Button" ng-class="{'Button--primary': form.$valid}" ng-click="save(database, details)" ng-disabled="!form.$valid">
Save
</button>
<mb-form-message form="form"></mb-form-message>
<mb-form-message></mb-form-message>
</div>
</form>
</div>
......
......@@ -96,15 +96,15 @@ EmailReportControllers.controller('EmailReportList', ['$scope', '$routeParams',
}
]);
EmailReportControllers.controller('EmailReportDetail', ['$scope', '$routeParams', '$location', 'EmailReport', 'EmailReportUtils', 'Metabase', 'MetabaseForm',
function($scope, $routeParams, $location, EmailReport, EmailReportUtils, Metabase, MetabaseForm) {
EmailReportControllers.controller('EmailReportDetail', ['$scope', '$routeParams', '$location', 'EmailReport', 'EmailReportUtils', 'Metabase',
function($scope, $routeParams, $location, EmailReport, EmailReportUtils, Metabase) {
// $scope.report
// $scope.success_message
// $scope.error_message
$scope.save = function(reportDetail) {
MetabaseForm.clearFormErrors($scope.form);
$scope.$broadcast("form:reset");
// we need to ensure our recipients list is properly set on the report
var recipients = [];
......@@ -117,9 +117,9 @@ EmailReportControllers.controller('EmailReportDetail', ['$scope', '$routeParams'
// if there is already an ID associated with the report then we are updating
EmailReport.update(reportDetail, function (result) {
$scope.report = result;
$scope.$broadcast("form:success", "Successfully saved!");
$scope.$broadcast("form:api-success", "Successfully saved!");
}, function (error) {
MetabaseForm.parseFormErrors($scope.form, error);
$scope.$broadcast("form:api-error", error);
});
} else {
// otherwise we are creating a new report
......@@ -131,7 +131,7 @@ EmailReportControllers.controller('EmailReportDetail', ['$scope', '$routeParams'
// move the user over the the actual page for the new report
$location.path('/' + $scope.currentOrg.slug + '/admin/emailreport/' + result.id);
}, function (error) {
MetabaseForm.parseFormErrors($scope.form, error);
$scope.$broadcast("form:api-error", error);
});
}
......
......@@ -10,20 +10,20 @@
<!-- form -->
<div class="Grid-cell Cell--2of3">
<form class="Form-new bordered rounded shadowed" name="form" novalidate>
<div class="Form-field" ng-class="{'Form--fieldError': form.name.$error.message !== undefined}">
<mb-form-label form="form" display-name="Name" field-name="name"></mb-form-label>
<div class="Form-field" mb-form-field="name">
<mb-form-label display-name="Name" field-name="name"></mb-form-label>
<input class="Form-input Form-offset full" name="name" placeholder="How would you like to refer to this report?" ng-model="report.name" required autofocus/>
<span class="Form-charm"></span>
</div>
<div class="Form-field" ng-class="{'Form--fieldError': form.description.$error.message !== undefined}">
<mb-form-label form="form" display-name="Description" field-name="description"></mb-form-label>
<div class="Form-field" mb-form-field="description">
<mb-form-label display-name="Description" field-name="description"></mb-form-label>
<input class="Form-input Form-offset full" name="description" placeholder="What should people know about this report?" ng-model="report.description" />
<span class="Form-charm"></span>
</div>
<div class="Form-field" ng-class="{'Form--fieldError': form.mode.$error.message !== undefined}">
<mb-form-label form="form" display-name="Mode" field-name="mode"></mb-form-label>
<div class="Form-field" mb-form-field="mode">
<mb-form-label display-name="Mode" field-name="mode"></mb-form-label>
<div class="Form-offset">
<div class="Button-group">
<!-- TODO: hardcoding values :( -->
......@@ -33,15 +33,15 @@
</div>
</div>
<div class="Form-field" ng-class="{'Form--fieldError': form.public_perms.$error.message !== undefined}">
<mb-form-label form="form" display-name="Permissions" field-name="public_perms"></mb-form-label>
<div class="Form-field" mb-form-field="public_perms">
<mb-form-label display-name="Permissions" field-name="public_perms"></mb-form-label>
<label class="Select Form-offset">
<select name="public_perms" ng-model="report.public_perms" ng-options="perm.id as perm.name for perm in form_input.permissions" required ></select>
</label>
</div>
<div class="Form-field" ng-class="{'Form--fieldError': form.recipients.$error.message !== undefined}">
<mb-form-label form="form" display-name="Recipients" field-name="recipients"></mb-form-label>
<div class="Form-field" mb-form-field="recipients">
<mb-form-label display-name="Recipients" field-name="recipients"></mb-form-label>
<ul class="Checkbox-group Form-offset">
<li ng-repeat="user in form_input.users">
<input type="checkbox" id="{{user.id}}" ng-model="user.incl" /> <label for="{{user.id}}">{{user.name}}</label>
......@@ -49,14 +49,14 @@
</li>
</div>
<div class="Form-field" ng-class="{'Form--fieldError': form.email_addresses.$error.message !== undefined}">
<mb-form-label form="form" display-name="Email aliases" field-name="email_addresses"></mb-form-label>
<div class="Form-field" mb-form-field="email_addresses">
<mb-form-label display-name="Email aliases" field-name="email_addresses"></mb-form-label>
<textarea class="Form-input Form-offset full" name="email_addresses" ng-model="report.email_addresses" placeholder="Enter emails (separated by commas) of other recipients, who may need this email"></textarea>
<span class="Form-charm"></span>
</div>
<div class="Form-field" ng-class="{'Form--fieldError': form.dataset_query.$error.message !== undefined}">
<mb-form-label form="form" display-name="Email contents" field-name="dataset_query"></mb-form-label>
<div class="Form-field" mb-form-field="dataset_query">
<mb-form-label display-name="Email contents" field-name="dataset_query"></mb-form-label>
<div class="mb1">
<label class="Select Form-offset block">
<select ng-model="report.dataset_query.database" ng-options="db.id as db.name for db in form_input.databases" ng-change="refreshTableList(report.dataset_query.database)">
......@@ -73,8 +73,8 @@
</div>
</div>
<div class="Form-field" ng-class="{'Form--fieldError': form.schedule.$error.message !== undefined}">
<mb-form-label form="form" display-name="Schedule" field-name="schedule"></mb-form-label>
<div class="Form-field" mb-form-field="schedule">
<mb-form-label display-name="Schedule" field-name="schedule"></mb-form-label>
<div class="Form-offset">
<div class="Button-group">
<button class="Button" ng-class="{ 'Button--active' : report.schedule.days_of_week[day.id] }" ng-model="report.schedule.days_of_week[day.id]" ng-repeat="day in form_input.days_of_week" btn-checkbox>{{day.name}}</button>
......@@ -98,7 +98,7 @@
<button class="Button" ng-class="{'Button--primary': form.$valid}" ng-click="save(report)" ng-disabled="!form.$valid || report.dataset_query.query.source_table == ''">
Save
</button>
<mb-form-message form="form"></mb-form-message>
<mb-form-message></mb-form-message>
</div>
</form>
</div>
......
......@@ -7,23 +7,21 @@ var OrganizationAdminControllers = angular.module('corvusadmin.organization.cont
'metabase.forms'
]);
OrganizationAdminControllers.controller('OrganizationSettings', ['$scope', 'Organization', 'MetabaseForm',
function($scope, Organization, MetabaseForm) {
OrganizationAdminControllers.controller('OrganizationSettings', ['$scope', 'Organization',
function($scope, Organization) {
$scope.save = function(organization) {
MetabaseForm.clearFormErrors($scope.form);
$scope.form.$setPristine();
//$scope.form.$setUntouched();
$scope.$broadcast("form:reset");
Organization.update(organization, function (org) {
$scope.currentOrg = org;
$scope.$broadcast("form:success", "Successfully saved!");
$scope.$broadcast("form:api-success", "Successfully saved!");
// we need to trigger a refresh of $scope.user so that these changes propogate the UI
$scope.refreshCurrentUser();
}, function (error) {
MetabaseForm.parseFormErrors($scope.form, error);
$scope.$broadcast("form:api-error", error);
});
};
......
......@@ -7,25 +7,25 @@
<!-- form -->
<div class="Grid-cell Cell--2of3">
<form class="Form-new bordered rounded shadowed" name="form" novalidate>
<div class="Form-field" ng-class="{'Form--fieldError': form.slug.$error.message !== undefined}">
<mb-form-label form="form" display-name="Slug" field-name="slug"></mb-form-label>
<div class="Form-field" mb-form-field="slug">
<mb-form-label display-name="Slug" field-name="slug"></mb-form-label>
<input class="Form-input Form-offset full" name="slug" ng-model="currentOrg.slug" ng-disabled="true" />
</div>
<div class="Form-field" ng-class="{'Form--fieldError': form.name.$error.message !== undefined}">
<mb-form-label form="form" display-name="Name" field-name="name"></mb-form-label>
<div class="Form-field" mb-form-field="name">
<mb-form-label display-name="Name" field-name="name"></mb-form-label>
<input class="Form-input Form-offset full" name="name" placeholder="What is the name of your organization?" ng-model="currentOrg.name" required autofocus/>
<span class="Form-charm"></span>
</div>
<div class="Form-field" ng-class="{'Form--fieldError': form.description.$error.message !== undefined}">
<mb-form-label form="form" display-name="Description" field-name="description"></mb-form-label>
<div class="Form-field" mb-form-field="description">
<mb-form-label display-name="Description" field-name="description"></mb-form-label>
<input class="Form-input Form-offset full" name="description" placeholder="What else should people know about this org?" ng-model="currentOrg.description" />
<span class="Form-charm"></span>
</div>
<div class="Form-field" ng-class="{'Form--fieldError': form.logo_url.$error.message !== undefined}">
<mb-form-label form="form" display-name="Logo url" field-name="logo_url"></mb-form-label>
<div class="Form-field" mb-form-field="logo_url">
<mb-form-label display-name="Logo url" field-name="logo_url"></mb-form-label>
<input class="Form-input Form-offset full" name="logo_url" placeholder="Link to an image of your logo" ng-model="currentOrg.logo_url" />
<span class="Form-charm"></span>
</div>
......
......@@ -8,22 +8,20 @@
<section class="Grid Grid--gutters Grid--full Grid--2of3">
<div class="Grid-cell Cell--2of3">
<form class="Form-new bordered rounded shadowed" name="form" novalidate>
<div class="FormError" ng-show="form.$error.message">{{form.$error.message}}</div>
<div class="Form-field" ng-class="{'Form--fieldError': form.first_name.$error.message !== undefined}">
<mb-form-label form="form" display-name="First name" field-name="first_name"></mb-form-label>
<div class="Form-field" mb-form-field="first_name">
<mb-form-label display-name="First name" field-name="first_name"></mb-form-label>
<input class="Form-input Form-offset full" name="first_name" placeholder="John" ng-model="newUser.first_name" required autofocus />
<span class="Form-charm"></span>
</div>
<div class="Form-field" ng-class="{'Form--fieldError': form.last_name.$error.message !== undefined}">
<mb-form-label form="form" display-name="Last name" field-name="last_name"></mb-form-label>
<div class="Form-field" mb-form-field="last_name">
<mb-form-label display-name="Last name" field-name="last_name"></mb-form-label>
<input class="Form-input Form-offset full" name="last_name" placeholder="Doe" ng-model="newUser.last_name" required />
<span class="Form-charm"></span>
</div>
<div class="Form-field" ng-class="{'Form--fieldError': form.email.$error.message !== undefined}">
<mb-form-label form="form" display-name="Email" field-name="email"></mb-form-label>
<div class="Form-field" mb-form-field="email">
<mb-form-label display-name="Email" field-name="email"></mb-form-label>
<input class="Form-input Form-offset full" name="email" placeholder="johndoe@mycompany.com" ng-model="newUser.email" required />
<span class="Form-charm"></span>
</div>
......
......@@ -92,11 +92,11 @@ PeopleControllers.controller('PeopleList', ['$scope', 'Organization',
]);
PeopleControllers.controller('PeopleAdd', ['$scope', '$location', 'Organization', 'MetabaseForm',
function($scope, $location, Organization, MetabaseForm) {
PeopleControllers.controller('PeopleAdd', ['$scope', '$location', 'Organization',
function($scope, $location, Organization) {
$scope.save = function(newUser) {
MetabaseForm.clearFormErrors($scope.form);
$scope.$broadcast("form:reset");
newUser.orgId = $scope.currentOrg.id;
newUser.admin = false;
......@@ -104,7 +104,7 @@ PeopleControllers.controller('PeopleAdd', ['$scope', '$location', 'Organization'
// just go back to people listing page for now
$location.path('/'+$scope.currentOrg.slug+'/admin/people/');
}, function (error) {
MetabaseForm.parseFormErrors($scope.form, error);
$scope.$broadcast("form:api-error", error);
});
};
}
......
......@@ -5,61 +5,49 @@
var MetabaseForms = angular.module('metabase.forms', ['corvus.directives']);
MetabaseForms.service('MetabaseForm', function() {
// accepts an instance of angular form.FormController and clears any of our error messages from the form
this.clearFormErrors = function(form) {
Object.keys(form).forEach(function (key) {
// we only care about attributes of the form which do NOT start with '$'
if (key.indexOf('$') === -1 &&
key in form &&
typeof(form[key]) === 'object' &&
form[key] !== null &&
'$error' in form[key]) {
form[key].$error.message = undefined;
}
});
form.$error.message = undefined;
};
MetabaseForms.directive('mbFormField', [function () {
// accepts an instance of angular form.FormController and the http errors from an $http call
// and will parse out any supplied error information and set it on the form
this.parseFormErrors = function(form, httpErrors) {
if (httpErrors.data.errors) {
// field validation error(s)
Object.keys(httpErrors.data.errors).forEach(function (key) {
if (form[key] !== 'undefined') {
// this simply takes the error message from our api response and
// applies it to the correct form field in our angular form object
form[key].$error.message = httpErrors.data.errors[key];
}
return {
restrict: 'A',
scope: {},
link: function(scope, element, attr) {
var fieldName = attr.mbFormField;
// NOTE: if we the above conditional fails that means we got an error for a field that our form
// does not seem to be interested in, so we simply skip over it and do nothing
scope.$on("form:api-error", function (event, httpErrors) {
if (httpErrors.data.errors && fieldName in httpErrors.data.errors) {
element.addClass('Form--fieldError');
}
});
} else if (httpErrors.data.message) {
// generic error not attributed to specific field
form.$error.message = httpErrors.data.message;
} else if (httpErrors.status === 500) {
// generic 500 without a specific message
form.$error.message = "Server error encountered";
scope.$on("form:reset", function (event) {
element.removeClass('Form--fieldError');
});
}
};
});
}]);
MetabaseForms.directive('mbFormLabel', [function () {
return {
restrict: 'E',
replace: true,
template: '<label class="Form-label Form-offset">{{displayName}}: <span ng-show="form[fieldName].$error.message">{{form[fieldName].$error.message}}</span></label>',
template: '<label class="Form-label Form-offset">{{name}}: <span ng-show="message">{{message}}</span></label>',
scope: {
form: '=',
displayName: '@',
fieldName: '@'
name: '@displayName'
},
link: function(scope, element, attr) {
var fieldName = attr.fieldName;
scope.message = undefined;
scope.$on("form:api-error", function (event, httpErrors) {
if (httpErrors.data.errors && fieldName in httpErrors.data.errors) {
scope.message = httpErrors.data.errors[fieldName];
}
});
scope.$on("form:reset", function (event) {
scope.message = undefined;
});
}
};
}]);
......@@ -70,9 +58,7 @@ MetabaseForms.directive('mbFormMessage', [function () {
restrict: 'E',
replace: true,
template: '<span class="px2" ng-class="{\'text-success\': error === false, \'text-error\': error === true}" ng-if="visible" cv-delayed-call="reset()">{{message}}</span>',
scope: {
form: '='
},
scope: {},
link: function(scope, element, attr) {
var setMessage = function (msg, isError) {
......@@ -87,14 +73,28 @@ MetabaseForms.directive('mbFormMessage', [function () {
scope.error = undefined;
};
scope.$on("form:error", function (event, message) {
setMessage(message, true);
// notification of api error
scope.$on("form:api-error", function (event, httpErrors) {
if (httpErrors.data.message) {
setMessage(httpErrors.data.message, true);
} else if (httpErrors.status === 500) {
// generic 500 without a specific message
setMessage("Server error encountered", true);
}
});
scope.$on("form:success", function (event, message) {
// notification of api success
scope.$on("form:api-success", function (event, message) {
setMessage(message, false);
});
// notification of form state reset
scope.$on("form:reset", function (event) {
scope.reset();
});
// start from base state
scope.reset();
}
......
......@@ -32,8 +32,8 @@ OrganizationControllers.controller('OrganizationListController', ['$scope', 'Org
}
]);
OrganizationControllers.controller('OrganizationDetailController', ['$scope', '$routeParams', '$location', 'Organization', 'MetabaseForm',
function($scope, $routeParams, $location, Organization, MetabaseForm) {
OrganizationControllers.controller('OrganizationDetailController', ['$scope', '$routeParams', '$location', 'Organization',
function($scope, $routeParams, $location, Organization) {
$scope.organization = undefined;
......@@ -51,12 +51,12 @@ OrganizationControllers.controller('OrganizationDetailController', ['$scope', '$
// provide a relevant save() function
$scope.save = function(organization) {
MetabaseForm.clearFormErrors($scope.form);
$scope.$broadcast("form:reset");
Organization.update(organization, function (org) {
$scope.organization = org;
$scope.$broadcast("form:success", "Successfully saved!");
$scope.$broadcast("form:api-success", "Successfully saved!");
}, function (error) {
MetabaseForm.parseFormErrors($scope.form, error);
$scope.$broadcast("form:api-error", error);
});
};
......@@ -66,12 +66,12 @@ OrganizationControllers.controller('OrganizationDetailController', ['$scope', '$
// provide a relevant save() function
$scope.save = function(organization) {
MetabaseForm.clearFormErrors($scope.form);
$scope.$broadcast("form:reset");
Organization.create(organization, function (org) {
$scope.$broadcast("form:success", "Successfully saved!");
$scope.$broadcast("form:api-success", "Successfully saved!");
$location.path('/superadmin/organization/' + org.id);
}, function (error) {
MetabaseForm.parseFormErrors($scope.form, error);
$scope.$broadcast("form:api-error", error);
});
};
}
......
......@@ -10,25 +10,25 @@
<!-- form -->
<div class="Grid-cell Cell--2of3">
<form class="Form-new bordered rounded shadowed" name="form" novalidate>
<div class="Form-field" ng-class="{'Form--fieldError': form.slug.$error.message !== undefined}">
<mb-form-label form="form" display-name="Slug" field-name="slug"></mb-form-label>
<div class="Form-field" mb-form-field="slug">
<mb-form-label display-name="Slug" field-name="slug"></mb-form-label>
<input class="Form-input Form-offset full" name="slug" placeholder="A short name to go in URLs" ng-model="organization.slug" ng-disabled="organization.id" required />
</div>
<div class="Form-field" ng-class="{'Form--fieldError': form.name.$error.message !== undefined}">
<mb-form-label form="form" display-name="Name" field-name="name"></mb-form-label>
<div class="Form-field" mb-form-field="name">
<mb-form-label display-name="Name" field-name="name"></mb-form-label>
<input class="Form-input Form-offset full" name="name" placeholder="What is the name of your organization?" ng-model="organization.name" required autofocus />
<span class="Form-charm"></span>
</div>
<div class="Form-field" ng-class="{'Form--fieldError': form.description.$error.message !== undefined}">
<mb-form-label form="form" display-name="Description" field-name="description"></mb-form-label>
<div class="Form-field" mb-form-field="description">
<mb-form-label display-name="Description" field-name="description"></mb-form-label>
<input class="Form-input Form-offset full" name="description" placeholder="What else should people know about this org?" ng-model="organization.description" />
<span class="Form-charm"></span>
</div>
<div class="Form-field" ng-class="{'Form--fieldError': form.logo_url.$error.message !== undefined}">
<mb-form-label form="form" display-name="Logo url" field-name="logo_url"></mb-form-label>
<div class="Form-field" mb-form-field="logo_url">
<mb-form-label display-name="Logo url" field-name="logo_url"></mb-form-label>
<input class="Form-input Form-offset full" name="logo_url" placeholder="Link to an image of your logo" ng-model="organization.logo_url" />
<span class="Form-charm"></span>
</div>
......@@ -37,7 +37,7 @@
<button class="Button" ng-class="{'Button--primary': form.$valid}" ng-click="save(organization)" ng-disabled="!form.$valid">
Save
</button>
<mb-form-message form="form"></mb-form-message>
<mb-form-message></mb-form-message>
</div>
</form>
</div>
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment