Ember nested dynamic forms - ember.js

I'm new to Ember.js but I decided to try it for my task.
The task is to make a dynamic form builder: user should be able to add boxes with names and then insert field configs (which are forms) into that boxes.
Field configs are editable and they should be saved after edit.
In the backend I use Rails+AMS+Mongo and the data structure looks like that:
Company has one UsersProfileConfig
UsersProfileConfig has many BoxConfigs
BoxConfig has many FieldConfigs
In Ember I've already created models for BoxConfigs and FieldConfigs and basic routes for them.
Now I feel stuck and don't know what to do next and whether it was a good idea to use Ember for that.
Could anyone suggest me workflow or next development steps?

Related

Adding a new section in Mezzanine CMS (Django) admin

I'm totally new to Mezzanine CMS. I got handed a site to work with and so far I've been able to do all the changes without problem. I've run across a problem in which they want a new section in the home page. I go to the admin section to edit the home page, but there is no extra content field.
On the home page, I see 4 sections "content" "priorities" "testimonials" and "clients". I would like to have another "content" area as a 5th section. How do I go on and add this section? I'm totally new to Django but would be appreciative if someone could explain or point in the right direction.
Here is a link to an image for reference.
https://imgur.com/a/sUKOtvS
Thanks in advance
The homepage content would be backed by a Django model with attributes for the partners and testimonial fields. You'll need to find the Python class for this model in your code base (you could search for those field names), and you'll need to add a new attribute for the new section you need.
Django and Mezzanine have lots of different field types you can use for these attributes, so consult their respective documentation for how those work (Django's are a lot more comprehensive, so start there).
Once you've done that, you'll need to create a database migration for the new attribute - that adds the field to the database table that will store the actual content, again consult the Django documentation for how these work.
Finally you may need to add the new field to the Admin class, which is the Python class (similar to the model) that controls which fields appear in the admin interface, and how they appear. I say "may" as these generally appear automatically without any code, but if things have been modified to a certain extent, you may need to do this manually.

Ruby on rails - Add multiple record from new action

In my application I have Domain model that have these columns: name, link, description.
Currently my application works as I can only add one domain at a time (from new action). What I am looking for is to be able to add as many domains as I want from the same form/page.
I have used nested_forms before but usually its nested_attributes for another model.
How am I able to have nested_forms for same model or if there is any other way?
This can be done, but not in a RESTful way. There are some hacks to do it, But I don't recommend and best way would be to do associations and adding nested_attributes to it.

Ember application with an admin site

I'm creating a basic Ember application. I am trying to set up a backend that stores posts. I would like to have a system where I can go to some admin site that has a form that has all the fields for a post that allows me to add, update, and delete posts. For example, if I have a Post model with attributes like Title, Contents, Date_created, and Image, I would like to have these fields in a form in some kind of admin site.
One example from a past tutorial I have done is the Django admin site. Is it possible to set up a Django backend for my Ember app? The Django admin is here: (scroll to bottom)
https://docs.djangoproject.com/en/1.10/intro/tutorial02/
I know that asking how to set up a backend for my Ember application is a very general question, but I am confused as to where to start. I have already created a Post model with various attributes. I can create an Ember route that is a form to add a post, but then there comes authentication for that which I'm not really sure how to deal with either. That's why I came to Django because I remember they had a very nice admin site.
If it is not feasible to use Django to accomplish this, what are some other routes I can take to be able to get to some admin page where I can manipulate records and add new data to my website?
This is a pretty big question, but I feel your pain. Most tutorials are all, "so... just build out a rails app... or use all this long lost stubbing stuff... or here's a super outdated node server on github to use."
I would suggest breaking it down into pieces. Ember is really great, but–Yes–you need a backend. You could make a backend with Django(python), Rails(ruby), WordPress(PHP) + ember-wordpress, express or hapi(node), phoenix(elixir)- or really anything that will generate an API. You could also build an admin with Ember and then use that to send data to a service like parse or firebase. Those could get you an MVP while you learn more about how to build out a traditional back-end.
Django + http://www.django-rest-framework.org has a pretty great admin setup that builds out the admin and fields from your API specifications. I can see why people like it.
I would also mention, that ember-cli-mirage is great when you aren't sure what backend you'll have, but you need to have a mock-server to build off of.
If you can, choose something that will spit out an API with jsonAPI.
I would split this into 2 parts.
build out an Ember app with Mirage or some other temporary data.
build a back-end somehow.
Then you can connect them ~ without being stuck beforehand.
Good luck!
So pretty much a blog site where only person can create/delete/edit posts? If so then all you have to do is create a user with a predefined username and password in your Django app. You login through your Ember app. For this protected view you will need to use ember-simple-auth, which is the simplest way to implement something like this. Google ember-simple-auth and run its dummy app to see what they are doing.

Reuse ember controller for two routes, but pre populate part of model on one of the routes

Lets say we were modelling repositories in an app. We would want to be able to see all of our repo's at /repos/.
We can create a repo at /repos/create. In our model a repo has a owner (user), going down this route I would want my first form field in my create.hbs template to be selecting a user.
But it may also make sense to create a repo through viewing a user at /users/userId/repos, and then perhaps the route being /users/userId/repos/create. The difference here would be that the first field of my form would have the user pre populated.
I know that I can reuse the same controller by specifying this in my route:
controllerName: 'repos/create'
(what would the ember generate statement/ the place to put this route in my folder structure be, for this complex route?)
But how would I pass in the user to the repos/create controller?
The comment by #Artych provided the best way to do this currently, so to expand on this.
In the end I created a repo-create component that may or may not be passed a user object. The logic for handling what to pre-populate can then be set in the logic of the component itself.
After this is was simply a case of having a one line template at both /repos/create.hbs and /user/repos/create.hbs, with the component.
I then followed the approach of using my user as my model in the routes/user/repos/create.js route and passing it to the component in my template as
{{repo-create user=model}}
With this approach I avoided doing anything explicitly on controllers, and moving up to Ember 2.x will be alot less painful.

Django Rest/Ember How to connect to models

I am getting started with Ember, and Django Rest Framework and I can't seem to peice together how to connect a model so that Ember can use the data in that model and create a simple drop down box. I have one model that I am starting with that is as such:
id
name
security
status
All I want to achieve is allowing Ember to use the data in this model and create a dropdown like so.
<select id="model">
<option value="model.ID">model.Name</option>
</select>
Can anyone help me with this? I am complete new to Ember and Django Rest.
Without going into a ton of detail, I've created a mini example of what you're looking for
http://emberjs.jsbin.com/Ozimatuj/2/edit
You'll note that I'm using mockjax, so instead of hitting any real endpoint, it's all mocked. Additionally I'd recommend using a client side record management solution (such as ember-data or ember-model). That's another discussion though.
In the application route (which correlates with the root of your app) it hits the model hook (which should return the model associated with that route. I'm returning a POJO of the users. That model is being assigned as the content of the application controller (automatically generated). The the application template is being built, and it's being backed by the application controller. Inside the application template we create an instance of ember select, and we tell it that the content backing it is model (which is the model/content in the application controller). We also say, use bind the user model (you could do id) and the name to the value and the label respectively.
I then bound the value of the select to selectedPerson, so anytime the value changes, the selectedPerson updates, the template which talks about that person will update. Magic. Ember does the rest.
This is a really broad question, so if you have any other questions, please ask a specific question, and I'd really recommend going through the getting started guide, it's really short, but will give you a decent foundation of terminology and methodology of Ember. http://emberjs.com/guides/getting-started/
For Ember Data I'd do a quick read the of the transition document for ED 1.0 beta.
https://github.com/emberjs/data/blob/master/TRANSITION.md
DS.DjangoRESTSerializer = DS.RESTSerializer.extend();
DS.DjangoRESTAdapter = DS.RESTAdapter.extend({
defaultSerializer: "DS/djangoREST"
});