CODEWITHSUNDEEP
pythonflaskjinja2momentjs
Mark
Mark

Reputation: 4109

Trouble rendering momentjs timestamp inside of an html select field

I am writing a Flask website in which I need to report dates to users in their own time zones. After some research, it seems that the appropriate means by which to achieve this is momentjs. Accordingly, I have installed Flask-Moment and gave it a whirl.

If I simply open up my jinja2 template and add the line: moment(someTimestamp).format('lll')

Then I see exactly what I expect: the properly formatted timestamp in the user's time zone.

My issue is that when I try and do the same exact thing but have it be part of a form's select option, it does not render correctly. In particular, I see the timestamp seemingly as if the momentjs/Flask-Moment script has not recognized that it is on the page.

Minimal jinja2 template example that shows my issue:

<html>
  <body>
    <form>
      <select>
        <option>{{ moment(someTimestamp).format('lll') }}</option>
      </select>
    </form>

    {{ moment.include_jquery() }}
    {{ moment.include_moment() }}
  </body>
</html>

My output consists of a select field whose contents are "2014-02-28T04:58:52Z". I can only assume that this is the raw time meant to be rendered by momentjs and that it is not being recognized. If I look at the Flask-Moment source, I believe that this line may be likely to grant insights to anyone able to help.

How can I make this render correctly?

Upvotes: 0

Views: 1092

Answers (1)

Sean Vieira
Sean Vieira

Reputation: 159985

You need to set a class of flask-moment on your option:

<select>
    <option class="flask-moment"></option>
</select>

You will also need to set data-timestamp and data-format attributes, but the code is doing some wonky things with eval, so getting the data right for those attributes may take a bit of checking on the actual HTML code produced by {{ moment(someTimestamp).format('lll') }} to get right.

A pull request to fix this may be in order ...

Upvotes: 2

Related Questions