You are viewing limited content. For full access, please sign in.

Question

Question

Removing the date picker in forms

asked on May 19, 2016

I have a form with "Start Date" and "End Date" fields with the date picker calendar icons. The problem is that when I use hose fields as variable fields in any other forms and change the date fields to "read only," the date fields shrink in size and no longer display the full date (it gets cut off around the day like 05/18/) and I've tried to use CSS to expand them but because I have them in inline block it gets messed up. 

 

What I did was add javascript:

 

$(document).ready(function(){
  $('.date1 input').attr('readonly',true);
  $('.date2 input').attr('readonly',true);
});

 

This changes it to read only on its own, even tho its not set to read only thru the settings in the layout and its looks great, then fields are wide like they should be. Only problem now is the minute you click on the calendar icon the field shrinks again. 

 

 

how can i get these fields to stay in full wider form?

 

Thank You

 

0 0

Replies

replied on May 19, 2016

Have you tried using CSS to address the problem? Suppose you assign a class MyDate to your two date fields. Set them to Read Only in the form layout, and then use the following:

.MyDate {display:inline-block}
.MyDate input {width:100%}

I imagine you already have something like the first part there, based on what you mentioned in your post. The second part should force the input box to be 100% of its parent container width.

0 0
You are not allowed to follow up in this post.

Sign in to reply to this post.