Bootstrap分頁和內聯實現

我正在實施bootstrap分頁（數據表）和引導內聯編輯（xeditable）。

兩個文件已經整合成功

頭文件如下：

 <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"> 
     <link rel="stylesheet" type="text/css" href="css/DT_bootstrap.css"> 
     <link href="css/bootstrap-editable.css" rel="stylesheet"/> 
     <script type="text/javascript" language="javascript" src="js/jquery-1.11.0.min.js"></script> 
     <script type="text/javascript" language="javascript" src="js/jquery_002.js"></script> 
     <script type="text/javascript" language="javascript" src="js/DT_bootstrap.js"></script> 
     <script src="js/bootstrap.min.js"></script> 
     <script src="js/bootstrap-editable.min.js"></script> 

     <script type="text/javascript"> 
     $(document).ready(function() { 
     $('.editable_class').editable({ 
      type: 'select', 
      url: 'process.php', 
      title: 'Enter Value', 
      validate: function(value) { 
      if($.trim(value) == '') { 
       return 'This field is required'; 
      } 
     } 
     }); 
     }); 
     </script>

body標籤看起來像這樣

 <a data-original-title="Select a number" data-source="{'0': '0','1': '1', '2': '2', '3': '3', '4': '4', '5': '5', '6': '6', '7': '7', '8': '8', '9': '9', '10': '10'}" data-value="<?php echo $get_my_value; ?>" data-pk="<?php echo $row['book_code']."_".$book_id[$i]['id']; ?>" data-name="book_value" data-type="select" id="book_value" href="#" class="editable_class"><?php echo $get_my_value; ?></a>

的問題是：1。我能夠毫無問題地編輯第一頁。當我點擊分頁（即第二頁）時，編輯不起作用。換句話說，編輯在第一頁正常工作，並在接下來的後面幾頁不工作（有超過10頁）

當我使用Firebug檢查的第一個頁面的錨標記看起來像這樣

<a class="editable_class editable editable-click" href="#" id="book_value" data-type="select" data-name="book_value" data-pk="1" data-value="5" data-source="{'0': '0','1': '1', '2': '2', '3': '3', '4': '4', '5': '5', '6': '6', '7': '7', '8': '8', '9': '9', '10': '10'}" data-original-title="Enter Value">5</a>

第二個頁面的錨標記看起來像這樣

<a class="editable_class" href="#" id="book_value" data-type="select" data-name="book_value" data-pk="1" data-value="5" data-source="{'0': '0','1': '1', '2': '2', '3': '3', '4': '4', '5': '5', '6': '6', '7': '7', '8': '8', '9': '9', '10': '10'}" data-original-title="Enter Value">5</a>

如果你比較上述兩個錨標記，很顯然，第一頁的類名是「editable_class編輯編輯單擊」，第二頁的類名是「editable_class」

因此，我可以找出問題此外，現在 - 如何解決它？

任何幫助將是非常有益的

感謝， Kimz

來源

2014-03-12 user3350885

請任何幫助。我的問題聽起來好多了！ ?? – user3350885

是第二個錨標籤是動態創建的嗎？ –

我想你應該分頁後再次重新初始化editable。因爲你的第二個錨標籤是動態創建的。因此，在第二頁出現使用分頁後再次使用這個

$('.editable_class').editable({ 
     type: 'select', 
     url: 'process.php', 
     title: 'Enter Value', 
     validate: function(value) { 
     if($.trim(value) == '') { 
      return 'This field is required'; 
     } 
    } 
    });

來源

2014-03-12 13:49:09

anoop - 分頁和內聯編輯只能在單個文件中發生。 :( 你能幫我一下嗎？沒有兩個PHP文件 – user3350885

anoob - 我已經解決了我的問題並回答了我的問題;） – user3350885

我修復了這個問題。問題是我有一個單獨的文件夾（js/DT_bootstrap.js）中的分頁jquery文件。我只需要將下面的腳本添加到文檔準備好的DT_bootstrap.js文件中。

$('.editable_class').editable({ 
    type: 'select', 
    url: 'process.php', 
    title: 'Enter Value', 
    validate: function(value) { 
    if($.trim(value) == '') { 
     return 'This field is required'; 
    } 
} 
});

爲什麼我擔心的是，我在這裏已經打破了我的頭兩天並修復了它。可能 - 我的糟糕記憶花了2天時間。要回答這個問題，我們需要使用可編輯的內聯腳本更新分頁jquery文件，因爲分頁文件（js）不知道內聯編輯。謝謝 Kimz

來源

2014-03-14 04:38:49 user3350885

Bootstrap分頁和內聯實現

回答

相關問題