CODEWITHSUNDEEP
javascriptnode.jsexpresspug
Dims
Dims

Reputation: 51039

script. JADE tag doesn't render in Express

I wish to have client side script in my JADE template and wrote

extends layout

script.
    function collect_data() {

        var transitions = {};

        $( ":checkbox:checked" ).each(function (index, element) {
        //// some code
    }

block content
    h1= title

    table
        - for (var i = 1; i < images.length; ++i) {
            - var image;
            // and so on

I was expecting something like

<script>
    function collect_data() {

    var transitions = {};
    ...

</script>

in my web page source, but I dont see it.

What is incorrect? How to render embedded javascript into template in Jade?

Upvotes: 0

Views: 217

Answers (1)

Faris
Faris

Reputation: 544

You are extending layout through

extends layout

which means you are in a child template, according to pug's docs common mistakes section

Note that only named blocks and mixin definitions can appear at the top (unindented) level of a child template. This is important! Parent templates define a page’s overall structure, and child templates can only append, prepend, or replace specific blocks of markup and logic. If a child template tried to add content outside of a block, Pug would have no way of knowing where to put it in the final page.

Which means you should do something like that 

//- layout.pug
html
  head
    block head
  body
    block content

and inside the child template you do something like this

extends layout

block append head
  script.
        function collect_data() {

            var transitions = {};

            $( ":checkbox:checked" ).each(function (index, element) {
            //// some code
        }

Will make it appear under head section in your layout

Upvotes: 1

Related Questions