3. How to show date/time automatically using ons-input

Notice: The Monaca & Onsen UI Community Forum is shutting down.

For Onsen UI bug reports, feature requests and questions, please use the Onsen UI GitHub issues page. For help with Monaca, please contact Monaca Support Team.

Thank you to all our community for your contributions to the forum. We look forward to hearing from you in the new communication channels.

How to show date/time automatically using ons-input

  • L

    Hello Gurus,
    I’ve searched the forum, but haven’t been able to find an answer to my simple question. I’m trying to create an Activity Log. The log uses <ons-input> forms. I am not good at javascript and have tried solutions found both via stack overflow and the internet, but nothing seems to work.

    I know this is a simple thing. I’d like to have the ```
    <ons-input type=“date”> </ons-input>

    
As it stands now, when I run the program, I get: mm/dd/yy in the input area.

Any help would be appreciated. I like the tutorials very much and the Playground is so helpful. I'm sorry to have to post such a simple question here.

TIA
-Rachel
    0
  • L

    OK, thanks again to stack overflow, I found the answer to my question. I’m posting it here because I’ve seen other similar questions in the forum that were never answered. Maybe this will help someone else.

    My onsen-ui Html5:

    <div style="text-align: center; margin-top: 30px;margin: bottom 0;">
        <ons-input type="text" id="date" >
      </ons-input>
      </div>

      <div style="text-align: center; font-size:small; margin-top: 0px;">
        <ons-input type="text" id="time" >
      </ons-input>
      </div>

    The code is pure javascript and was posted by a coder (sorry I don’t have his name) on stack overflow. I do not take credit for it, but I’m grateful for his sharing. 😁

    // get a new date (locale machine date time)
var date = new Date();
// get the date as a string
var n = date.toDateString();
// get the time as a string
var time = date.toLocaleTimeString();

// find the html element with the id of "date"
// set the innerHTML of that element to the date a space the time
document.getElementById('date').innerHTML = n; //date
document.getElementById('time').innerHTML = time;
});

    -Rachel

    0