# Data Generating Upon Load

**URL:** <https://discuss.emberjs.com/t/data-generating-upon-load/13701>\
**Category:** Uncategorized\
**Created:** [October 5, 2017, 3:19pm UTC](https://discuss.emberjs.com/t/data-generating-upon-load/13701 "2017-10-05T15:19:25Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![bw70316](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/bw70316/32/13394_2.png) [@bw70316](https://discuss.emberjs.com/u/bw70316)\
**Post date:** [October 5, 2017, 3:19pm UTC](https://discuss.emberjs.com/t/data-generating-upon-load/13701/1 "2017-10-05T15:19:25Z")

</div>

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?

---

<div class="post-metadata">

**Author:** ![James-Byrne](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/james-byrne/32/17391_2.png) [@James-Byrne](https://discuss.emberjs.com/u/James-Byrne)\
**Post date:** [October 5, 2017, 3:24pm UTC](https://discuss.emberjs.com/t/data-generating-upon-load/13701/2 "2017-10-05T15:24:07Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![bw70316](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/bw70316/32/13394_2.png) [@bw70316](https://discuss.emberjs.com/u/bw70316)\
**Post date:** [October 6, 2017, 12:29pm UTC](https://discuss.emberjs.com/t/data-generating-upon-load/13701/3 "2017-10-06T12:29:32Z")

</div>

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}}

```

---

<div class="post-metadata">

**Author:** ![James-Byrne](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/james-byrne/32/17391_2.png) [@James-Byrne](https://discuss.emberjs.com/u/James-Byrne)\
**Post date:** [October 6, 2017, 3:33pm UTC](https://discuss.emberjs.com/t/data-generating-upon-load/13701/4 "2017-10-06T15:33:09Z")

</div>

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](https://ember-twiddle.com/?openFiles=templates.components.my-component.hbs%2Ctemplates.components.my-component.hbs) but I don’t see how you can hook it together without the template file.