CODEWITHSUNDEEP
node.jstwitter-bootstrappugexpress
Michael Kohler
Michael Kohler

Reputation: 753

Jade + NodeJS: not rendered as desired

I'm using Bootstrap to style my website. I have the following snippet in my index.jade:

form.form-inline.pull-right(action='http://localhost:1337/authenticated', method='POST')
  input.input-small(type='text', placeholder='Email', name='emailInput') 
  input.input-small(type='password', placeholder='Password', name='passwordInput')
  label.checkbox
    input(type='checkbox') Remember me
  button.btn(type='submit') Sign in

which renders to

<form action="http://localhost:1337/authenticated" method="POST"
  class="form-inline pull-right">
  <input type="text" placeholder="Email" name="emailInput"
    class="input-small"><input type="password"
    placeholder="Password" name="passwordInput" class="input-small"><label
    class="checkbox"><input type="checkbox"></label>
  <button type="submit" class="btn">Sign in</button>
</form>

but I need it to render as (note the tags, not the indentation) Edit: actually I need the same intendation and the "Remember me" showing up

<form class="form-inline pull-right" action="http://localhost:1337/authenticated" method="POST">
  <input type="text" class="input-small" placeholder="Email" name="emailInput">
  <input type="password" class="input-small" placeholder="Password" name="passwordInput">
  <label class="checkbox">
    <input type="checkbox"> Remember me
  </label>
  <button type="submit" class="btn">Sign in</button>
</form>

How can I fix that? Does Jade not recognize the "label" element? Edit: forget about the "label" element, this is correct.

Upvotes: 0

Views: 2202

Answers (1)

user187228
user187228

Reputation:

The text "Remember Me" needs to be a child of the label element:

label.checkbox
  input(type='checkbox')
  | Remember Me

Your example has "Remember Me" as a child of the input element, which is invalid and won't be rendered. See https://github.com/visionmedia/jade#tag-text.

Upvotes: 5

Related Questions