Run-time error

[dbrandonMember]

I am having trouble using the jqxDateTimeInput for time only input and am getting a run-time error when trying to enter the time. I am using it inside of an ASP.NET Ajax UpdatePanel so I don\’t know if that is the problem. Here is a snippet:

function initOptionsWindow() {
$(\’#divFirstStart\’).jqxDateTimeInput({ width: \’120px\’, height: \’20px\’, formatString: \’T\’, showCalendarButton: false, theme: \’darkblue\’ });
$(\’#divLastStart\’).jqxDateTimeInput({ width: \’120px\’, height: \’20px\’, formatString: \’T\’, showCalendarButton: false, theme: \’darkblue\’ });

$(\”#divFirstStart\”).jqxDateTimeInput(\”setDate\”, new Date(ConvertToDate(document.getElementById(\’\’).value)));
$(\”#divLastStart\”).jqxDateTimeInput(\”setDate\”, new Date(ConvertToDate(document.getElementById(\’\’).value)));
$(\’#divFirstStart\’).bind(\’valuechanged\’, function(event) { document.getElementById(\’\’).value = event.args.date.toTimeString(); });
$(\’#divLastStart\’).bind(\’valuechanged\’, function(event) { document.getElementById(\’\’).value = event.args.date.toTimeString(); });
$(\”#divLastStart\”).jqxDateTimeInput(\’_arrange\’);
}

The first game of the day starts at 

 and last game starts at 

The error I am getting is:

Microsoft JScript runtime error: Unable to get value of the property \’css\’: object is null or undefined

on this statement:

if(this.container.css(\”display\”)==\”block\”)

I would appreciate any guidance you can give.

TIA
Dave

[dbrandonMember]

Trying the snippet again –

            <asp:UpdatePanel ID="UpdatePanel2" runat="server">
                <ContentTemplate>
                    <div class="windowContent" style="width:880px; height:555px;">
                        <script type="text/javascript">
                            function initOptionsWindow() {
                                $('#divFirstStart').jqxDateTimeInput({ width: '120px', height: '20px', formatString: 'T', showCalendarButton: false, theme: 'darkblue' });
                                $('#divLastStart').jqxDateTimeInput({ width: '120px', height: '20px', formatString: 'T', showCalendarButton: false, theme: 'darkblue' });
                                $("#divFirstStart").jqxDateTimeInput("setDate", new Date(ConvertToDate(document.getElementById('<%=txtFirstStart.ClientID%>').value)));
                                $("#divLastStart").jqxDateTimeInput("setDate", new Date(ConvertToDate(document.getElementById('<%=txtLastStart.ClientID%>').value)));
                                $('#divFirstStart').bind('valuechanged', function(event) { document.getElementById('<%=txtFirstStart.ClientID%>').value = event.args.date.toTimeString(); });
                                $('#divLastStart').bind('valuechanged', function(event) { document.getElementById('<%=txtLastStart.ClientID%>').value = event.args.date.toTimeString(); });
                                $("#divLastStart").jqxDateTimeInput('_arrange');
                            }
                        </script>       
                        <div style="float:left">The first game of the day starts at&nbsp;</div>
                        <div id="divFirstStart"></div>
                        <div style="float:left">&nbsp;and last game starts at&nbsp;</div>
                        <div id="divLastStart" style="float:left"></div>
                        
                        <asp:Button ID="Button2" runat="server" Text="Button" /> 
                        <asp:Label ID="Label2" runat="server" Text="Label"></asp:Label>
                    </div>
                    <input id="txtFirstStart" type="hidden" runat="server" />
                    <input id="txtLastStart" type="hidden" runat="server" />
                </ContentTemplate>
            </asp:UpdatePanel>

[Peter StoevKeymaster]

Hi dbrandon,

What is the value of:

ConvertToDate(document.getElementById(”).value) and
ConvertToDate(document.getElementById(”).value)

when you start your app?

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[dbrandonMember]

Right now I am just testing by plugging the current time into those elements in HH:mm:ss format. So, for instance I just ran it in debug and it had 16:30:45 for both values.

[dbrandonMember]

Also, here is the ConvertToDate function (I borrowed it from another post in your forum)

function ConvertToDate(stringTime) {
var date = new Date();
hours = stringTime.substr(0, 2);
minutes = stringTime.substr(3, 2);
date.setHours(parseInt(hours));
date.setMinutes(parseInt(minutes));

return date;
}


[Peter StoevKeymaster]

Ok then, but why do you try to create a Date object from a Date object, if the ConvertToDate returns a Date object?

i.e

new Date(ConvertToDate(document.getElementById('<%=txtFirstStart.ClientID%>').value)) 

is something like:

new Date(new Date())

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[dbrandonMember]

That’s an excellent question. I’m afraid that was just a poor job of copying and pasting example code. I removed it but it didn’t fix my problem.

$('#divFirstStart').jqxDateTimeInput({ width: '120px', height: '20px', formatString: 'T', showCalendarButton: false, theme: 'darkblue' });
$('#divLastStart').jqxDateTimeInput({ width: '120px', height: '20px', formatString: 'T', showCalendarButton: false, theme: 'darkblue' });
                                
$("#divFirstStart").jqxDateTimeInput("setDate", ConvertToDate(document.getElementById('<%=txtFirstStart.ClientID%>').value));
$("#divLastStart").jqxDateTimeInput("setDate", ConvertToDate(document.getElementById('<%=txtLastStart.ClientID%>').value));
$('#divFirstStart').bind('valuechanged', function(event) { document.getElementById('<%=txtFirstStart.ClientID%>').value = event.args.date.toTimeString(); });
$('#divLastStart').bind('valuechanged', function(event) { document.getElementById('<%=txtLastStart.ClientID%>').value = event.args.date.toTimeString(); });

I also experimented with moving the container div outside of the UpdatePanel and still received the same error.

[Peter StoevKeymaster]

Hi dbrandon,

Could you provide a sample Date which leads to the issue?

i.e having the function:

function ConvertToDate(stringTime) {
var date = new Date();
hours = stringTime.substr(0, 2);
minutes = stringTime.substr(3, 2);
date.setHours(parseInt(hours));
date.setMinutes(parseInt(minutes));
return date;
}

What’s the initial value of stringTime and what’s the resulting Date object?

Looking forward to your reply.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[dbrandonMember]

Peter, rather than providing the input dates for stringTime, I just commented out the two calls to .jqxDateTimeInput(“setDate”, …) and I still receive the same error on the first keystroke inside the control at run-time. It doesn’t appear to be related to the format of the input datetime.

Any other ideas?

[Peter StoevKeymaster]

Hi dbrandon,

As I am unable to reproduce the reported issue locally, please send us a sample(if it is applicable) which demonstrates it to support@jqwidgets.com.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[Author]

Posts