Call Materialize javascript from Node.js

Question

I have a form for a user to fill out. On the server-side, I'm using mailgun to send an email once the form has been submitted.

Upon an error, I want to display a toast dialog (Materialize.toast("Error", 2500); in Javascript). Since the error checking happens on the server side, I'm not sure how to call that method.

I happen to be using a <script> inside the HTML to stop the page from refreshing upon a submission though--but I couldn't figure out how to handle errors in this <script>. Here it is:

<script type="text/javascript">
$("#contact-form").submit(function(e) {
    e.preventDefault(); // Prevents the page from refreshing
    var $this = $(this); // `this` refers to the current form element
    $.post(
        $this.attr("action"), // Gets the URL to sent the post to
        $this.serialize(), // Serializes form data in standard format

        function(data) {
        },
        "json" // The format the response should be in
    );
    Materialize.toast("Toasty McToastface!", 1000);
    $('#contact-form').trigger('reset');
});
</script>

I appreciate any and all help.

Drown · Accepted Answer · 2016-06-16T00:38:18.903

2

Upon an error, I want to display a toast dialog (Materialize.toast("Error", 2500); in Javascript). Since the error checking happens on the server side, I'm not sure how to call that method.

You'll have to return the error from your server-side script, and check the data from the success callback to see if there was an error or not.

The $.ajax() methodhas an error callback ($.post() doesn't) but that will only be called when there is a timeout, a parse error, etc.

You could do it like this on the client :

$.post(
    $this.attr("action"),
    $this.serialize(), 
    function(data) {
       if(data.error) {
          Materialize.toast("Toasty McToastface!", 1000);  
       }
    },
    "json" 
);

Of course, for this to work, the server will need to respond with a JSON object that has an error property, set to true or false depending on wether or not the email was sent.

If you want the server to be able to communicate with the client outside of this callback, then you can use websockets (something like socket.io)

edited Jun 16 '16 at 00:38

answered Jun 16 '16 at 00:30

Drown

5,852
1
30
49

So I could use https://github.com/websockets/ws and upon an error on the server side, send `"error"` and then the client would interact with it? – Nxt3 Jun 16 '16 at 00:41
1

Yes, that would also work. I haven't used that library (ws), but I've used socket.io in the past and you can simply emit an event when something goes wrong, catch it on the client side and do something then. – Drown Jun 16 '16 at 00:44
What goes on the server side? I'm confused as to how to use socket.io since I use Express. Here is the `app.post()` where I handle a form submission: https://codeshare.io/XfCCQ – Nxt3 Jun 16 '16 at 22:48
actually you can track $.post errors by using fail() function http://stackoverflow.com/questions/2833951/how-to-catch-ajax-query-post-error your server-side app has to to return a JSON object as resposne, something like this: `res.status(500).json({ error: 'message' });` – Marat Jun 18 '16 at 19:05

Call Materialize javascript from Node.js

1 Answers1