Copy Date / DateTime from one Html Input to another Html Input with Javascript

Question

I have 2 a elements. Both open a Bootstrap modal. This a element is used to create a brand new record, and so it sends the current date/time:

<a style="color:#5cb85c" data-CreateDate="@DateTime.Now" data-toggle="modal" data-target="#OnPostModal" href="#OnPostModal" class="fas fa-plus-circle"></a>

The other a element carries some fields from a record that was already created, so it sends that pre-existing create date with it.

<a data-toggle="modal" data-target="#OnPostModal" data-CreateDate="@item.Supplier.CreateDate" href="#CallModal" class="fas fa-edit"> </a>

I use some JavaScript to fill a field on the modal that pops up:

<script type="text/javascript">
    $('a[data-toggle=modal], button[data-toggle=modal]').click(function () {

        var data_CreateDate = '';

        if (typeof $(this).data('CreateDate') !== 'undefined') {
            data_CreateDate = $(this).data('CreateDate');
        }

        $('#CreateDate').val(data_CreateDate);
    })

</script>

Lastly, this is the area in the modal that needs filled:

<div class="form-group">
   <label asp-for="Supplier.CreateDate" class="control-label"></label>
   <input asp-for="Supplier.CreateDate" id="CreateDate" class="form-control" />
   <span asp-validation-for="Supplier.CreateDate" class="text-danger"></span>
</div>

This method works for string values, but doesn't seem to work at all for DateTime or Date values. I have tried:

var data_CreateDate = new Date();

That doesn't work.

Does this answer your question? How to set datetime on datetime-local via jQuery — Heretic Monkey
– Heretic Monkey, Commented Apr 6, 2020 at 16:23
@HereticMonkey If I change the modal input to no validation, the string value of "4/6/2020 2:01:52 PM" but as soon as I add the asp-for="Supplier.CreateDate" the date is no longer passed. I think it's as you said, the format needs tweaked to match the asp-for validation. — CusterN
– CusterN, Commented Apr 6, 2020 at 18:21
input type="datetime" has been deprecated in favor of input type="datetime-local". The format required for setting the value of such an input is described in the answers to the question I linked to... — Heretic Monkey
– Heretic Monkey, Commented Apr 6, 2020 at 18:32
@HereticMonkey the documentation on tag helpers learn.microsoft.com/en-us/aspnet/core/mvc/views/… states that because my Supplier.CreateDate is a DateTime, the implementation adds the type="datetime-local" so I don't think that's the issue. Though, the moment I add that, the date stops being passed. — CusterN
– CusterN, Commented Apr 6, 2020 at 20:30

terrymorse · Accepted Answer · 2020-04-06 17:49:24Z

1

new Date() returns an object. You want a string. Several formats to choose from:

const output = document.getElementById('output');
const d = new Date();
output.innerText = d.toString() + '\n';
output.innerText += d.toISOString() + '\n';
output.innerText += d.toGMTString() + '\n';
output.innerText += d.toLocaleDateString() + '\n';
output.innerText += d.toUTCString() + '\n';

<pre id="output"></pre>

answered Apr 6, 2020 at 17:49

terrymorse

7,1561 gold badge23 silver badges31 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Heretic Monkey Over a year ago

The format required for input type="datetime-local" is well established and documented, in the answers to the question I linked to an hour before you answered...

terrymorse Over a year ago

Browser support for input type="datetime-local" is currently limited. Not supported in Firefox and Safari.

Heretic Monkey Over a year ago

So, better than type="datetime" ;) iOS Safari supports it, interestingly.

Collectives™ on Stack Overflow

Copy Date / DateTime from one Html Input to another Html Input with Javascript

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related