StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POBackbone: Using a form to save model, as well as model relationship into the database
text
Body
copied!<p>I have been struggling with a form in one of my Backbone views. This form is supposed to save the information for a project model (e.g. project name, project description, project members). While the project-specific information is saved without any issues into the corresponding database table, I did not manage to save the project-user relationships in a joint database table (projects_users, contains the corresponding ids for the two entities). The users that can be added to the project in the form are already present in the database, so nothing needs to be added into the users database table.</p> <p>Could anyone put me on the right track here? I tried learning about relations in Backbone. These are two of the links that I have already looked into, but could not translate their content into a solution:</p> <p><a href="https://github.com/PaulUithol/Backbone-relational" rel="nofollow">Backbone-relational</a></p> <p><a href="http://www.skalb.com/2012/04/23/how-to-easily-handle-model-relationships-in-rails-and-backbone-js/" rel="nofollow">Model relationships in Rails and Backbone</a></p> <p>Thank you, Alexandra</p> <p>EDIT</p> <p>It was suggested that some code from my side would be useful. Since I do not have a good understanding of what I need to do, my code is pretty much a mess right now ... but let me try.</p> <p>My form view:</p> <pre><code>App.Views.Projects.Common.Form = Backbone.View.extend({ ... submitted: function(formElement) { var newData = this.serializeFormData(formElement); this.model = new App.Models.Project({ name : newData.name, description : newData.description // Somehow put the users array associated with the project here ... }); this.saveFormData(newData); return false; }, serializeFormData: function(formElement) { var fields = formElement.serializeArray(); var serializedData = {}; $.each(fields, function(index, field) { serializedData[field.name] = field.value; }); return serializedData; }, saveFormData: function(newData) { var project = this.model; // placeholder for the users that would be associated with the project // parsing of the data from the form is required to get a corresponding array of user models var users = App.users; project.attributes.users = users; // this line should save the project to the database table and the project-users relationships // in the projects_users table; it needs the success and error functions project.save({}, {}); }, ... }) </code></pre> <p>For the project and user model files, I was thinking along these lines:</p> <pre><code>App.Models.Project = Backbone.RelationalModel.extend({ urlRoot: '/projects', // Default attributes for the project. defaults: { description: "", users: [] }, relations: [{ type : Backbone.HasMany, key : 'users', relatedModel : 'App.Models.User' }] }); App.Models.User = Backbone.RelationalModel.extend({ getId: function() { return this.get('id'); }, getName: function() { return this.get('name'); }, getEmail: function() { return this.get('email'); } }); </code></pre>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload