Data Generating Upon Load

1

I have several forms and whenever I load the page to the form, the corresponding data model populates “null” and “undefined” without ever entering any information. For example, a login form generates a “user” dataset upon loading the server. Anybody have this issue before? Is there something I’m missing or need to get rid of?

2

How are you binding the values to the template? Also is the dataset a record or a plain javascript object?

3

Yes, sorry I decided to forego the template… It is being generated with “ember-legit-forms”. Here is my code below: (Also, any advice on how to create a confirmpassword validation would be greatly appreciated, but this is more pressing for me…THANKS)

app/components/signup-form

import Ember from 'ember';
"Ember.Component.extend"

 const { 
    Component, String: { w }, isEmpty, set
   } = Ember;

export default Ember.Component.extend({

saved: false,
classNames: ['container', 'form'], //creates the class 

	rules: {
	sharedValidations: {
  	required: w('email firstName lastName userName confirmPassword') 
  	
 },
 email: 'email',
password: {
    required: true,
    between: [4,16],
	password(value) {
 	if(isEmpty(value)) return "can't be blank";
 	const { score } = zxcvbn(value); 
 	if (score < 3) return 'too weak';

} }, actions: { submit() { set(this, ‘saved’, true);

 	}
}

});

app/model/signup.js

 import DS from 'ember-data';

 export default DS.Model.extend({
firstName: DS.attr(),
 lastName: DS.attr(),
  username: DS.attr(),
  email: DS.attr(),
 password: DS.attr(),
 confirmPassword: DS.attr()
});

route/signup.js

 import Ember from 'ember';

  export default Ember.Route.extend({
model() {
return this.get('store').createRecord('signup');
}
});

app/adapter/application.js

 import DS from 'ember-data';

  export default DS.JSONAPIAdapter.extend({
namespace: 'api',

 });

app/template/component.js (connects to template)

 {{#lf-form id="signUp" rules=rules 
onSubmit=(action "submit")
as |validate isValid|}}
{{lf-input
	name="firstName"
	label='First Name:'
	property=model.firstName
	on-update=(action (mut model.firstName))
	validate=validate
}}
{{lf-input
	name="lastName"
	label="Last Name:"
	property=model.lastName
	on-update=(action (mut model.lastName))
	validate=validate
}}	
{{lf-input
	name="userName"
	label="Username:"
	property=model.userName
	on-update=(action (mut model.userName))
	validate=validate
}}
{{lf-input
	name="email"
	label="Email:"
	type="email"
	property=model.email
	on-update=(action (mut model.email))
	validate=validate
}}
{{lf-input
	name="password"
	label="Password:"
	type="password"
	labelComponent="custom-label"
	property=model.password
	on-update=(action (mut model.password))
	validate=validate
}}
{{lf-input
	label="Confirm Password:"
	property=model.confirmPassword
	name="confirmPassword"
	type="password"
	on-update=(action (mut model.confirmPassword))
	validate=validate
}}  


{{#link-to 'login'}}<button class="btn btn-primary" disabled={{not isValid}}>
		Continue
	</button> {{/link-to}}

 {{#if saved}}
 <div class="alert alert-info">
 	Information Logged
 </div>
 {{/if}}

{{/lf-form}}
4

Sorry I’m not familiar with that package your using, what do you mean by it generates the template for you? I created a quick ember twiddle here but I don’t see how you can hook it together without the template file.