Question

在我的项目中，我使用bootstap-table插件进行表分页。

bootstrap-table的url是：

http://bootstrap-table.wenzhixin.net.cn/getting-started/

我已下载代码并在我的页面中使用。

但不幸的是，它失败了。这是我的代码：

<script>
$("#xzy").bootstrapTable({ 
  striped: true,  
  pagination: true,
  pageList: [10, 20],
  pageSize: 10, 
  pageNumber: 1, 
  sidePagination:'client',
  sortName: 'id',
  sortOrder: 'desc', 
  columns: [{
    field: 'id',
    title: 'Item ID'
     }, {
    field: 'name',
    title: 'Item Name'
    }, {
    field: 'price',
    title: 'Item Price'
    }],
  data: [{
    id: 1,
    name: 'Item 1',
    price: '$1'
}, {
    id: 2,
    name: 'Item 2',
    price: '$2'
}]
});
</script>
</head>  

<body style="height:100%" >  
<table data-toggle="table" id="xzy"></table>
</body>

这是包含文件：

<link href="jsui/bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="stylesheet">
<link href="jsui/bootstrap-3.3.7-dist/css/dashboard.css" rel="stylesheet">
<link href="bootstrap-table-1.12.1/dist/bootstrap-table.min.css" rel="stylesheet">

<script type="text/javascript" src="jsui/easyui-1.5.3/jquery.min.js"></script>
<script type="text/javascript" src="jsui/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
<script type="text/javascript" src="js/jquery.form.js"></script>
<script src="bootstrap-table-1.12.1/dist/bootstrap-table.min.js"></script>
<script src="bootstrap-table-1.12.1/dist/bootstrap-table-zh-CN.js"></script>

但它失败了。

今天，我尝试了另一种方式，即切断方式。这是我的代码：

var allS="Init";
$("#xzy").bootstrapTable({ 
  url: "idcCCA_at.php", 
  dataType: "json",
  striped: true, 
  pagination: true, 
  pageList: [10, 20], 
  pageSize: 10,
  pageNumber: 1,
  sidePagination: 'server', 
  queryParams:{allS:allS},
  columns: [
      {
          checkbox: true, 
          align: 'center' 
      }, {
          field: 'one', 
          title: 'one'
      }, {
          field: 'two',
          title: 'two'
      }, {
          field: 'three',
          title: 'three'
      }, {
          field: 'four',
          title: 'four'
      }, {
          field: 'five',
          title: 'five'
      },{
          field: 'six',
          title: 'six'
      }
  ]
});

idcCCA_at.php代码是：

if(isset($_POST['allS']))
{
include("DB.php"); //login DB code

 $sql="select one,two,three,four,five,six from sheet_A where one='John';";
 $stmt=$conn->query($sql);
 $row=$stmt->fetch(PDO::FETCH_ASSOC);
 $tmpArr = array(
    'one'=>$row['one'],
    'two'=>$row['two'],
    'three'=>$row['three'],
    'four'=>$row['foue'],
    'five'=>$row['five'],
    'six'=>$row['six'],
    );
 echo json_encode($tmpArr);
 }

不幸的是，它再次失败了。似乎没什么不对，谁能帮帮我？

Answer 1

我的HTML代码（这是我的工作副本与服务器分页的复制和粘贴）。

$.ajax(downloadUrl, {
   headers: { 'custom-header': 'custom-header-value'},
   type: 'GET',
   contentType: 'application/octet-stream'
}).done(function (data) {
   var blob = new Blob([data], { type: 'application/pdf' });
   var link = window.document.createElement('a');
   link.href = window.URL.createObjectURL(blob);
   link.download = '';
   link.click();
});

和我的php服务器文件

$('#master').bootstrapTable({
    url: './lookup/gettubing.php?d='+$.now(),
    pagination: true,
    sidePagination: 'server',
    pageSize: '25',
    pageList: '[25, 50, 100, All]',
    showRefresh: true,
    columns:[
        ...
    ]
});

用于客户端HTML代码

include("../../Includes/aedclass.php"); 
$nconn = new WorkData();
$conn = new PDO ($nconn->DB_DSN,$nconn->DB_USER,$nconn->DB_PASSWORD);

$offset = $_GET['offset'];
$limit = $_GET['limit'];

//calculate start & end
    if ($offset>0){
        $start = $offset+1;}
    else{
        $start = $offset;}      
    $end = $offset + $limit;


$data = array();

//get total record count and pass to json
$sql = "SELECT count(*)
    FROM master_well_list, tubing_size 
    WHERE master_well_list.api = tubing_size.api";

$stmt = $conn->prepare($sql);
$stmt->execute();

$result = $stmt->fetch(PDO::FETCH_BOTH);

$rowcnt = $result[0];

$data = array();
$data['total']=$rowcnt;

$sql = "SELECT * FROM (SELECT ROW_NUMBER() OVER(ORDER BY field, pad, well_name, well_num)
        AS RowNumber, well_name, well_num, field, pad
    FROM master_well_list, tubing_size
    WHERE master_well_list.api = tubing_size.api)   AS TEST
    WHERE RowNumber BETWEEN $start AND $end";

$stmt = $conn->prepare($sql);
$stmt->execute();

$result = $stmt->fetchAll(PDO::FETCH_ASSOC);

$data['sql']=$sql;
$data['rows']=$result;

echo json_encode($data);

服务器端

$('#master').bootstrapTable({
    url: './lookup/gettubing.php?d='+$.now(),
    pagination: true,
    sidePagination: 'client',
    pageSize: '25',
    pageList: '[25, 50, 100, All]',
    showRefresh: true,
    columns:[
        ...
    ]
});

Answer 2

更改这些代码：

public class MainActivity extends AppCompatActivity {


    private ArrayList<myObject> myListOfObjact;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);


// Write a message to the database
        FirebaseDatabase database = FirebaseDatabase.getInstance();
        DatabaseReference myRef = database.getReference();


        myListOfObjacts= new ArrayList<myObject>();

         Log.e(TAG, " myListOfObjacts.size: " + myListOfObjacts.size());
         // size of myListOfObjacts here is 0 (null) 

// Read from the database
        myRef.addValueEventListener(new ValueEventListener() {
            @Override
            public void onDataChange(DataSnapshot dataSnapshot) {
                for (DataSnapshot postsnapshot : dataSnapshot.getChildren()) {

                    myObject data1 = postsnapshot.getValue(myObject.class);
                    myListOfObjacts.add(data1);
                }

            Log.e(TAG, " myListOfObjacts.size: " + myListOfObjacts.size());
            // size of myListOfObjacts here is reading correctly 

            }

            @Override
            public void onCancelled(DatabaseError error) {
                // Failed to read value
                Log.w(TAG, "Failed to read value.", error.toException());
            }
        });    

           Log.e(TAG, " myListOfObjacts.size: " + myListOfObjacts.size());
           // size of myListOfObjacts here also is 0 (null) 

    }

}

这些代码：

  $row=$stmt->fetch(PDO::FETCH_ASSOC);
  $tmpArr = array(
   'one'=>$row['one'],
   'two'=>$row['two'],
   'three'=>$row['three'],
   'four'=>$row['foue'],
   'five'=>$row['five'],
    'six'=>$row['six'],
   );
echo json_encode($tmpArr);

如何使用bootstrap-table插件制作表分页

2 个答案: