ទន្ទឹម​នឹង​ការប្រើប្រាស់​ទំរង់​បែបបទ យើង​ក៏​អាច​បញ្ជូន​បណ្តា​ទិន្នន័យ​ទាំងឡាយ​ទៅ​កាន់ server និង​ទទួល​ទិន្នន័យ​ពី server មកវិញ​ តាមរយៈការប្រើប្រាស់​យន្តការ Ajax ។ ហើយ​ដើម្បី​អោយ​មាន​ការងាយ​ស្រួល យើង​អាច​ប្រើប្រាស់​កញ្ចប់ jQuery ក្នុង​ការប្រើប្រាស់​យន្តការ Ajax ។ ដូចនេះ យើង​ចាំបាច់​ត្រូវ​ទាញយក​​កញ្ចប់ jQuery ​មក​ទុក​នៅ​ក្នុង​ថត public ជា​មុន​សិន​។ ការប្រើប្រាស់​យន្តការ Ajax ដោយ​ប្រើប្រាស់​កញ្ចប់ jQuery អាច​ត្រូវ​ធ្វើ​ឡើង​ដូច​ខាង​ក្រោម​នេះ៖

 

import express from 'express'
import path from 'path'

const app = express()
const port = process.env.PORT || 3000
const __dirname = path.resolve()
 
import index from './routes/index.js'
import backend from './routes/backend.js'

app.set('views', path.join(__dirname, 'views'))
app.set('view engine', 'ejs')
app.use(express.static(path.join(__dirname, 'public')))
app.use(express.urlencoded({extended:false}))
app.use(express.json())
                                  
app.use('/',index) 
app.use('/backend',backend) 

app.listen(port,function(){
    console.log(`This application is listening to the port: ${port}`)
})

 

/* ./routes/index.js */
import express from 'express'
const index = express.Router()

let data = {}

index.get('/',(req,res,next)=>{
    data.message = ''
    res.render('base',data)
})

index.post('/',(req,res,next)=>{
    data.message = `ទំព័រ​លេខ ${req.body.page}`
    res.json(data)
})
 
export default index

 

<!--views/base.ejs-->
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8"/>
        <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
        <title>Express.js Web Framework</title>
        <link href="/fonts/setup.css" rel="stylesheet">
        <link href="/styles/base.css" rel="stylesheet">
        <script src="/scripts/jquery.js"></script>
    </head>
    <body>
        <script>
            let page = 0
            let paging = ()=>{
                $.ajax({
                    url:'/',
                    type:"POST",
                    data:JSON.stringify({page:page++}),
                    contentType:"application/json; charset=utf-8",
                    dataType:"json",
                    success:function(data){
                        alert(data.message)
                    }
                })
            }
        </script>
        <input type="submit" value="ទំព័រ" onclick="paging()" />
        <p><%= message %></p>
    </body>
</html>