Jquery avec nodejs

Le problème exposé dans ce sujet a été résolu.

Salut salut!

Depuis quelques temps que j’apprends nodejs (avec le framework expressjs), j’essaye avec l’aide de jquery de supprimer un nom d’une base de donnée. Et bien, surprise, ça ne marche pas :p.

Alors, si quelqu’un pouvais m’aider?

(shéma pour organiser ici => https://pastebin.com/dvexigk6)

App.js

  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 48
 49
 50
 51
 52
 53
 54
 55
 56
 57
 58
 59
 60
 61
 62
 63
 64
 65
 66
 67
 68
 69
 70
 71
 72
 73
 74
 75
 76
 77
 78
 79
 80
 81
 82
 83
 84
 85
 86
 87
 88
 89
 90
 91
 92
 93
 94
 95
 96
 97
 98
 99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
const express  = require('express')
const bodyparser = require('body-parser')
const path = require('path')
const expressVal = require('express-validator')
const mongojs = require('mongojs')
const db = mongojs('customerapp', ['users'] )
const app = express();

/*const logger = (req, res, next) =>{
    console.log('Logging...')
    next()
}

app.use(logger)*/

//View Engine
app.set('view engine', 'ejs')
app.set('views', path.join(__dirname, 'views'))

//Body Parser Middleware
app.use(bodyparser.json())
app.use(bodyparser.urlencoded({extended: false}))

//Set Static Path
app.use(express.static(path.join(__dirname, 'public')))

// Global Vars
app.use( (req,res,next) => {
    res.locals.errors = null
    next()
})

// Express Validatior Middleware
app.use(expressVal({
    errorFormatter: (param, msg, value) => {
        const namespace = param.split('.'),
        root = namespace.shift(),
        formParam = root;

        while(namespace.length){
            formParam += '[' + namespace.shift() + ']';
        }
        return {
            param: formParam,
            msg: msg,
            value: value
        };
    }
}))


app.get('/', (req, res) => {

    db.users.find( (err, docs) => {
        if (err){
            console.log('Error at finding users on db, check \
            parmeters.\n')
            console.log(err)
        }else{
            console.log('Users:\n++++++++++++++++++')
            console.log(docs)
            console.log('\n++++++++++++++++++++++++')

            res.render('index', {
            title: 'Our customers:',
            users: docs
        })
        }
    })
})

app.post('/users/add',(req, res) => {

    req.checkBody('fname', ' first name required').notEmpty()
    req.checkBody('lname', 'last name required').notEmpty()
    req.checkBody('mail', 'mail required').notEmpty()

    const errors = req.validationErrors();

    if (errors) {
        res.render('index', {
            title: 'Our customers:',
            users: users,
            errors: errors
        })
    }else{
        const new_user = {
            fname : req.body.fname,
            lname : req.body.lname,
            mail  : req.body.mail,
        }
        db.users.insert(new_user, (err, result) => {
            if (err){
                console.log('Can not insert user to database.\n')
                console.log(err)
            }

            res.redirect('/')
        })
    }
} )

app.delete('/users/delete/:id', (req, res) => {
    //console.log('deleted user id ' + req.params.id)
    db.users.remove({_id: ObjectId(req.params.id)}, (err, result) => {
        if (err){
            console.log('Can not delete user\n')
            console.log(err)
        }

        res.redirect('/')
    })
})

app.listen(3000, () => {
    console.log('Server started on port 3000...')
})

index.ejs

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
<% include partials/header %>

    <h1>Add Customer</h1>
    <% if (errors){ %>
        <ul>
            <% errors.forEach(function(error){ %>

            <li><em><font color="#8e2a42"><%= error.msg %></font></em></li><% }) %>
        </ul>
    <% } %>
    <form method="POST" action="/users/add">
        <label>First name</label><br>
        <input type="text" name="fname" placeholder="first name.."><br>

        <label>Last name</label><br>
        <input type="text" name="lname" placeholder="last name.."><br>

        <label>Mail</label><br>
        <input type="text" name="mail" placeholder="mail.."><br><br><br>

        <input type="submit" value="submit"><br>

    </form>
    <h1><%= title %></h1>
    <ul>
    <% users.forEach(function(user){ %>

    <li><%= user.fname %> <%= user.lname %> - <a href="#" class="deleteUser" data-id="<%= user._id %>">Delete</a></li><% }) %>
    </ul><br>
<% include partials/footer %>

header.ejs

1
2
3
4
5
6
7
8
9
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Customer app</title>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
        <script src="js/main.js"></script>
    </head>
    <body>

main.js

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
$(document).ready( function() {

    $('.deleteUser').on("click", deleteUser)
})

function deleteUser(){
    const confirmation = alert('Are you sure?')

    if (confirmation){
        alert('user deleted')
        $.ajax({
            type: 'DELETE',
            url: '/users/delete/'+ $(this).data('id')

        }).done( function(response) {
            window.location.replace('/')
        })
        window.location.replace('/')
        else {
            return false
        }
    }
}

`
Connectez-vous pour pouvoir poster un message.
Connexion

Pas encore membre ?

Créez un compte en une minute pour profiter pleinement de toutes les fonctionnalités de Zeste de Savoir. Ici, tout est gratuit et sans publicité.
Créer un compte