Using conditional templates to hide invalid dates

[Taylor Tillman]

I have a function to import data from an Excel file and if there are errors in the Excel data they are displayed in a grid. One of the grid columns is a date called Expiration which will prompt an error if the cell is empty or not formatted correctly. The database and model types are of non-nullable DateTime so even if an empty date is imported it's set to the DateTime minimum value of '01/01/0001', then displayed in the grid as '01/01/1901'.

I'm trying to use a column template with an if/else statement to hide the date if it's invalid but the documentation doesn't show how to do a more complex comparison than a boolean check. I would like to check if the Expiration date is set to the minimum DateTime value and hide it. I've tried string comparisons but the "if" statement never evaluates to true, and trying to use a Razor variable or JavaScript like "new Date()" breaks the script and it displays "#template" in each date field.

Also is it possible to apply formatting to the date within the template? In the index grid I use .Format("yMd") on the date to get "xx/xx/xxxx" but when the "else" statement in the template is run the date is displayed in long form, like "Tue Jan 01 1901 00:00:00 GMT-0600 (Central Standard Time)".

So far I have:

${if(Expiration === ???)}

     //Empty span
${else}
     ${Expiration}
${/if}

[Pavithra Subramaniyam]

Hi Taylor, 

 

Thanks for contacting Syncfusion support. 

 

You can achieve your requirement by using the custom helper function in your template. Please refer to the below code example and documentation link. 

 

[script] 

<script id="template" type="text/x-template"> 

    <div class="template_check"> 

         ${check(Expiration)} 

    </div> 

</script>  

 

<script> 

    var instance = new ej.base.Internationalization(); 

    window.check = function (value) { 

     if(value != '01/01/0001'){  //  here you can add your condition 

         // formatting the date value 

        return instance.formatDate(new Date(value), { skeleton: 'yMd', type: 'date' }); 

               }else{ 

                  return "" 

               } 

}; 

</script> 

 

Documentation link   : https://ej2.syncfusion.com/javascript/documentation/common/template-engine/#available-template-syntax 

                                         https://ej2.syncfusion.com/javascript/documentation/common/internationalization/#formatting 

 

Please get back to us if you need any further assistance on this. 

 

Regards, 

Pavithra S. 

[Taylor Tillman]

Hi Pavithra,

This worked for me. I modified it slightly and used this:

if(!value.toString().includes('Jan 01 1901')

But everything else is perfect.

Thanks!

Taylor T.

[Pavithra Subramaniyam]

Hi Taylor, 

Thanks for your update. 

Please get back to us if you need any further assistance. 

Regards, 

Pavithra S.