Adding more, another loop to my Underscore template with a new backbone model?

问题

UPDATE :

I have got my code working, of sorts, but I have two issues and one problem I am not sure how to fix. I will post my current code below. One The Clients append to the right section within the TimesheetData template. But it wraps the option tag within the ClientData template within another option .

So I get :

 <select>
     <option> <option value="XX"> XXX </option> </option>
 </select>

Now I know this is what it is designed to do, to have a root element but I can not seem to find a solution to this issue, although it still works.

Now the other issue is that I need to select a default client, which is loaded into the Timesheet model, Timesheetrow.client_id holds what the database as saved for that row. I just not sure how to access this in an if statement or some other way within the client template.

Now the problem I have is that the Client data does not always load? So when I reload / refresh the page it sometimes lists all my clients in option tags, sometimes it loads nothing, just giving me an empty select tag. However when it does not load anything, I don't have any console log errors or anything?

All help most welcome :)

So this is my current Backbone code:

Client Data Code :

var ClientModel = Backbone.Model.extend({
    defaults: {
        Client: "",
    }
}); //End of ClientModel

var ClientCollection = Backbone.Collection.extend({
    model: ClientModel,
    url: '/dashboard/json/clients'
}); //End of ClientCollection

var ClientView = Backbone.View.extend({
    tagName: 'option',
    template: _.template($('#ClientData').html()), 
    render: function() {
        this.$el.append(this.template(this.model.toJSON()));
        return this.$el;
    }
}); 

Timesheet Data Code :

var TimeSheetModel = Backbone.Model.extend({
    defaults: {
        Timesheetrow: "",
    }
}); //End of TimeSheetModel

var TimeSheetCollection = Backbone.Collection.extend({
    model: TimeSheetModel,
    url: '/dashboard/json/row/' + TimesheetID()
}); //End of TimeSheetCollection

var TimeSheetRowView = Backbone.View.extend({
    className: 'TimesheetRowLine', 
    template: _.template($('#TimesheetData').html()), 
    render: function() {
        this.$el.append(this.template(this.model.toJSON()));
        return this.$el;
    }
}); //End of TimeSheetRowView

Timesheet & Client Code Section:

var TimeSheetCollectionView = Backbone.View.extend({
    el:'#MasterContainer', 

    template: _.template($('#TimesheetForm').html()),

    events: {
        "click .actionSubmit": "handleSubmit"
    }, 

    initialize: function() {
        //Get Client Data & Add To Template
        this.clientcollection = new ClientCollection();
        this.listenTo(this.clientcollection, "add", this.AddClient);
        this.clientcollection.fetch();

        //Get Main Timesheet Data & Add To Template
        this.collection = new TimeSheetCollection();
        this.listenTo(this.collection, "add", this.AddTimesheetRow);
        this.collection.fetch();

        this.$el.append(this.template());
        this.submitButton = this.$(".actionSubmit");
    },

    AddTimesheetRow: function(model) {
        var view = new TimeSheetRowView({model: model});
        view.render().insertBefore(this.submitButton);
    },

    AddClient: function(model) {
        var clients = new ClientView({model: model});
        $("#TimesheetDataList .TimesheetRowLine #clienttemp").append( clients.render() );
    },

    handleSubmit: function(){
        //in real life, you would validate and save some model
        alert("form submit");
        return false;
    }
}); //End of TimeSheetCollectionView

var collectionView = new TimeSheetCollectionView(); 

This is my Underscore Template code:

 <script type="text/template" id="TimesheetForm">
    <form action="#" method="post" id="TimesheetDataList" style="width: auto; padding-left: 50px;">   
       <input type="submit" class="actionSubmit" value="Send"/>
    </form>
 </script>

 <script type="text/template" id="TimesheetData">

   <%= console.log( Timesheetrow.client_id ) %>

   <input type="hidden" name="data[Timesheetrow][<%= Timesheetrow.id %>][id]" value="<%= Timesheetrow.id  %>">
   <input type="type" name="data[Timesheetrow][<%= Timesheetrow.id %>][jobtitle]" value="<%= Timesheetrow.twistjob  %>"> 

   <select name="data[Timesheetrow][<%= Timesheetrow.id %>][client_id]" id="clienttemp"></select>

 </script>

 <script type="text/template" id="ClientData">
    <option value="<%= Client.id %>"><%= Client.clientname %></option>
 </script>

---

OLD POST

---

Ok, I am having an issue with my Backbone view rendering into my Underscore template, again. I thought it would be best to ask it as a new question.

My last question, Underscore Template Looping, Without A Loop?, the guy on there help me very well but I am now trying, with little success to edit this code and extend it a little more.

CODE REMOVE - SEE UPDATE

So I was trying to follow the same methods. I know I have to look up more training to expand my knowledge.

With this code, I have a list of clients, I need to load into a select / option pull down form element. But it only seems to loop around 17 times, which is the number of rows I have in my timesheet. I am console logging 'Client' in the 'ClientData' template, this is what displays my client data but only the client data that is logged in my timesheet rows, not all the clients from the JSON data that the model / collection is pointing to? I am also getting a ref. Error for Client? Even though it is in my model as a default?

I am understanding backbone (a bit), but not Underscore so much.

All help most welcome.

Thanks,

---

:: EDIT ::

I thought I would post my Underscore templates.

 CODE REMOVED - SEE UPDATE

So what I am trying to do is loop around in ClientData template for all the clients, with 'option' tags, then add this to the select elements on the TimesheetData template. Then it is complete by this template being added to the TimesheetForm template, which it already does.

This might need a different method and might have been my fault that it don't work as I forgot to explain on the other question a out my client list.

Thanks,

来源：https://stackoverflow.com/questions/27023056/adding-more-another-loop-to-my-underscore-template-with-a-new-backbone-model