Using standing_order_form.$submitted for show/hide logic for angularjs form errors

This commit is contained in:
Rob Harrington
2017-03-08 16:18:19 +11:00
parent 001f329393
commit 834e5b702e
5 changed files with 27 additions and 27 deletions

View File

@@ -1,5 +1,4 @@
angular.module("admin.standingOrders").controller "AddressController", ($scope, $filter, StatusMessage, availableCountries) ->
$scope.submitted = false
$scope.countries = availableCountries
$scope.statesFor = (country_id) ->
return [] unless country_id
@@ -8,14 +7,14 @@ angular.module("admin.standingOrders").controller "AddressController", ($scope,
$scope.shipStates = $scope.statesFor($scope.standingOrder.ship_address.country_id)
$scope.registerNextCallback 'address', ->
$scope.submitted = true
$scope.standing_order_form.$submitted = true
if $scope.standing_order_address_form.$valid
$scope.standing_order_form.$setPristine()
StatusMessage.clear()
$scope.setView('products')
else
StatusMessage.display 'failure', t('admin.standing_orders.details.invalid_error')
$scope.registerBackCallback 'address', ->
StatusMessage.clear()
$scope.setView('details')

View File

@@ -1,9 +1,8 @@
angular.module("admin.standingOrders").controller "DetailsController", ($scope, StatusMessage) ->
$scope.submitted = false
$scope.registerNextCallback 'details', ->
$scope.submitted = true
$scope.standing_order_form.$submitted = true
if $scope.standing_order_details_form.$valid
$scope.standing_order_form.$setPristine()
StatusMessage.clear()
$scope.setView('address')
else

View File

@@ -1,6 +1,8 @@
angular.module("admin.standingOrders").controller "ProductsController", ($scope, StatusMessage) ->
$scope.registerNextCallback 'products', ->
$scope.standing_order_form.$submitted = true
if $scope.standingOrder.standing_line_items.length > 0
$scope.standing_order_form.$setPristine()
StatusMessage.clear()
$scope.setView('review')
else

View File

@@ -5,42 +5,42 @@
.field
%label{ for: 'bill_address_firstname'}= t(:first_name)
%input.fullwidth#bill_address_firstname{ name: 'bill_address_firstname', type: 'text', required: true, ng: { model: "standingOrder.bill_address.firstname" } }
.error{ ng: { show: 'submitted && standing_order_address_form.bill_address_firstname.$error.required' } }= t(:error_required)
.error{ ng: { show: 'standing_order_form.$submitted && standing_order_address_form.bill_address_firstname.$error.required' } }= t(:error_required)
.error{ ng: { repeat: "error in errors['bill_address.firstname']", show: 'standing_order_address_form.bill_address_firstname.$pristine' } } {{ error }}
.field
%label{ for: 'bill_address_lastname'}= t(:last_name)
%input.fullwidth#bill_address_lastname{ name: 'bill_address_lastname', type: 'text', required: true, ng: { model: "standingOrder.bill_address.lastname" } }
.error{ ng: { show: 'submitted && standing_order_address_form.bill_address_lastname.$error.required' } }= t(:error_required)
.error{ ng: { show: 'standing_order_form.$submitted && standing_order_address_form.bill_address_lastname.$error.required' } }= t(:error_required)
.error{ ng: { repeat: "error in errors['bill_address.lastname']", show: 'standing_order_address_form.bill_address_lastname.$pristine' } } {{ error }}
.field
%label{ for: 'bill_address_address1'}= t(:address)
%input.fullwidth#bill_address_address1{ name: 'bill_address_address1', type: 'text', required: true, ng: { model: "standingOrder.bill_address.address1" } }
.error{ ng: { show: 'submitted && standing_order_address_form.bill_address_address1.$error.required' } }= t(:error_required)
.error{ ng: { show: 'standing_order_form.$submitted && standing_order_address_form.bill_address_address1.$error.required' } }= t(:error_required)
.error{ ng: { repeat: "error in errors['bill_address.address1']", show: 'standing_order_address_form.bill_address_address1.$pristine' } } {{ error }}
.field
%label{ for: 'bill_address_city'}= t(:suburb)
%input.fullwidth#bill_address_city{ name: 'bill_address_city', type: 'text', required: true, ng: { model: "standingOrder.bill_address.city" } }
.error{ ng: { show: 'submitted && standing_order_address_form.bill_address_city.$error.required' } }= t(:error_required)
.error{ ng: { show: 'standing_order_form.$submitted && standing_order_address_form.bill_address_city.$error.required' } }= t(:error_required)
.error{ ng: { repeat: 'error in errors.bill_address.city', show: 'standing_order_address_form.bill_address_city.$pristine' } } {{ error }}
.field
%label{ for: "bill_address_zipcode"}= t(:postcode)
%input.fullwidth#bill_address_zipcode{ name: 'bill_address_zipcode', type: 'text', required: true, ng: { model: "standingOrder.bill_address.zipcode" } }
.error{ ng: { show: 'submitted && standing_order_address_form.bill_address_zipcode.$error.required' } }= t(:error_required)
.error{ ng: { show: 'standing_order_form.$submitted && standing_order_address_form.bill_address_zipcode.$error.required' } }= t(:error_required)
.error{ ng: { repeat: 'error in errors.bill_address.zipcode', show: 'standing_order_address_form.bill_address_zipcode.$pristine' } } {{ error }}
.field
%label{ for: "bill_address_phone"}= t(:phone)
%input.fullwidth#bill_address_phone{ name: 'bill_address_phone', type: 'text', required: true, ng: { model: "standingOrder.bill_address.phone" } }
.error{ ng: { show: 'submitted && standing_order_address_form.bill_address_phone.$error.required' } }= t(:error_required)
.error{ ng: { show: 'standing_order_form.$submitted && standing_order_address_form.bill_address_phone.$error.required' } }= t(:error_required)
.error{ ng: { repeat: 'error in errors.bill_address.phone', show: 'standing_order_address_form.bill_address_phone.$pristine' } } {{ error }}
.field
%label{ for: "bill_address_country_id"}= t(:country)
%input.ofn-select2.fullwidth#bill_address_country_id{ name: 'bill_address_country_id', type: 'number', data: 'countries', required: true, placeholder: t('admin.choose'), ng: { model: 'standingOrder.bill_address.country_id' } }
.error{ ng: { show: 'submitted && standing_order_address_form.bill_address_country_id.$error.required' } }= t(:error_required)
.error{ ng: { show: 'standing_order_form.$submitted && standing_order_address_form.bill_address_country_id.$error.required' } }= t(:error_required)
.error{ ng: { repeat: 'error in errors.bill_address.country', show: 'standing_order_address_form.bill_address_country_id.$pristine' } } {{ error }}
.field
%label{ for: "bill_address_state_id"}= t(:state)
%input.ofn-select2.fullwidth#bill_address_state_id{ name: 'bill_address_state_id', type: 'number', data: 'billStates', required: true, placeholder: t('admin.choose'), ng: { model: 'standingOrder.bill_address.state_id' } }
.error{ ng: { show: 'submitted && standing_order_address_form.bill_address_state_id.$error.required' } }= t(:error_required)
.error{ ng: { show: 'standing_order_form.$submitted && standing_order_address_form.bill_address_state_id.$error.required' } }= t(:error_required)
.error{ ng: { repeat: 'error in errors.bill_address.state', show: 'standing_order_address_form.bill_address_state_id.$pristine' } } {{ error }}
@@ -54,40 +54,40 @@
.field
%label{ for: 'ship_address_firstname'}= t(:first_name)
%input.fullwidth#ship_address_firstname{ name: 'ship_address_firstname', type: 'text', required: true, ng: { model: "standingOrder.ship_address.firstname" } }
.error{ ng: { show: 'submitted && standing_order_address_form.ship_address_firstname.$error.required' } }= t(:error_required)
.error{ ng: { show: 'standing_order_form.$submitted && standing_order_address_form.ship_address_firstname.$error.required' } }= t(:error_required)
.error{ ng: { repeat: "error in errors['ship_address.firstname']", show: 'standing_order_address_form.ship_address_firstname.$pristine' } } {{ error }}
.field
%label{ for: 'ship_address_lastname'}= t(:last_name)
%input.fullwidth#ship_address_lastname{ name: 'ship_address_lastname', type: 'text', required: true, ng: { model: "standingOrder.ship_address.lastname" } }
.error{ ng: { show: 'submitted && standing_order_address_form.ship_address_lastname.$error.required' } }= t(:error_required)
.error{ ng: { show: 'standing_order_form.$submitted && standing_order_address_form.ship_address_lastname.$error.required' } }= t(:error_required)
.error{ ng: { repeat: "error in errors['ship_address.lastname']", show: 'standing_order_address_form.ship_address_lastname.$pristine' } } {{ error }}
.field
%label{ for: 'ship_address_address1'}= t(:address)
%input.fullwidth#ship_address_address1{ name: 'ship_address_address1', type: 'text', required: true, ng: { model: "standingOrder.ship_address.address1" } }
.error{ ng: { show: 'submitted && standing_order_address_form.ship_address_address1.$error.required' } }= t(:error_required)
.error{ ng: { show: 'standing_order_form.$submitted && standing_order_address_form.ship_address_address1.$error.required' } }= t(:error_required)
.error{ ng: { repeat: "error in errors['ship_address.address1']", show: 'standing_order_address_form.ship_address_address1.$pristine' } } {{ error }}
.field
%label{ for: 'ship_address_city'}= t(:suburb)
%input.fullwidth#ship_address_city{ name: 'ship_address_city', type: 'text', required: true, ng: { model: "standingOrder.ship_address.city" } }
.error{ ng: { show: 'submitted && standing_order_address_form.ship_address_city.$error.required' } }= t(:error_required)
.error{ ng: { show: 'standing_order_form.$submitted && standing_order_address_form.ship_address_city.$error.required' } }= t(:error_required)
.error{ ng: { repeat: 'error in errors.ship_address.city', show: 'standing_order_address_form.ship_address_city.$pristine' } } {{ error }}
.field
%label{ for: "ship_address_zipcode"}= t(:postcode)
%input.fullwidth#ship_address_zipcode{ name: 'ship_address_zipcode', type: 'text', required: true, ng: { model: "standingOrder.ship_address.zipcode" } }
.error{ ng: { show: 'submitted && standing_order_address_form.ship_address_zipcode.$error.required' } }= t(:error_required)
.error{ ng: { show: 'standing_order_form.$submitted && standing_order_address_form.ship_address_zipcode.$error.required' } }= t(:error_required)
.error{ ng: { repeat: 'error in errors.ship_address.zipcode', show: 'standing_order_address_form.ship_address_zipcode.$pristine' } } {{ error }}
.field
%label{ for: "ship_address_phone"}= t(:phone)
%input.fullwidth#ship_address_phone{ name: 'ship_address_phone', type: 'text', required: true, ng: { model: "standingOrder.ship_address.phone" } }
.error{ ng: { show: 'submitted && standing_order_address_form.ship_address_phone.$error.required' } }= t(:error_required)
.error{ ng: { show: 'standing_order_form.$submitted && standing_order_address_form.ship_address_phone.$error.required' } }= t(:error_required)
.error{ ng: { repeat: 'error in errors.ship_address.phone', show: 'standing_order_address_form.ship_address_phone.$pristine' } } {{ error }}
.field
%label{ for: "ship_address_country_id"}= t(:country)
%input.ofn-select2.fullwidth#ship_address_country_id{ name: 'ship_address_country_id', type: 'number', data: 'countries', required: true, placeholder: t('admin.choose'), ng: { model: 'standingOrder.ship_address.country_id' } }
.error{ ng: { show: 'submitted && standing_order_address_form.ship_address_country_id.$error.required' } }= t(:error_required)
.error{ ng: { show: 'standing_order_form.$submitted && standing_order_address_form.ship_address_country_id.$error.required' } }= t(:error_required)
.error{ ng: { repeat: 'error in errors.ship_address.country', show: 'standing_order_address_form.ship_address_country_id.$pristine' } } {{ error }}
.field
%label{ for: "ship_address_state_id"}= t(:state)
%input.ofn-select2.fullwidth#ship_address_state_id{ name: 'ship_address_state_id', type: 'number', data: 'shipStates', required: true, placeholder: t('admin.choose'), ng: { model: 'standingOrder.ship_address.state_id' } }
.error{ ng: { show: 'submitted && standing_order_address_form.ship_address_state_id.$error.required' } }= t(:error_required)
.error{ ng: { show: 'standing_order_form.$submitted && standing_order_address_form.ship_address_state_id.$error.required' } }= t(:error_required)
.error{ ng: { repeat: 'error in errors.ship_address.state', show: 'standing_order_address_form.ship_address_state_id.$pristine' } } {{ error }}

View File

@@ -4,33 +4,33 @@
.seven.columns.alpha.field
%label{ for: 'customer_id'}= t('admin.customer')
%input.ofn-select2.fullwidth#customer_id{ name: 'customer_id', type: 'number', data: 'customers', text: 'email', required: true, placeholder: t('admin.choose'), ng: { model: 'standingOrder.customer_id', disabled: 'standingOrder.id' } }
.error{ ng: { show: 'submitted && standing_order_details_form.customer_id.$error.required' } }= t(:error_required)
.error{ ng: { show: 'standing_order_form.$submitted && standing_order_details_form.customer_id.$error.required' } }= t(:error_required)
.error{ ng: { repeat: 'error in errors.customer', show: 'standing_order_details_form.customer_id.$pristine' } } {{ error }}
.two.columns  
.seven.columns.omega.field
%label{ for: 'schedule_id'}= t('admin.schedule')
%input.ofn-select2.fullwidth#schedule_id{ name: 'schedule_id', type: 'number', data: 'schedules', required: true, placeholder: t('admin.choose'), ng: { model: 'standingOrder.schedule_id', disabled: 'standingOrder.id' } }
.error{ ng: { show: 'submitted && standing_order_details_form.schedule_id.$error.required' } }= t(:error_required)
.error{ ng: { show: 'standing_order_form.$submitted && standing_order_details_form.schedule_id.$error.required' } }= t(:error_required)
.error{ ng: { repeat: 'error in errors.schedule', show: 'standing_order_details_form.schedule_id.$pristine'} } {{ error }}
.row
.seven.columns.alpha.field
%label{ for: 'payment_method_id'}= t('admin.payment_method')
%input.ofn-select2.fullwidth#payment_method_id{ name: 'payment_method_id', type: 'number', data: 'paymentMethods', required: true, placeholder: t('admin.choose'), ng: { model: 'standingOrder.payment_method_id' } }
.error{ ng: { show: 'submitted && standing_order_details_form.payment_method_id.$error.required' } }= t(:error_required)
.error{ ng: { show: 'standing_order_form.$submitted && standing_order_details_form.payment_method_id.$error.required' } }= t(:error_required)
.error{ ng: { repeat: 'error in errors.payment_method', show: 'standing_order_details_form.payment_method_id.$pristine' } } {{ error }}
.two.columns  
.seven.columns.omega.field
%label{ for: 'shipping_method_id'}= t('admin.shipping_method')
%input.ofn-select2.fullwidth#shipping_method_id{ name: 'shipping_method_id', type: 'number', data: 'shippingMethods', required: true, placeholder: t('admin.choose'), ng: { model: 'standingOrder.shipping_method_id' } }
.error{ ng: { show: 'submitted && standing_order_details_form.shipping_method_id.$error.required' } }= t(:error_required)
.error{ ng: { show: 'standing_order_form.$submitted && standing_order_details_form.shipping_method_id.$error.required' } }= t(:error_required)
.error{ ng: { repeat: 'error in errors.shipping_method', show: 'standing_order_details_form.shipping_method_id.$pristine' } } {{ error }}
.row
.seven.columns.alpha.field
%label{ for: 'begins_at'}= t('admin.begins_at')
%input.fullwidth#begins_at{ name: 'begins_at', type: 'text', placeholder: 'Select A Date', datepicker: 'standingOrder.begins_at', required: true, ng: { model: 'standingOrder.begins_at' } }
.error{ ng: { show: 'submitted && standing_order_details_form.begins_at.$error.required' } }= t(:error_required)
.error{ ng: { show: 'standing_order_form.$submitted && standing_order_details_form.begins_at.$error.required' } }= t(:error_required)
.error{ ng: { repeat: 'error in errors.begins_at', show: 'standing_order_details_form.begins_at.$pristine' } } {{ error }}
.two.columns  
.seven.columns.omega.field