Update the form field with today's date in a JHipster application

In our current project in JHipster, we are facing a challenge with setting the default value of a form field as the current date.

JHipster offers a moment format for dates, which is essentially an ngbdatepicker. However, when attempting to change the input type to "date," we encountered issues assigning a moment instance with a date. Even trying to typecast a new date object as a moment resulted in error messages being displayed in the template.

We would appreciate any insights or solutions you may have on this matter.

Thank you in advance.

htmlangularjstypescriptjhipsterjhipster-registry

Answer №1

After some experimenting, I've discovered a workaround for resolving this issue:

To fix it, simply convert your standard date object to a moment object after importing the moment library:

import * as moment from 'moment';

Then, convert your field like so:

your_form_field = moment(new Date());

For example: 

this.mstSite.siteUpdatedOn = moment(new Date());

I trust that this will address your concerns.

...Cheers...

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

How can I ensure that TypeScript recognizes when I add a missing property back to an object in this scenario?

I recently came across an issue while using Typescript: Omit nested property and ended up encountering more complex errors. So my question remains - how can I replace multiple nested props on a TypeScript input in the convert function? P.S. On a side not ...

typescript

Unearthing the worth of the closest button that was clicked

I am currently working on a profile management feature where I need to add students to the teacher's database. To achieve this, I am using jQuery and AJAX. However, I am encountering an issue where clicking the "add" button for each student listed on ...

javascriptjqueryhtmlajax

The image is not properly aligned with the background image

I'm currently working on a page design using bootstrap and css where I want images to fade and reveal the background when hovered over. The challenge I'm facing is that although all images are set to 100px in size, there is white space visible ar ...

htmlcssimagetwitter-bootstrap

The combination of jQuery, using .load method in javascript to prevent scrolling up, making XMLHttpRequest requests, updating .innerHTML elements, and troubleshooting CSS/JS

While utilizing this code, CSS and Javascript are disabled (only HTML loads): function loadContent(limit) { var xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function() { if (xhttp.readyState == 4 && xhttp.status ...

javascriptjqueryhtmlcssajax

What could be the reason why this LESS CSS is not taking effect?

Why won't this stylesheet load properly? The desired background color is supposed to be similar to cadetblue. You can view my page with the linked home.less.css at: ...

javascripthtmlcssless

Submit image and transfer it to server using AngularJS and Jersey

I need help with my form that contains the following fields: <div class="form-group"> <label>Username</label> <input type="text" ng-model="username" class="form-control"> </div> <div class="from-group"> < ...

javaangularjsimagejersey

The Zoom CSS property seems to be experiencing some issues on the Firefox browser

After researching the issue, I discovered several solutions involving css3 transition techniques. Currently, I have been using {zoom:1.5} for all of my buttons. However, this method does not work on Firefox. When attempting to implement the transition pro ...

htmlcss

Adjust dropdown options based on cursor placement within textarea

I have a textarea and a dropdown. Whenever a user selects an option from the dropdown menu, it should be inserted into the text area. However, I am facing a bug where the selected value is being inserted at the end of the text instead of at the current cur ...

javascripthtmlangulartypescript

Managing and keeping track of a universal value within the success callback function among numerous Ajax POST requests

I am faced with a challenge involving two HTML elements: 1). a div element that functions as a multiple select, created automatically by a predefined widget, and 2). a button that triggers an onclick event. On the JavaScript side, I have a global variable ...

javascripthtmljqueryajax

Sending an Angular $http post request to a MVC action but the parameter is coming through as

After posting this content: $http.post(Common.blog.save, { blog: blog }) .then(saveBlogComplete) .catch(function(message) { }); The Fiddler output I receive is as follows: {"blog":{"title":"Chicken Is Good","content":"#Chicken Is Good\ ...

javascriptasp.net-mvcangularjs

What is the best approach to include two ng-contents within a single template and manage them using *ngIf?

Presently, I am dealing with an Angular 2 component that is designed to showcase a Bootstrap 3 button group. This particular component has the capability of having a label or standing alone. In order to address this, I opted to utilize two ng-contents con ...

angularjstwitter-bootstraptwitter-bootstrap-3angularangular2-components

Calculating the time difference in days, hours, minutes, and seconds between two UNIX timestamps

I have a special occasion coming up, and the date and time for this event are stored in a Unix timestamp format. Instead of relying on a plugin like modern.js, I am trying to figure out the time difference between today's date and the event date usin ...

javascripthtmljqueryunix-timestamp

Combine objects by selecting attributes from multiple objects

declare type A = {type: 'TypeA', attr1: string} declare type B = {type: 'TypeB', attr2: string} declare type U = A | B When I use type X = Pick<U, 'type'>, I get: { type: 'TypeA' | 'TypeB' } But I a ...

typescript

Using private members to create getter and setter in TypeScript

Recently, I developed a unique auto getter and setter in JavaScript which you can view here. However, I am currently unsure of how to implement this functionality in TypeScript. I am interested in creating an Object Oriented version of this feature if it ...

javascriptooptypescriptgetter-setter

Tips for adding color to the <td> element in an ejs file using nodeJS

I am looking to incorporate a color into my .ejs file. Here is the code snippet I am working with: <% resultList.forEach(function(item, index){ %> <tr> <td><%= item.function %></td> <td><%= item.value %>< ...

javascripthtmlcssnode.jsejs

CSS error with contrasting colors, the reason behind it is unknown

Here is the code snippet I am working on: I have set the background color to #f1f5ff and the font color to #181818. Despite thinking that the contrast is good, I am still encountering an error where the text is not visible. I have tried changing 'c ...

htmlcss

How can the panel within an accordion be enlarged or minimized?

Currently, I am implementing an accordion feature with the option to expand or collapse all panels using two buttons. My goal is to allow users to manage each panel within the accordion individually. However, I have encountered an issue that needs attenti ...

angulartypescriptprimeng

Searching and indexing HTML content using Solrj in Java

I have knowledge on how to index a downloaded HTML page using the following code: ContentStreamUpdateRequest up = new ContentStreamUpdateRequest("/update/extract"); up.addFile(new File(fileName), solrId); up.setParam("literal.id", solrId); up ...

javahtmlsolrsolrj

Encountering an "Angularjs 1.2.x Injector:modulerrr" error, even after successfully incorporating ngRoute

I am currently learning angularjs and I have encountered a persistent error. Despite multiple attempts at troubleshooting, I have been unable to resolve it. Here is the code that I have: index.html <!doctype html> <html ng-app="myApp"> <he ...

javascriptjqueryangularjs

Verifying callback type in Typescript based on another argument's validity

There is a JavaScript function that I am working with: const fn = (cb, param) => { cb(param); }; This function is meant to be called in two ways within TypeScript: const cb0 = () => {}; fn(cb0); const cb1 = (param: string) => { }; fn(cb1, &a ...

typescriptgenericstypescript-generics