1

I have a 3 date picker fields. I have disabled the field but the date picker icon is fully functioned. Can any one tell me how to disable it's function?

2 Answers 2

1

To hide the datepicker image use css,

<style> .ms-dtinput > a { display: none; } </style>

Update

Using pure JavaScript

<script type="text/javascript"> function clickDatePicker() { document.getElementsByTagName('a').onclick = null; } </script>

This will disable all date pickers on the page. I tested on item edit page with Script editor webpart.

3
  • thank you,i don't want to hide but disable it
    – sandhya v
    Oct 11, 2017 at 14:47
  • you welcome!. I updated my answer. Tested on my test environment.
    – Billy
    Oct 11, 2017 at 15:45
  • I don't want to disable all...only 2 out of 3 should be disabled
    – sandhya v
    Oct 11, 2017 at 17:28
0

try this,

<script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js”></script>
<script>
$(document).ready(function()
{
$(“input[title$=’ShowFields’]”).click(function()//metion field names that you need to be in your form 
{

$(“input[title$=’datepicker1’]”).parent(‘span’).parent(‘td’).parent(‘tr’).toggle();//mention the field names that you need to hide or disable from your form 
$(“input[title$=’datepicker2’]”).parent(‘span’).parent(‘td’).parent(‘tr’).toggle();//mention the field names that you need to hide or disable from your form
$(“input[title$=’datepicker3’]”).parent(‘span’).parent(‘td’).parent(‘tr’).toggle();//mention the field names that you need to hide or disable from your form

});

});
</script>

try this too

How to make datepicker readonly from javascript?

try this too

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>    
<script type="text/javascript">   
$(function() {   
$( "td.ms-dtinput > input[id$='DateTimeFieldDate']" ).attr('readonly', 'readonly');    
$( "td.ms-dtinput > a" ).attr('onclick','').unbind('click');   });  
 </script> 
5
  • It's not working.The date picker functionality is still not disabled
    – sandhya v
    Oct 11, 2017 at 17:34
  • did you tried below-posted URL ..?(How to make datepicker read-only from javascript?)
    – karthik
    Oct 11, 2017 at 18:33
  • It disables all date fields. I want to disable specific fields
    – sandhya v
    Oct 12, 2017 at 15:11
  • replace id$='DateTimeFieldDate' with title$=’datepicker title’ $( "td.ms-dtinput > input[title$=’datepicker title’ ]" ).attr('readonly', 'readonly');
    – karthik
    Oct 12, 2017 at 17:08
  • Then also it's not working :(
    – sandhya v
    Oct 16, 2017 at 9:16

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.