MS CRM Customization: Date Time

Tuesday, January 20, 2015

Show only Time for Date Time Attribute

In CRM you can show only Date part of date time attribute, but not only time.

To show only date part of date time attribute, you need to go field customization and change Format as Date.

You can show only time for date time attribute either by modifying CRM entity form HTML using Javascript or by adding web resource.

Modifying CRM form HTML (DOM) is not supported, so I will go with web resource.

1. Add HTML web resource on your form.

2. Set HTML web resource properties like, Number of rows, scrolling border, formatting etc.

3. Add web resource on your form, This HTML web resource should be look like attribute on Form, so set properties accordingly.

4. Add Jquery latest library in your entity form libraries.

5. Add Following code into you HTML web resource.

	<html><head>
	<title></title>
	<script type="text/javascript" src="new_jquery_1.10.2.js"></script>
	<script type="text/javascript">
	$(document).ready(function () {
	$("#OnlyTime").change(function () {
	debugger;
	var selectedTime = this.value;

	var selected = $("#OnlyTime option:selected").text();

	var arr = selected.split(':');
	var hours = arr[0];
	var mins = arr[1].split(' ')[0];
	var AMPM = arr[1].split(' ')[1];

	if (AMPM == "PM")
	hours = 12 + parseInt(hours);

	var dateObj = new Date();
	dateObj = new Date(1900, 01, 01, hours, mins, 0, 0);

	//Set selected time to Date time attribute
	parent.Xrm.Page.getAttribute("new_date").setValue(dateObj);
	});
	});
	</script>
	<meta charset="utf-8">

	</head><body>
	<select id="OnlyTime">
	<option value="0000">12:00 AM</option>
	<option value="0030">12:30 AM</option>
	<option value="100">1:00 AM</option>
	<option value="130">1:30 AM</option>
	<option value="200">2:00 AM</option>
	<option value="230">2:30 AM</option>
	<option value="300">3:00 AM</option>
	<option value="330">3:30 AM</option>
	<option value="400">4:00 AM</option>
	<option value="430">4:30 AM</option>
	<option value="500">5:00 AM</option>
	<option value="530">5:30 AM</option>
	<option value="600">6:00 AM</option>
	<option value="630">6:30 AM</option>
	<option value="700">7:00 AM</option>
	<option value="730">7:30 AM</option>
	<option value="800">8:00 AM</option>
	<option value="830">8:30 AM</option>
	<option value="900">9:00 AM</option>
	<option value="930">9:30 AM</option>
	<option value="1000">10:00 AM</option>
	<option value="1030">10:30 AM</option>
	<option value="1100">11:00 AM</option>
	<option value="1130">11:30 AM</option>
	<option value="1200">12:00 PM</option>
	<option value="1230">12:30 PM</option>
	<option value="1300">1:00 PM</option>
	<option value="1330">1:30 PM</option>
	<option value="1400">2:00 PM</option>
	<option value="1430">2:30 PM</option>
	<option value="1500">3:00 PM</option>
	<option value="1530">3:30 PM</option>
	<option value="1600">4:00 PM</option>
	<option value="1630">4:30 PM</option>
	<option value="1700">5:00 PM</option>
	<option value="1730">5:30 PM</option>
	<option value="1800">6:00 PM</option>
	<option value="1830">6:30 PM</option>
	<option value="1900">7:00 PM</option>
	<option value="1930">7:30 PM</option>
	<option value="2000">8:00 PM</option>
	<option value="2030">8:30 PM</option>
	<option value="2100">9:00 PM</option>
	<option value="2130">9:30 PM</option>
	<option value="2200">10:00 PM</option>
	<option value="2230">10:30 PM</option>
	<option value="2300">11:00 PM</option>
	<option value="2330">11:30 PM</option>
	</select>
	</body></html>