CODEWITHSUNDEEP
node.jsexpresspagination
Shubham
Shubham

Reputation: 1

pagination in nodejs, express

how to apply concept of pagination in nodejs. I have posted my whole nodejs practice module but i am atuck with the concept of pagination. I need to show 4 entries on each page . Front-end

<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<form action="/deletechecks" method="post">
<table style="margin-top: 20px" table border="1"  text- 
align:ccellspacing="20px" cellpadding="15px" width="100%">
<% for(var i = 0 ; i < data.length ; i++) { %>
    <tr></td>
        <td> <%= data[i].catname %> </td>
        <td> <%= data[i].status %> </td>
        <td> <%= data[i].id %> </td>
        <td> <a href="/delete/<%= data[i].id %>"> delete</a></td>
        <td> <a href="/view/<%= data[i].id %>"> view</a></td>
        <td> <a href="/update/<%= data[i].id %>"> update</a></td>
        <td> <input type="checkbox" name="check" value="<%= data[i].id 
        %>">delete <%=data[i].id %>  </td>
       </tr>
       <% } %>
       </table>
       <input type="submit" name="submit" value="Delete Selected">

       </div>
       </form>
       </body>
       </html>

Backend

    var express= require('express');
    var app = express();
    var url = require('url')
    var bodyparser= require('body-parser');
    var mysql = require('mysql');
    var session= require('express-session');
    app.use(session({secret:'hello'}));

    app.use(bodyparser.urlencoded({extended:true})); 

    app.set ("view engine" , 'ejs');


    var con = mysql.createConnection({
   host: "localhost",
    user:'root',
    password: "",
   database:'blog'
    });
   con.connect(function(err) {
 if(err) throw err;
 console.log("connected!");
  });
app.get('/',function(req,res){
res.render('blog1');
 });
app.post('/action',function(req,res){
var title=req.body.cat;
var status =req.body.sel ;
var q = "insert into category set catname = '"+title+"', 
status='"+status+"'";
con.query(q,function(err,result){
    if(err)
        throw err;
    else
    res.redirect('/viewdata');

   });
   });
   app.get('/viewdata', function(req,res) {
   var w= "select * from category";
   con.query(w, function(err,result){
   res.render('showdata',{data:result});

  });
  });

  app.get('/delete/:a',function(req,res){
  var z= req.params.a;
     var d= "delete from category where id='"+z+"'";
 con.query(d,function(err,result){
    if(err) throw err;
    res.redirect('/viewdata');
 });

 });
app.get('/view/:a',function(req,res){
var z= req.params.a;// url se dynamic value nikalne ke liye
var d= "select * from category where id='"+z+"' ";
con.query(d,function(err,result) {
if(err) throw err;
res.render('showbyid',{data:result});
});
});
app.get('/update/:id', function(req,res){
var d= req.params.id
var z= "select * from category where id='"+d+"'";
con.query(z,function(err,result) {
    if(err) throw err;
    res.render('blog1', {data:result});
});
});
app.post('/new_action/:id',function(req,res){
 var x = req.body.cat;
 var y = req.body.sel;
 var z = req.params.id;
 var updated ="update category set catname ='"+x+"', status='"+y+"' where 
 id='"+z+"' ";
 con.query(updated,function(err,result){
    if(err)
        throw err;
    else
        res.redirect('/viewdata');
 });
 });
app.get('/viewdata',function(req,res){
var q= "select * from category";
con.query(q,function(err,result){
    res.render("viewdata",{data:result});

});
});

app.post('/deletechecks',function(req,res){
var ch = req.body.check;
if(typeof ch == "string")
{
    var h= "delete from category where id='"+ch+"'";
        console.log(h);     
        con.query(h,function(err,result)
        {
            console.log('deleted');
        });
}   
else
{
    for( var i=0;i<ch.length;i++)
    {
        var h= "delete from category where id='"+ch[i]+"'";
        console.log(h);     
        con.query(h,function(err,result)
        {
            console.log('deleted');
        });
    }
 } 
  res.redirect('/viewdata');
 });
app.get('/login',function(req,res){
if(req.session.name)
{
    res.redirect("/dashboard");
}
else {
res.render('login');
}
});
 app.post('/new',function(req,res){
 var email = req.body.emailfield;
 var password = req.body.passwordfield;
 var updated ="  select count (email) as val  from  admin where email = 
 '"+email+"' and password='"+password+"' and status='active'";
 con.query(updated,function(err,result){
    if(err)
        throw err;
    if(result[0].val)//
    {
        req.session.name=email;
        res.redirect("/dashboard");
    }

    else
    {
        res.redirect("/login");
    }
    });
    });
    app.get("/dashboard",function(req,res)
    {
   if(!req.session.name)
    {
    res.redirect("/login");
   }
   res.render("dashboard")
    });
   app.get("/logout" , function(req,res){
  })

  app.listen(8080);

**code to insert into database is also included included along with delete and other operations. Code is working perfectally fine for rest of the queries only concept of pagination is to be applied here. **

Upvotes: -1

Views: 4946

Answers (1)

Rajat banerjee
Rajat banerjee

Reputation: 1821

This has nothing to do with node js. This is an application design question. Pagination is achieved in 2 ways

  • Client side. Get entire dataset and paginate your response to show first 4, which technically would be data[0] through data[3].
  • on click of next page, get 4 to 7 , or if you have pages ( data.length/4), you get data[(page-1)*4] to data[(page-1)*4+3]

  • Server side :

       app.get('/viewdata/:page', function (req, res) {
     var page = req.params.page
     var w = //some SP to get nth page data;
     con.query(w, function (err, result) {
        res.render('showdata', { data: result });
     });
  });

Upvotes: 2

Related Questions