Logo Questions Linux Laravel Mysql Ubuntu Git Menu

Jade and jQuery together

Folks, How would I implement jQuery styles on a form that I generate using Jade? What I am trying to do is to prettify forms and make them clickable. I am terrible at UI. period.

How would I implement this selectable method on a form? http://jqueryui.com/selectable/

pendingArray is an Array of JSON objects coming from Express. Just need to draw it and make it clickable. Upon a click, I would like a popup window open that I can POST to my api with... Being a backend programmer, this UI stuff is completely over my head as I never spend any time in this void.


include mainNavMenu

    h1= title
    p#container Welcome to #{title}
    p#message (to be filled in)
        alert('hello world');
        $("#message").html("message set through jquery")

block Content

if (pendingArray)
    - each val, key in pendingArray
like image 678
Cmag Avatar asked Dec 26 '22 12:12


1 Answers

Your problem is not Jade & jQuery, it's Jade & JavaScript ;)

Jade try to interpret your JavaScript code as Jade code. You need to write the JavaScript as a plain text. For you purpose you can use the block in a tag syntax, just add a dot after script:

    alert('hello world');
    $("#message").html("message set through jquery")

source: documentation

There is another error at the loop. each is Jade syntax and not JavaScript, you could also loop with JavaScript code, but that would look not very nice. In the next line you try to write plain text/HTML, but it's not plain, see above.

if pendingArray
    each item in pendingArray

source: documentation

like image 189
timaschew Avatar answered Jan 12 '23 23:01