Wednesday, December 2, 2015

Convert C# DateTime type to JavaScript Date property

When a web method or service serialize an object and pass it to client side with DateTime properties, We need to cast the C# DateTime to JavaScript Date format so that we can treat it as a valid date property. The below method can be used to cast the c# datetime property in to javascript date property.

1. The entity class

 public class icqQuestResourcePrior  
 {  
   public int idQuestPrior { get; set; }  
   public int idResource { get; set; }  
   public int sqOrder { get; set; }  
   public bool flDevFinish { get; set; }  
   public int idQuest { get; set; }  
   public DateTime dtBegin { get; set; }  
   public DateTime? dtEnd { get; set; }  
   public string lbQuest { get; set; }  
   public string lbPersonInitials { get; set; }  
   public int nvWeekNumber { get; set; }  
   public string coType { get; set; }  
   public string coLifeCycle { get; set; }  
   public string lbLateColor { get; set; }  
   public string lbPersonName { get; set; }  
   public int idPerson { get; set; }  
 }  

2. Web Method

 [WebMethod]  
   public string icqQuestResourcePriorGet(int idQuest, int? idPerson, int? idResource, int? idQuestPrior)  
   {  
     return new JavaScriptSerializer().Serialize(new icqHome().icqQuestResourcePriorGet(idQuest, idPerson == 0 ? (int?)null : idPerson, idResource == 0 ? (int?)null : idResource, idQuestPrior == 0 ? (int?)null : idQuestPrior));  
   }  

3. JQuery AJAX Call

 function LoadWRDetails() {  
   var objPara = {  
     idQuest: $("#hdnWRIdQuest").val(),  
     idPerson: 0,  
     idResource: 0,  
     idQuestPrior: 0  
   };  
   $.ajax({  
     type: "POST",  
     url: $('#hdnUrlPrefix').val() + "IPODCommonWS.asmx/icqQuestResourcePriorGet",  
     data: JSON.stringify(objPara),  
     contentType: "application/json; charset=utf-8",  
     dataType: "json",  
     success: function (msg) {  
       var ret = JSON.parse(msg.d);  

       var re = /-?\d+/;  
       var StartDate = re.exec(ret.dtBegin); // returns "/Date(1245398693390)/";   
       var txtWRStartDate = new Date(parseInt(StartDate[0]));  
       var EndDate = re.exec(ret.dtEnd); // returns "/Date(1245398693390)/";   
       var txtWREndDate = new Date(parseInt(EndDate[0]));  

       var dtBegin = (txtWRStartDate.getUTCDate()) + "-" + (txtWRStartDate.getMonth() + 1) + "-" + txtWRStartDate.getFullYear();  
       var dtEnd = (txtWREndDate.getUTCDate()) + "-" + (txtWREndDate.getMonth() + 1) + "-" + txtWREndDate.getFullYear();  
       $('#txtWRIdQuest').val(ret.idQuest);  
       $('#txtWRTitle').val(ret.lbQuest);  
       $('#txtWRResource').val(ret.lbPersonName);  
       $('#txtWRStartDate').val(dtBegin);  
       $('#txtWREndDate').val(dtEnd);  
       $('#txtWROrder').val(ret.sqOrder);  
       $('#hdnWRIdQuest').val("0");  
       $('#txtWREndDate').datepicker('destroy');  
       $("#txtWREndDate").datepicker(  
       {  
         dateFormat: 'dd-mm-yy',  
         minDate: $('#txtWRStartDate').val()  
       });  
     },  
     error: function (err) {  
       alert(err.responseText);  
     }  
   });  
 }  

Copy the code and try yourself. 


No comments:

Post a Comment