I was using SharePoint Date time Control, I want to hide this user control.But date time control textbox is hiding but the Calendar image is not hiding.

 else if (document.getElementById('<%=ddlColumnName1.ClientID %>').value == 'RenewOrExpiryDate') {
                    document.getElementById('<%=dtRenewOrExpiryDate1.Controls[0].ClientID%>').style.visibility = 'hidden';

i used this one but only it was hide Textbox of SharePoint Date time Control. How can i hide both Image and textbox of SharePoint Date time Control.

Date time control if user does not select any date also it will select by default today date.How can i make date field is empty.

Before,It was like this. see this image after hiding only image display.



  • Is it OOTB form or custom? – Gaurravs Sep 16 '16 at 6:13
  • no it is a custom form – elina Sep 16 '16 at 6:19
  • add below css to your code, it will hide SharePoint Datetime controls – Gaurravs Sep 16 '16 at 6:23
  • You should clearly state question. You have not mentioned you need to hide date time control on dropdown selection only – Gaurravs Sep 16 '16 at 6:43
  • refer updated answer – Gaurravs Sep 16 '16 at 7:34

Try below code, It will hide both textbox and image of dtRenewOrExpiryDate field

else if (document.getElementById('<%=ddlColumnName1.ClientID %>').value == 'RenewOrExpiryDate')
    var dtRenewOrExpiryDate=document.getElementById('<%=dtRenewOrExpiryDate1.Controls[0].ClientID%>');
  • i cant hide tr because in one tr i have more use controls.within tr i have two drop downs,textbox,and three date-time control.SO i want to hide only one date time control based on that dropdown selection. – elina Sep 16 '16 at 8:03
  • updated my answer..try it. – SP Developer Sep 16 '16 at 8:13
  • hi vishal actually its not a separate td.within one tr one td i have this two drop downs,textbox,and three date-time control. – elina Sep 16 '16 at 9:26
  • Are you tried it. i think it will work. because SharePoint Date time Control will generate separate table for it at run time. – SP Developer Sep 16 '16 at 9:45
  • I tested it. its hiding both textbox and image. Date-time control will wrap into table on page load. – SP Developer Sep 16 '16 at 17:46

For your scenario, This will hide (text box and image of calendar both) . Tested

else if (document.getElementById('<%=ddlColumnName1.ClientID %>').value == 'RenewOrExpiryDate') {
          document.getElementById('<%=dtRenewOrExpiryDate1.Controls[0].ClientID%>').style.visibility = 'hidden';
          document.getElementById("<%= dtRenewOrExpiryDate1.ClientID%>" + "_dtRenewOrExpiryDate1DateDatePickerImage").style.visibility = 'hidden';

Generic : If you want to hide all date time controls on page, (text box and image of calendar both) Add below custom css to your code/Page :

    display : none !important;
  • It will hide all date time controls on form..So don't use this. Apart from this, the Question is asked for custom form not OOTB form. – SP Developer Sep 16 '16 at 6:25
  • this will hide whole page.Based on that dropdown selection only i want to hide date time control. – elina Sep 16 '16 at 6:28
  • I did mentioned that It will hide all datetime controls, before @Suganya clearly mentioned that it is custom form and not ootb – Gaurravs Sep 16 '16 at 6:35
  • What is meaning of downvoting if question was not clear stating – Gaurravs Sep 16 '16 at 6:36
  • @VishalMPatil Doest that mean OOTB css overriding doesnt work in custom form ?? – Gaurravs Sep 16 '16 at 6:39

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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