2014-01-10 22 views
0

的一部分,我使用引導程序以表格形式填充數據表內容,該表格提供搜索框以實時搜索。我硬編碼了一行,然後發送ajax調用服務器。然後將該結果附加到該表中。附加行。問題是,它不執行對新創建的行搜索...動態創建的數據表不會成爲我的MVC4應用程序中的原始數據表

代碼

<table class="table table-striped table-bordered bootstrap-datatable datatable"> 
<thead> 
<tr> 
<th>Username</th> 
<th>Date registered</th> 
<th>Role</th> 
<th>Status</th> 
<th>Actions</th> 
</tr> 
</thead> 
<tbody id="take"> 
<tr> 
<td>David R</td> 
<td class="center">2012/01/01</td> 
<td class="center">Member</td> 
<td class="center"> 
<span class="label label-success">Active</span> 
</td> 
<td class="center"> 
<a id="iew" class="btn btn-success" href="#"> 
<i class="icon-zoom-in icon-white"></i> 
Download            
</a> 
<a id="view" class="btn btn-success" href="#"> 
<i class="icon-zoom-in icon-white"></i> 
view            
</a> 
<a class="btn btn-info" href="#"> 
<i class="icon-edit icon-white"></i> 
Edit            
</a> 
<a class="btn btn-danger" href="#"> 
<i class="icon-trash icon-white"></i> 
Delete 
</a> 
</td> 
</tr> 
</tbody></table> 
</div> 

的JavaScript 我調用該函數在某種程度上

function show_table() { 
     var root = document.getElementById('take'); 
     //var TBody = document.createElement('tbody'); 
     var row = document.createElement('tr'); 

     var D1 = document.createElement('td'); 
     D1.style.textAlign = "center"; 
     D1.appendChild(document.createTextNode("Naqvi")); 

     var D2 = document.createElement('td'); 
     D2.style.textAlign = "center"; 
     D2.appendChild(document.createTextNode("2012/01/01")); 

     var D3 = document.createElement('td'); 
     D3.style.textAlign = "center"; 
     D3.appendChild(document.createTextNode("Member")); 

     var D4 = document.createElement('td'); 
     D4.style.textAlign = "center"; 

     var S4 = document.createElement('span'); 
     S4.className = "label label-success"; 
     S4.appendChild(document.createTextNode("Active")); 
     D4.appendChild(S4); 

     var D5 = document.createElement('td'); 
     D5.style.textAlign = "center"; 

     var A1 = document.createElement('a'); 
     A1.className='btn btn-success'; 
     var I1 = document.createElement('i'); 
     I1.className = "icon-zoom-in icon-white"; 
     A1.appendChild(I1); 
     A1.appendChild(document.createTextNode('View')); 

     var A2 = document.createElement('a'); 
     A2.className='btn btn-info'; 
     var I2 = document.createElement('i'); 
     I2.className = "icon-edit icon-white"; 
     A2.appendChild(I2); 
     A2.appendChild(document.createTextNode('Edit')); 

     var A3 = document.createElement('a'); 
     A3.className='btn btn-danger'; 
     var I3 = document.createElement('i'); 
     I3.className = "icon-trash icon-white"; 
     A3.appendChild(I3); 
     A3.appendChild(document.createTextNode('Delete')); 

     var A4 = document.createElement('a'); 
     A4.className='btn btn-primary'; 
     var I4 = document.createElement('i'); 
     I4.className = "icon icon-white icon-arrowthick-s"; 
     A4.appendChild(I4); 
     A4.appendChild(document.createTextNode('Download')); 
     D5.appendChild(A1); 
     D5.appendChild(A2); 
     D5.appendChild(A3); 
     D5.appendChild(A4); 
     row.appendChild(D1);                  row.appendChild(D2); 
     row.appendChild(D3); 
     row.appendChild(D4); 
     row.appendChild(D5);                      <td class="center">2012/01/01</td> 
     root.appendChild(row); 
} 

硬編碼的結果 enter image description here

調用該函數後

結果: enter image description here

不知道如何解決這個問題。任何幫助將不勝感激...

回答

0

首先,如果我是你,我會考慮使用JavaScript模板庫,如Jquery Tmpl。

第二:你的javascript代碼並沒有試圖更新那個計數器,所以我不明白是什麼問題。

+0

我沒有什麼與該櫃檯。只是想在該條目上運行搜索以及目前沒有發生的事情...... –

相關問題