# How to create a custom Ember.TextField with Handlebars helper?

**URL:** <https://discuss.emberjs.com/t/how-to-create-a-custom-ember-textfield-with-handlebars-helper/6725>\
**Category:** Uncategorized\
**Created:** [November 17, 2014, 1:08pm UTC](https://discuss.emberjs.com/t/how-to-create-a-custom-ember-textfield-with-handlebars-helper/6725 "2014-11-17T13:08:16Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![dennismende](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/dennismende/32/9958_2.png) [@dennismende](https://discuss.emberjs.com/u/dennismende)\
**Post date:** [November 17, 2014, 1:08pm UTC](https://discuss.emberjs.com/t/how-to-create-a-custom-ember-textfield-with-handlebars-helper/6725/1 "2014-11-17T13:08:16Z")

</div>

Hi,

I want to create a custom Ember.TextField with a Handlebars helper. Looks like this:

```
import Ember from 'ember';

export function attributeView( input, options ) {

  var viewDef = Ember.TextField.extend({});
  var view = viewDef.create();

  return Ember.Handlebars.helpers.view.call( this, view, options );
};

export default Ember.Handlebars.makeBoundHelper(attributeView);

```

With this I get the following error:

Uncaught TypeError: Cannot read property ‘pushChildView’ of null vendor.js:53216merge.appendChild vendor.js:53216CoreView.extend.appendChild vendor.js:55003EmberObject.create.helper vendor.js:21706viewHelper vendor.js:21933attributeView rpcfe-embercli/helpers/attribute-view.js:31bindView.normalizedValue vendor.js:19342SimpleHandlebarsView.render vendor.js:22294EmberRenderer\_createElement vendor.js:51582Renderer\_renderTree vendor.js:22684(anonymous function) vendor.js:22761DeferredActionQueues.invoke vendor.js:12735DeferredActionQueues.flush vendor.js:12805Backburner.end vendor.js:12191Backburner.run vendor.js:12246run vendor.js:30279hash.success vendor.js:69626fire vendor.js:3191self.fireWith vendor.js:3303done vendor.js:8369(anonymous function) vendor.js:8716

---

<div class="post-metadata">

**Author:** ![rwjblue](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/rwjblue/32/9411_2.png) [@rwjblue](https://discuss.emberjs.com/u/rwjblue)\
**Post date:** [November 17, 2014, 1:23pm UTC](https://discuss.emberjs.com/t/how-to-create-a-custom-ember-textfield-with-handlebars-helper/6725/2 "2014-11-17T13:23:39Z")

</div>

You cannot push child views (which is what calling `Ember.Handlebars.helpers.view` is doing) from `makeBoundHelper`.

It is highly likely that this should be a component instead of a helper.

---

<div class="post-metadata">

**Author:** ![dennismende](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/dennismende/32/9958_2.png) [@dennismende](https://discuss.emberjs.com/u/dennismende)\
**Post date:** [November 17, 2014, 2:46pm UTC](https://discuss.emberjs.com/t/how-to-create-a-custom-ember-textfield-with-handlebars-helper/6725/3 "2014-11-17T14:46:10Z")

</div>

Ah ok, thank you. Then I need another way. Perhaps someone can give me a hint:

I have several attribute-model-objects with a type property. Based on the type property I want to decide which (view/component) should be rendered.

```
If property is "input":
  create input-(view/component)
else if property is "textarea":
  create textarea-(view/component)

```
