Custom Attributes for Buttons in jade
Problem
Hi I'm trying to code a webpage using node.js and jade. I'm trying to add a custom attribute to a button, like in HTML:
where someSpecialID is a value passed into the template by the node server. I've tried:
input(type = "button", specialID = someSpecialID, onclick = "doSomething(specialID);")
and:
input(type = "button", onclick = "doSomething(specialID);")
specialID = someSpecialID
but the custom attribute doesn't seem to take. I keep getting the error that specialID is not defined.
I'm still somewhat new to node.js and jade, so I'm sorry if this is a trivial question. I'd greatly appreciate any help on this.
Solution
I'm not sure I understand exactly the context of execution, is someSpecialID a javascript object passed as a local? Or just some placeholder, which would be like specialID=5 in your real code? (edit: ok, I missed the line where you say it's passed as a value, so I guess your case is the former)
If it's the former, you could use interpolation (between quotes, because I think Jade expects quotes, i.e.: specialID="#{someSpecialID}"
)
If it's the latter, something like this would render correctly:
input(type="button", specialID="someSpecialID", onclick="doSomething(specialID);")
You should consider using a data-special-id
attribute instead of specialID
(custom attributes are "normalized" in HTML5 with the data- prefix).
Discussion
View additional discussion.