none
Date filter web part

    Question

  • Hi,

    Is there anyway of displaying the date filter web part as a date picker by default instead of as a field with the calendar icon?

    Cheers.


    • Edited by VindaRosa Monday, November 7, 2016 2:56 PM rewording
    Monday, November 7, 2016 2:55 PM

Answers

  • Hi,

    If you want the calendar date selector image/icon show, you just need remove the first code logic:

    $($('#WebPartWPQ2').find('td.ms-dtinput').find('img')).css('width','0px');

    Best Regards,

    Lee


    Please remember to mark the replies as answers if they help.
    If you have feedback for TechNet Subscriber Support, contact tnmff@microsoft.com

    Friday, November 25, 2016 5:45 AM

All replies

  • Here is one workaround for your reference.

    Insert content editor web part/script editor web part. Insert the sample code(you need change the ID based on your control):

        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
        <script type="text/javascript">
            $(function () {
                $($('#WebPartWPQ2').find('td.ms-dtinput').find('img')).css('width', '0px');
                $('input.ms-input').click(function () {
                    clickDatePicker("ctl00_ctl41_g_ffd5e418_0d54_4fd6_83a1_c5951722563b_DateFilterPicker_DateFilterPickerDate", "\u002fsites\u002fdev\u002f_layouts\u002f15\u002fiframe.aspx?&cal=1&lcid=1033&langid=1033&ww=0111110&fdow=0&fwoy=0&hj=0&swn=False&minjday=109207&maxjday=2666269&date=", "", event);
                    return false;
                });
            })
        </script>

    Best Regards,

    Lee


    Please remember to mark the replies as answers if they help.
    If you have feedback for TechNet Subscriber Support, contact tnmff@microsoft.com

    Tuesday, November 8, 2016 3:05 AM
  • Cheers Lee 

    Added the following in a script editor webpart with the jquery link and it doesnt appearto do anything?

      <script type="text/javascript">
            $(function () {
                $($('#WebPartWPQ2').find('td.ms-dtinput').find('img')).css('width', '0px');
                $('input.ms-input').click(function () {
                    clickDatePicker("ctl00_ctl40_g_a52f3332_bdfb_4a04_b333_905eca1680fd_DateFilterPicker_DateFilterPickerDate", "\u002fsites\u002fdev\u002f_layouts\u002f15\u002fiframe.aspx?&cal=1&lcid=1033&langid=1033&ww=0111110&fdow=0&fwoy=0&hj=0&swn=False&minjday=109207&maxjday=2666269&date=", "", event);
                    return false;
                });
            })
        </script>

    Tuesday, November 8, 2016 3:20 PM
  • Hi,

    Below is what I tested, you could try to check if the jQuery works properly (especially for the selector), the main logic is setting the image width to 0, and bind click event on input.

    Best Regards,

    Lee


    Please remember to mark the replies as answers if they help.
    If you have feedback for TechNet Subscriber Support, contact tnmff@microsoft.com

    Wednesday, November 9, 2016 1:37 AM
  • Hi,

    Is any update for your issue?

    Best Regards,

    Lee


    Please remember to mark the replies as answers if they help.
    If you have feedback for TechNet Subscriber Support, contact tnmff@microsoft.com

    Tuesday, November 22, 2016 6:10 AM
  • Ah ok got that working now thanks, but its not exactly what i wanted I want the calendar date selector to be constantly viewable.

    Thursday, November 24, 2016 9:28 AM
  • Hi,

    If you want the calendar date selector image/icon show, you just need remove the first code logic:

    $($('#WebPartWPQ2').find('td.ms-dtinput').find('img')).css('width','0px');

    Best Regards,

    Lee


    Please remember to mark the replies as answers if they help.
    If you have feedback for TechNet Subscriber Support, contact tnmff@microsoft.com

    Friday, November 25, 2016 5:45 AM