JqxCalendar: Difference between revisions

From NSB App Studio
Jump to navigation Jump to search
No edit summary
No edit summary
 
Line 10: Line 10:
This control is well documented on the jqWidget's website:  http://www.jqwidgets.com/jquery-widgets-documentation/.
This control is well documented on the jqWidget's website:  http://www.jqwidgets.com/jquery-widgets-documentation/.


== Example (Basic) ==
== Example ==


<pre>
<tabber>
JavaScript=
<syntaxhighlight lang="JavaScript">
function Main() {
  $("#jqxWidget").jqxCalendar({ value: $.jqx._jqxDateTimeInput.getDateTime(new Date(2011, 9, 1)) });
}
 
Calendar1.oncellSelected = function()
  alert($("#Calendar1").jqxCalendar("getDate"));
}</syntaxhighlight>
|-|
BASIC=
<syntaxhighlight lang="vb.net">
Sub Main()
Sub Main()
   $("#jqxWidget").jqxCalendar({ value: $.jqx._jqxDateTimeInput.getDateTime(new Date(2011, 9, 1)) });
   $("#jqxWidget").jqxCalendar({ value: $.jqx._jqxDateTimeInput.getDateTime(new Date(2011, 9, 1)) });
Line 19: Line 31:
Function Calendar1_oncellSelected()
Function Calendar1_oncellSelected()
   MsgBox $("#Calendar1").jqxCalendar("getDate")
   MsgBox $("#Calendar1").jqxCalendar("getDate")
End Function
End Function</syntaxhighlight>
</pre>
</tabber>
 
== Example (JavaScript) ==
<pre>
function Main() {
  $("#jqxWidget").jqxCalendar({ value: $.jqx._jqxDateTimeInput.getDateTime(new Date(2011, 9, 1)) });
}
 
Calendar1.oncellSelected = function()
  alert($("#Calendar1").jqxCalendar("getDate"));
}
</pre>


== FastClick Fix ==
== FastClick Fix ==

Latest revision as of 17:53, 22 July 2019

Description

jqxCalendar represents a jQuery calendar widget that enables the user to select a date using a visual monthly calendar display.

jqWidgets is a commercial product, which depending on how you use it, requires a license fee. Complete details are on jqWidget's website. The product is well supported.

Properties and Methods

This control is well documented on the jqWidget's website: http://www.jqwidgets.com/jquery-widgets-documentation/.

Example

function Main() {
  $("#jqxWidget").jqxCalendar({ value: $.jqx._jqxDateTimeInput.getDateTime(new Date(2011, 9, 1)) });
}

Calendar1.oncellSelected = function() 
  alert($("#Calendar1").jqxCalendar("getDate"));
}

Sub Main()
  $("#jqxWidget").jqxCalendar({ value: $.jqx._jqxDateTimeInput.getDateTime(new Date(2011, 9, 1)) });
End Sub

Function Calendar1_oncellSelected()
  MsgBox $("#Calendar1").jqxCalendar("getDate")
End Function

FastClick Fix

On some devices, FastClick can cause problems with the calendar function. The following code should resolve the issue:

JavaScript
    $('#Calendar1 *').addClass('needsclick')
    $('#Calendar1').on('change viewChange click',function(){$('#Calendar1 *').addClass('needsclick')}) 
End JavaScript

Output

See above.