jqwidgets · h3trika · Aug 28, 2020 · Aug 28, 2020
diff --git a/demos/calendar/restrictdaterange/App.razor b/demos/calendar/restrictdaterange/App.razor
@@ -1,11 +1,14 @@
-<div>The navigation is restricted from 01/01/2010 to 01/01/2021</div>
+<div style="text-align: center; width: 250px; font-family: 'Verdana', sans-serif; font-size: 13px;">
+    The navigation is restricted from 01/10/2020 to 01/12/2020
+</div>
+
 <br />
 
 <JqxCalendar 
     width=220 height=220 min=min max=max>
 </JqxCalendar>
 
 @code {
-    DateTime min = new DateTime(2010, 1, 1);
-    DateTime max = new DateTime(2020, 11, 31);
+    DateTime min = new DateTime(2020, 10, 1);
+    DateTime max = new DateTime(2020, 12, 1);
 }
diff --git a/demos/calendar/restricteddates/App.razor b/demos/calendar/restricteddates/App.razor
diff --git a/demos/chart/barseries/App.razor b/demos/chart/barseries/App.razor
@@ -68,7 +68,7 @@
             "labels", 
             new Dictionary<string, object>()
             {
-                { "visible", true }          
+                { "visible", false }          
             }
         }
     };

diff --git a/demos/chart/columnseriesspacing/App.razor b/demos/chart/columnseriesspacing/App.razor
@@ -383,25 +383,24 @@
 
     public void eventHandler(IDictionary<string, object> e, int series, string propName)
     {
-        Console.WriteLine(1);
         if (seriesGroups.Count != 0)
         {
             if (seriesGroups.Count < 2)
             {
-                var a = seriesGroups[0]["series"] as Dictionary<string, string>[];
+                var a = seriesGroups[0]["series"] as Dictionary<string, object>[];
 
-                string serieDataField = a[0]["dataField"];
-                Console.WriteLine(serieDataField);
+                string serieDataField = a[0]["dataField"].ToString();
                 int serie = serieDataField == "Serie1" ? 0 : 1;
+
                 if (series != serie)
                 {
                     return;
                 }
+
                 seriesGroups[0][propName] = e["value"];
             }
             else 
             {
-                Console.WriteLine(2);
                 seriesGroups[series][propName] = e["value"];
             }            
         }

diff --git a/demos/datetimeinput/restrictdaterange/App.razor b/demos/datetimeinput/restrictdaterange/App.razor
@@ -1,11 +1,12 @@
 <div style="text-align: center; width: 250px; font-family: 'Verdana', sans-serif; font-size: 13px;">
-    The navigation is restricted from 01/01/2017 to 01/01/2020
+    The navigation is restricted from 01/10/2020 to 01/12/2020
 </div>
+
 <br />
 
 <JqxDateTimeInput width="250" height="25" min="min" max="max"></JqxDateTimeInput>
 
 @code { 
-    DateTime min = new DateTime(2017, 1, 1);
-    DateTime max = new DateTime(2019, 11, 31);
+    DateTime min = new DateTime(2020, 10, 1);
+    DateTime max = new DateTime(2020, 12, 1);
 }
diff --git a/demos/datetimeinput/righttoleft/App.razor b/demos/datetimeinput/righttoleft/App.razor
diff --git a/demos/formattedinput/events/App.razor b/demos/formattedinput/events/App.razor
diff --git a/demos/formattedinput/keyboardnavigation/App.razor b/demos/formattedinput/keyboardnavigation/App.razor
@@ -2,6 +2,8 @@
     width=250 height=25 radix=radix value=value spinButtons=false dropDown=true>
 </JqxFormattedInput>
 
+<br />
+
 <div style="font-family: Verdana; font-size: 12px; width: 400px; margin-left: 20px; float: left;">
         <ul>
             <li><b>Tab</b> - Like other widgets, the jqxFormattedInput widget receives focus by

diff --git a/demos/gauge/defaultfunctionality/App.razor b/demos/gauge/defaultfunctionality/App.razor
@@ -126,9 +126,8 @@
 <style>
     .gaugeValue {
 	    position: absolute; 
-        top: 235px; 
+        top: 275px; 
         left: 140px; 
-        font-family: Sans-Serif; 
         text-align: center; 
         font-size: 17px; 
         width: 70px;

diff --git a/demos/grid/dataexport/App.razor b/demos/grid/dataexport/App.razor
@@ -138,7 +138,7 @@
             row.Add("lastname", lastNames[random.Next(0, lastNames.Length)]);
             row.Add("productname", productNames[random.Next(0, productNames.Length)]);
             row.Add("available", random.Next(2) % 2 == 0 ? true : false );
-            row.Add("data", new DateTime().AddDays(random.Next(500)));
+            row.Add("date", new DateTime().AddDays(random.Next(500)));
             row.Add("price", price);
             row.Add("quantity", quantity);
             row.Add("total", price * quantity);

diff --git a/demos/grid/dataexportgrouping/App.razor b/demos/grid/dataexportgrouping/App.razor
@@ -110,7 +110,7 @@
             row.Add("lastname", lastNames[random.Next(0, lastNames.Length)]);
             row.Add("productname", productNames[random.Next(0, productNames.Length)]);
             row.Add("available", random.Next(2) % 2 == 0 ? true : false );
-            row.Add("data", new DateTime().AddDays(random.Next(500)));
+            row.Add("date", new DateTime().AddDays(random.Next(500)));
             row.Add("price", price);
             row.Add("quantity", quantity);
             row.Add("total", price * quantity);

diff --git a/demos/knob/infiniteknob/App.razor b/demos/knob/infiniteknob/App.razor
@@ -142,8 +142,6 @@
             min = max;
             max += 100;
 
-            Console.WriteLine(min);
-            Console.WriteLine(max);
             myKnob.setOptions(new Dictionary<string, int>()
             {
                 { "value", max }, { "min", min }, { "max", max }
@@ -154,8 +152,6 @@
             max = min;
             min -= 100;
 
-        Console.WriteLine(min);
-            Console.WriteLine(max);
             myKnob.setOptions(new Dictionary<string, int>()
             {
                 { "value", min }, { "min", min }, { "max", max }

diff --git a/demos/knob/knobwithinput/App.razor b/demos/knob/knobwithinput/App.razor
@@ -1,11 +1,13 @@
-<JqxKnob @ref="myKnob" onChange="onKnobChange"
-    width=400 height=400 value=30 min=0 max=100 rotation=rotation
-    startAngle=270 endAngle=630 progressBar=progressBar pointer=pointer dial=dial>
-</JqxKnob>
+<div class="container">
+    <JqxKnob @ref="myKnob" onChange="onKnobChange"
+        width=400 height=400 value=30 min=0 max=100 rotation=rotation
+        startAngle=270 endAngle=630 progressBar=progressBar pointer=pointer dial=dial>
+    </JqxKnob>
 
-<JqxNumberInput @ref="myNumberInput" onChange="onInputChange"
-    inputMode=inputMode decimalDigits=0 value=30>
-</JqxNumberInput>
+    <JqxNumberInput @ref="myNumberInput" onChange="onInputChange"
+        width=110 height=60 inputMode=inputMode decimalDigits=0 value=30>
+    </JqxNumberInput>
+</div>
 
 @code {
     JqxKnob myKnob;
@@ -47,25 +49,22 @@
 }
 
 <style>
-    input {
-        width: 110px !important;
-        height: 70px !important;
-        font-size: 48px !important;
-        position: absolute;
-        vertical-align: middle;
-        border: 0px !important;
-        font-weight: bold;
-        font-variant: normal;
-        font-stretch: normal;                
-        color: #00a644;                
-        background: none;
-        margin-top: -35px;
-        margin-left:-55px;
-        left: 185px;
-        top: 200px;
+    .container {
+        width: fit-content;
+        position: relative;
     }
 
     .jqx-numberinput {
         border: none;
+        position: absolute;
+        left: 50%;
+        top: 50%;
+        transform: translate(-50%, -50%);
+    }
+
+    .jqx-numberinput input {
+        text-align: center !important;
+        font-size: 48px !important;
+        font-weight: bold;
     }
 </style>
diff --git a/demos/knob/multiplearrowpointers/App.razor b/demos/knob/multiplearrowpointers/App.razor