Loop through models and check if an attribute exists
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
<table class="js-output"></table>
<script type="text/html" id="tmpl">
<tr>
<td>
<% _.each(data.mappedSessions, function(session) {
var deleteSessionAvailable = _.indexOf(data.deleteSessions, session) >= 0;
var gfidSelectedOption = _.where(data.sessionMapping, session);
console.log(session, gfidSelectedOption[session]);
%>
<li class="td-options__item <% if(data.availableSessions === 0) { %>is-hidden<% } %>">
<select name="" class="td-options__select js-sessions-select" data-sessionid="<%= session %>" <% if(deleteSessionAvailable) { %> disabled <% } %>>
<option></option>
<% _.each(availableIds, function(item) { %>
<!-- if gfidSelectionOptions[session] === session then add 'selected' to option ???? -->
<option value="<%= item.id %>"><%= item.id %> – <%= item.name %> – (<%= data.availableSessions %> Available)</option>
<% }) %>
</select>
</li>
<% }) %>
</script>
</td>
</tr>
JavaScript
console.clear();
var availableIds = [
{
"id": "5Q6",
"name": "Campo 2"
},
{
"id": "7GH",
"name": "Camposinos"
},
{
"id": "8X6",
"name": "Rangers"
}
];
var data = {
"id": "6H6",
"name": "Joes Shack",
"mappedSessions": [
"X0101",
"B1800",
"B1888",
"F3005"
],
"sessionAllowance": 5,
"availableSessions": 1,
"selectable": true,
"selected": true,
"deleteSessions": [],
"sessionMapping": {
"X0101": {
"id": "5Q6",
"name": "MATOUR TRADING LLC"
},
"B1800": {
"id": "7GH",
"name": "PATOUR TRADING LLC"
}
}
}
var template = _.template($('#tmpl').html());
$('.js-output').html(template({
data: data,
availableIds: availableIds
}));
//_.each(data.mappedSessions, function(session) {
// var gfidSelectedOption = _.where(data.sessionMapping, session);
// console.log(gfidSelectedOption);
//});