Cant get jquery AJAX to work node js express

Question

I've been trying to get ajax to work on node js. Its the first time working with ajax so i have been trying to test it out useing the console to check that it works but every time i try i don't get a response on the console.

Here is my code.

<script>

function getMessage() {

    var data = $("#messageselect").val()

    $.ajax({
        url: "/message",
        type: "POST",
        data: JSON.stringify(data)
        dataType: 'json',
        success: function(data) {
            console.log(data);
        }
        error : function(err)
        console.log("error fetching message");
    });
}
</script>

server

app.post('/message', function(req, res) {

    console.log(JSON.stringify(req.body));


    Message.findOne({ 'page.message' : req.data }, function(err, message) {

        if(err)
            throw err;

        res.send(message);
    });
});

html

<form method="POST">
                        <select multiple="multiple" class="messageselect" onchange="getMessage()" id="messageselect">
                            <% if(message) { %>
                            <% for(i=messagecount-1;i>=0;i--) { %>
                            <option value="<%= message[i].page.message %>">From: <%= message[i].page.username %> Message: <%= message[i].page.messagetitle %></option>
                            <% } %>
                            <% } %>
                        </select><br><br><br>
                    </form>

Answer 1

I guess this is one of the typos error in your code:

var = data $("#messageselect").val()
//--^^--------------------------------worng way to assign.

---

jQuery.ajax() needs an object to send:

var data = { data : $("#messageselect").val() };

and at the server you can use req.body to get the posted data:

 console.log(req.body.data);

Note:

For this you need to have body-parser for it, so make sure to include it in the code configs above.

Answer 2

Could you please try $http like below format ,

$http.post(//url , //data )
   .success (function() {})
   .error(function() {});

Answer 3

$.ajax({
    url: "/message",
    type: "POST",
    data: JSON.stringify(data)
    dataType: 'json',
    success: function(data) {
        console.log(data);
    }
    error : function(err)
    console.log("error fetching message");
});

They are missing braces at the error handler

error : function(err) {
        console.log("error fetching message");
}

Maybe not the right way so you also can try :

$.ajax({
    url: '/message',
    type: 'POST',
    dataType: 'JSON',
    data: {JSON.stringify(data)},
    success: function(data) {
        console.log(data);
    }
    error : function(err) {
        console.log("error fetching message");
    }
});

Have you ever tried using curl to POST something on server ?

Answer 4

In addition to existing answers you should also pass the proper Content-Type with your AJAX request:

$.ajax({
    url: "/message",
    type: "POST",
    data: JSON.stringify(data)
    dataType: 'json',
    contentType: 'application/json' //here it is
    //...
});