I have a html span that display a date using moment.js in the page:

<span data-bind="text: moment(new Date(dueDate())).format('MM/DD/YYYY')"></span>

It's working fine apart if the dueDate() property is an empty string, If it's an empty string I'm getting:

01/01/1900

How can avoid that?

This is the entire div:

<div class="col-md-8">
    <ul>
      <li>DATE <span data-bind="text: moment(new Date(sDate())).format('MM/DD/YYYY')"></span></li>
      <li>Due date <span></span><span data-bind="text: moment(new Date(dueDate())).format('MM/DD/YYYY')"></span>
           <p>Days Remaining: <span class="days-remaining" data-bind="text: daysRemaining"></span></p>
      </li>
      <li>Date 2 <span></span><span data-bind="text: moment(new Date(date2())).format('MM/DD/YYYY')"></span>
           <p>Days Remaining: <span class="days-remaining" data-bind="text: daysRemaining"></span></p>
      </li>
    </ul>
</div>

I have a html span that display a date using moment.js in the page:

<span data-bind="text: moment(new Date(dueDate())).format('MM/DD/YYYY')"></span>

It's working fine apart if the dueDate() property is an empty string, If it's an empty string I'm getting:

01/01/1900

How can avoid that?

This is the entire div:

<div class="col-md-8">
    <ul>
      <li>DATE <span data-bind="text: moment(new Date(sDate())).format('MM/DD/YYYY')"></span></li>
      <li>Due date <span></span><span data-bind="text: moment(new Date(dueDate())).format('MM/DD/YYYY')"></span>
           <p>Days Remaining: <span class="days-remaining" data-bind="text: daysRemaining"></span></p>
      </li>
      <li>Date 2 <span></span><span data-bind="text: moment(new Date(date2())).format('MM/DD/YYYY')"></span>
           <p>Days Remaining: <span class="days-remaining" data-bind="text: daysRemaining"></span></p>
      </li>
    </ul>
</div>

• javascript
• date
• momentjs

• use a if condition, test if the string is empty – xShirase Commented Dec 2, 2016 at 8:17
• I'm not sure how to add an if in this context. – user3378165 Commented Dec 2, 2016 at 8:18
• You can check the answer to this question stackoverflow./questions/10577078/… – Shekhar Chikara Commented Dec 2, 2016 at 8:19
• data-bind="text: dueDate()? moment(dueDate(), format).format('MM/DD/YYYY')". Also, I'd suggest you to make dueDate a string variable and process values in your vm instead of view – Rajesh Commented Dec 2, 2016 at 8:19

1 Answer 1

You will have to add a check. If value exists, then parse value, else show blank.

this.getDateInFormat = function(str){
  var d = moment(str, DEFAULT_FORMAT);
  return str && d.isValid() ? d.format('MM/DD/YYYY') : '';
}

As mented before, you should move all parsing logic to your viewModel. This way your code is generic and your view is clean.

JSFiddle.