हाय दोस्तों मैं रीढ़ की हड्डी और अंडरस्कोर पर कुल नोब हूँ। मुझे एक टेबल बनाने की ज़रूरत है जो कुछ तिथियों के लिए नियुक्ति बुकिंग दिखाती है। मुझे इसे ऐसा कुछ दिखाना है:
मेरा संग्रह इस तरह दिखता है:
[
{"id":0, "startDate":"04/11/2013", "serviceID":241, "providerID":223, "timeSlots": ["09:00","10:00","11:00","12:00","13:00","14:00","15:00","16:00"]},
{"id":0, "startDate":"05/11/2013", "serviceID":241, "providerID":223, "timeSlots": ["09:00","10:00","11:00","12:00","13:00","14:00","15:00","16:00"]}
]
मैं वर्तमान में अपने अंडरस्कोर टेम्पलेट में क्या कर रहा हूं:
<div class="table-responsive">
<div class="row">
</div>
<table id="stbl" class="table table-striped table-condensed table-bordered">
<% _.each(slots, function(slot) { %>
<tr>
<td>
<strong> <%- slot.startDate %> </strong>
</td>
<% _.each(slot.timeSlots, function(t) { %>
<td>
<button id="timeslot" data-provider="<%- slot.providerID %>" data-time="<%- t %>" data-date="<%- slot.startDate %>" class="btn btn-small btn-blue"><span><%- t %></span></button>
</td>
<% }); %>
</tr>
<% }); %>
</table>
</div>
उपरोक्त तस्वीर की तरह एक संरचना देने के लिए मैं अपने टेम्पलेट में क्या परिवर्तन करता हूं?
धन्यवाद
उत्तर:
उत्तर № 1 के लिए 1आपकी डेटा संरचना के साथ खेलने के लिए थोड़ा कठिन है। मैं टेबल हेडर और बॉडी को अलग से बनाने के लिए अपने टेम्पलेट में 2 पास करने का सुझाव दूंगा।
यहां मैं क्या कह रहा हूं:
// template start
<table>
<thead>
/* ...code to create header */
</thead>
<tbody>
/* ... code to create row entries */
</tbody>
</table>
// template end
इसे झुकाया तुम्हारे लिए। आशा है कि आप इसे यहां से आगे ले जा सकते हैं।
शुभ लाभ