jQuery UI Widgets Forums Editors DateTimeInput setting date in jqxdatetimeinput not working

This topic contains 3 replies, has 2 voices, and was last updated by  Martin 5 days, 14 hours ago.

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author

  • RobWarning
    Participant

    in an asp net core app I create an jqxwindow. this is in my cshtml file:

    <div id="SickWindow" class="sickWindow">
            <div id="windowHeader">
                <h3 id="sickheader">Set sick.</h3>
            </div>
            <div style="overflow:hidden;" id="windowContent">
               <label for="van">Van: </label>
                <div id="van"></div>
                <label for="tot">Tot:</label>
                <div id="tot"></div>
                <hr />
                <div id="SickSlider"></div>
                <hr />
                <button id="sickSubmit" type="button">Submit!</button>
                <button id="sickCancel" type="button">Cancel!</button>
                <input type="hidden" id="sickUserId" />
            </div>
        </div>

    the in my js file I create two jqxDateTimeInputs:

      //create the sick window
        $('#SickWindow').jqxWindow({
            showCollapseButton: true,
            autoOpen: false,
            isModal: true,
            okButton: $('#sickSubmit'),
            cancelButton: $('#sickCancel'),
            maxHeight: 400,
            maxWidth: 700,
            minHeight: 200,
            minWidth: 200,
            height: 300,
            width: 500,
            initContent: function () {
                $('#van').jqxDateTimeInput({ width: '200px', height: '25px' });
                $('#tot').jqxDateTimeInput({ width: '200px', height: '25px' });
                $('#SickWindow').jqxWindow('focus');
                $('#sickSubmit').click(function () {
                    var van = $('#van').jqxDateTimeInput('getDate');
                    var tot = $('#tot').jqxDateTimeInput('getDate');
                    requestSick(CMUserId, van, tot);  //SignalR function
                    $('#SickWindow').jqxWindow('close');
                });
            }
        });

    now after a SignalR call I want to set the Dates to a default value:

    $(‘#Resetvan’).jqxDateTimeInput(‘setDate’, “2018, 10, 2”);
    $(‘#Resettot’).jqxDateTimeInput(‘setDate’, “2019, 2, 3”);
    $(‘#sickResetWindow’).jqxWindow(‘open’);

    This will not work the datetimeinput boxes keep showing the present day!
    what am I doing wrong?


    RobWarning
    Participant

    sorry the last part of the message should be:

    $(‘#van’).jqxDateTimeInput(‘setDate’, “2018, 10, 2”);
    $(‘#tot’).jqxDateTimeInput(‘setDate’, “2019, 2, 3”);
    $(‘#sickWindow’).jqxWindow(‘open’);

    I also try to put the jqxwindow(‘open’) line first. but at no succes.


    RobWarning
    Participant

    I have found the problem to be a timing issue.
    if I have my cshtml like this:

    <body>
        <h1>Test jqwidgets</h1>
        <div id="Mywindow" class="dialog">
            <div id="windowHeader">Header</div>
            <div id="windowContent">
                MyContent<hr />
                <div class="inline">
                    <label for="MyInput1">input1</label>
                    <div id="MyInput1"></div>
                </div>
                <div class="inline">
                    <label for="MyInput2">input2</label>
                    <div id="MyInput2"></div>
                </div>
            </div>
        </div>
        <button id="MyButton">click</button>
    
    </body>

    and my js like this:

    $(document).ready(function () {
        
        $('#MyButton').click(function () {
            $('#Mywindow').jqxWindow('open');
            $('#MyInput1').jqxDateTimeInput('setDate', '2014, 5, 15');
        });
    
        $('#Mywindow').jqxWindow({
            autoOpen:false,
            position: { x: 100, y: 100 },
            width: 300,
            height: 200,
            showCollapseButton: true,
            maxHeight: 400,
            maxWidth: 700,
            minHeight: 200,
            minWidth: 200,
            initContent: function () {
                $('#MyInput1').jqxDateTimeInput({
    
                });
                $('#MyInput2').jqxDateTimeInput({
                });
            }
        });
    });

    The date will not set!

    if I put a slight delay after the window open it works ok:

    $(document).ready(function () {
        
        $('#MyButton').click(function () {
            $('#Mywindow').jqxWindow('open');
            setTimeout(setDate, 1000);
        });
    
        
        var setDate = function () {
            $('#MyInput1').jqxDateTimeInput('setDate', '2014, 5, 15');
        };
    
        $('#Mywindow').jqxWindow({
            autoOpen:false,
            position: { x: 100, y: 100 },
            width: 300,
            height: 200,
            showCollapseButton: true,
            maxHeight: 400,
            maxWidth: 700,
            minHeight: 200,
            minWidth: 200,
            initContent: function () {
                $('#MyInput1').jqxDateTimeInput({
    
                });
                $('#MyInput2').jqxDateTimeInput({
                });
            }
        });
    });

    I think this is a bug in the jqwidgets DateTimeInput.
    But I hope it will serve others.


    Martin
    Participant

    Hello RobWarning,

    Thank you for your feedback and contribution!

    Best Regards,
    Martin

    jQWidgets Team
    https://www.jqwidgets.com/

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.