datatables分頁正在破壞工作中的腳本代碼

首先，我很抱歉，因爲我知道人們之前有過這個問題，並已多次回答。我很抱歉地說，我不明白已經給出的答案，因此需要就我的特定問題尋求建議。datatables分頁正在破壞工作中的腳本代碼

我正在使用最新的jQuery和dataTables庫，並可以通過經典的ASP來獲取我的數據。

問題發生在頁面1後的所有頁面上（禁用分頁使所有工作都不是理想的結果）。

我明白dataTables的工作方式是通過與DOM中的tr和我讀過的其他帖子混淆，使用.on可以解決這個問題，但這是我要去的地方。

我的代碼看起來是這樣的（我有這個頁面上有多個標籤表，因此具有對話框按鈕將數據複製到在表單中輸入並提交）

<script> 
$().ready(function(){ 
    $("#table1").dataTable(); 
}); 
    </script> 
      <table id="table1"> 
       <thead> 
        <tr> 
         <th>Name</th> 
         <th>Access Level</th> 
         <th>Last Edited</th> 
         <th>Last Edited By</th> 
         <th></th> 
        </tr> 
       </thead> 
       <tbody> 
        <% 
SQL="SELECT * FROM People_Levels ORDER BY accessLevel ASC, fName ASC;" 
set rs=MyConn.execute(SQL) 
set SQL=nothing 
do While not rs.EOF 
        %> 
        <tr> 
         <td><%=rs("fName")%>&nbsp;<%=rs("sName")%></td> 
         <td>Access Level <%=rs("accessLevel")%></td> 
         <td><%=rs("lastEdited")%></td> 
         <td><%=rs("lastEditedBy")%></td> 
         <td><span id='<%=rs("Key")%>'>Remove</span> 
          <div id="remove<%=rs("Key")%>" title="remove user access level"> 
           <div id="remove<%=rs("Key")%>content"> 
            Are you sure you want to remove <%=rs("fName")%>&nbsp;<%=rs("sName")%> from the access level list? 
           </div> 
           <div id="remove<%=rs("Key")%>saving" style="text-align: center; display: none"> 
            <strong style="color: green; font-size: 1em">Removing user from database</strong><br /> 
            <img src="CSS/images/Loading.gif" /> 
           </div> 
          </div> 
          <script> 
$().ready(function() { 
    $("#remove<%=rs("Key")%>").dialog({ 
     autoOpen: false, 
     height: 250, 
     width: 300, 
     modal: true, 
     buttons: { 
      "No": function() { 
       $(this).dialog("close"); 
      }, 
      "Yes": function() { 
       $("#select1").val("2"); 
       $("#select2").val(<%=rs("Key")%>); 
       $("#submit").trigger("click"); 
       $("#remove<%=rs("Key")%>content").hide(); 
       $("#remove<%=rs("Key")%>saving").show(); 
      } 
     } 
    }); 
    $("#<%=rs("Key")%>").click(function(){ 
     $("#remove<%=rs("Key")%>").dialog("open"); 
    }); 
}); 
          </script> 
         </td> 
        </tr> 
        <% 
rs.MoveNext 
loop 
set rs=nothing 
        %> 
       </tbody> 
      </table> 
    <form action="" method="post"> 
     <input id="submit" type="submit" name="submit" style="display: none" /> 
     <input id="select1" name="select1" style="display: none" /> 
     <input id="select2" name="select2" style="display: none" /> 
     <input id="select3" name="select3" style="display: none" /> 
     <input id="select4" name="select4" style="display: none" /> 
     <input id="select5" name="select5" style="display: none" /> 
     <input id="select6" name="select6" style="display: none" /> 
     <input id="select7" name="select7" style="display: none" /> 
    </form>

來源

2016-04-28 elboffor

任何有興趣我解決了這個問題通過改變我存儲數據的方式以及如何生成對話框。上面的代碼生成了一個新的對話框和腳本，每次在循環中插入新行時都會調用該對話框。

正確的做法是爲單元格（）指定一個類，並在span元素中使用數據屬性。例如：

<span class="cellClass" data-key="<%=rs("Key")%>">remove</span>

現在的HTML是正確標註起來，我有一個腳本塊在從單擊單元格要求的屬性，這可以用來識別它，像這樣的頂級：

$("#table1").on("click", ".cellClass",function(){ 
    // table1 is the nearest parent id to the cell 
    // cellClass is the classname given to the cell (this is an example) 
    var Key=$(this).attr("data-key"); 
    $("#Dialog").dialog("open") 
});

來源

2016-06-01 22:34:45 elboffor

datatables分頁正在破壞工作中的腳本代碼

回答

相關問題