Foodee/ember-foxy-forms

Customization to make it work with other projects(Suggestions)

Opened this issue · 5 comments

wellington1993 commented

Hi, i like the ember-foxy-forms.

But I have some doubts to make the add-on works in some projects.
For example:

  • Translations (Buttons like submit)
  • html customizations in fields... Like put HTML validations
  • HTML5 validations.
  • Support for existing validator for ember.
  • Ways to load the options from Ember Data promise. Customizing the options using some attribute by name.

My use case is, an form using Ember Data and Ember Octane with Glimmer.
In that scenario I want to pass an "Ember.store.find" promise to the template using component tracked attribute.
And use the tracked attribute with Ember Store find promise as combo select options, instead use simple hash.

Could someone help me with that? I tried many many other form add-ons but can't do that things.
@joegaudet @abeforgit

Thanks.

joegaudet commented

Hey @wellington1993,

Translations (Buttons like submit)

Depending on which library you use, you can easily pass translations to the buttons one of two ways.

<Form as |f|>
  <f.submit @text={{t "hello.world"}}/>
  <f.submit>
     {{t "hello.world"}}
  </f.submit>
</Form>

html customizations in fields... Like put HTML validations
You can yield the controls an add HTML validations like so

<Form as |f|>
  <f.field @for='field-path' @using='input' as |ff|>
     <ff.control max=1 />
  </f.field>
</Form>

HTML5 validations.
See above

Support for existing validator for ember.
We currently support ember-model-validations out of the box.

https://foodee.github.io/ember-foxy-forms/docs/forms#value-error-mapping

Ways to load the options from Ember Data promise. Customizing the options using some attribute by name.
You can use https://github.com/fivetanley/ember-promise-helpers or async await helpers to accomplish this out of the box.

<Form @for={{this.model}} as |f|>
  <f.field @for="property" @values={{await this.promise}} />
</Form>

You can also adapt something like ember-model-select fairly easily check the section here on custom controls.

https://foodee.github.io/ember-foxy-forms/docs/controls

  • ❤️1
wellington1993 commented

Nice help @joegaudet!

I will try that suggestions and try to adapt the ember-model-select with the custom controls.

Thanks!

joegaudet commented
  • 👀1
wellington1993 commented

@joegaudet Sorry, I can't do that, and it's too sad.
Appears to be simple, but I don't know Ember.js enough to do that.
I'm trying to search help...

At same start point here, I will still trying to do that.

Thanks!

We’ve done it on a private project, it’s fairly straight forward if you wrap it in a template only component.
On Thu, Dec 3, 2020 at 3:15 AM Wellington Torrejais da Silva < @.***> wrote: Nice help @joegaudet https://github.com/joegaudet! I will try that suggestions and try to adapt the ember-model-select with the custom controls. Thanks! — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#90 (comment)>, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAA6IB2QHOKHRWZRVVK7DTDSS5XLPANCNFSM4UK7SVXA .
-- P.S. - Check out https://try.food.ee/local-food-company-culture why we're proud to deliver local food that makes a difference.
…
-- Local Food. Company Culture. Joe Gaudet | Director of Software Development Direct: 778.994.4846 Office: 1.844.836.6333 http://www.food.ee?utm_campaign=Email%20Signature&utm_medium=email&utm_source=Signature&utm_content=HQ&utm_term=Website

joegaudet commented