0
新元素我這裏有一個小提琴:http://jsfiddle.net/marktait/YETGp/jQuery Mobile的格式在DOM
它的設計使用jQueryMobile - 這是當它第一次顯示細膩。但是當我點擊添加房間按鈕時,它會添加一個新行,但jQuery Mobile CSS不會應用到新行。
無論如何將格式添加到DOM中的新元素?
的HTML是:
<div class='liveExample'>
<table width='100%' border="1">
<thead>
<tr>
<th width='25%'>Room Type</th>
<th width='25%'>Occs</th>
<th class='price' width='15%'>Price</th>
<th class='quantity' width='10%'>Quantity</th>
<th class='price' width='15%'>Subtotal</th>
<th width='10%'> </th>
</tr>
</thead>
<tbody data-bind='foreach: lines'>
<tr>
<td>
<select data-bind='options: $root.RoomCategories, optionsText: "TypeName", optionsCaption: "Select...", value: category'> </select>
</td>
<td data-bind="with: category">
<select data-bind='options: Occs, optionsText: "occ", optionsCaption: "Select...", value: $parent.product'> </select>
</td>
<td class='price' data-bind='with: product'>
<span data-bind='text: formatCurrency(ratetocharge)'> </span>
</td>
<td class='quantity' data-bind="with: category">
<select data-bind="visible: $parent.product, options: ko.utils.range(0, TypeCount), value: $parent.quantity"></select>
</td>
<td class='price'>
<span data-bind='visible: product, text: formatCurrency(subtotal())' > </span>
</td>
<td>
<a href='#' data-bind='click: $parent.removeLine'>Remove</a>
</td>
</tr>
</tbody>
</table>
<p class='grandTotal'>
Total value: <span data-bind='text: formatCurrency(grandTotal())'> </span>
</p>
<button data-bind='click: addLine'>Add room</button>
<button data-bind='click: save'>Submit booking</button>
</div>
添加一個新行淘汰賽是:
// Operations
self.addLine = function() {
self.lines.push(new CartLine())
};
感謝您的幫助,
馬克
非常感謝@jaudette - 我已經用修正更新了小提琴:http://jsfiddle.net/marktait/YETGp/3/ - 乾杯,馬克 – Mark