Skip to content

Commit 6c3f0d0

Browse files
farveensulthanafarveensulthana
authored
Merge pull request #4107 from syncfusion-content/945055-local-time-latest
945055: Local time and autocomplete in foreign key column
2 parents a8e01ab + 2751da8 commit 6c3f0d0

File tree

9 files changed

+800
-2
lines changed

9 files changed

+800
-2
lines changed

‎ej2-asp-core-mvc/code-snippet/grid/data-binding/localtime/localtime.cs

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
public IActionResult Index()
2+
{
3+
// Timezone List for Dropdown.
4+
List<TimeZoneData> timeZones = new List<TimeZoneData>
5+
{
6+
new TimeZoneData { Value = -12, Text = "-12:00 UTC" },
7+
new TimeZoneData { Value = -11, Text = "-11:00 UTC" },
8+
new TimeZoneData { Value = -10, Text = "-10:00 UTC" },
9+
new TimeZoneData { Value = -9, Text = "-09:00 UTC" },
10+
new TimeZoneData { Value = -8, Text = "-08:00 UTC" },
11+
new TimeZoneData { Value = -7, Text = "-07:00 UTC" },
12+
new TimeZoneData { Value = -6, Text = "-06:00 UTC" },
13+
new TimeZoneData { Value = -5, Text = "-05:00 UTC" },
14+
new TimeZoneData { Value = -4, Text = "-04:00 UTC" },
15+
new TimeZoneData { Value = -3, Text = "-03:00 UTC" },
16+
new TimeZoneData { Value = -2, Text = "-02:00 UTC" },
17+
new TimeZoneData { Value = -1, Text = "-01:00 UTC" },
18+
new TimeZoneData { Value = 0, Text = "+00:00 UTC" },
19+
new TimeZoneData { Value = 1, Text = "+01:00 UTC" },
20+
new TimeZoneData { Value = 2, Text = "+02:00 UTC" },
21+
new TimeZoneData { Value = 3, Text = "+03:00 UTC" },
22+
new TimeZoneData { Value = 4, Text = "+04:00 UTC" },
23+
new TimeZoneData { Value = 5, Text = "+05:00 UTC" },
24+
new TimeZoneData { Value = 5.5, Text = "+05:30 UTC" },
25+
new TimeZoneData { Value = 6, Text = "+06:00 UTC" },
26+
new TimeZoneData { Value = 7, Text = "+07:00 UTC" },
27+
new TimeZoneData { Value = 8, Text = "+08:00 UTC" },
28+
new TimeZoneData { Value = 9, Text = "+09:00 UTC" },
29+
new TimeZoneData { Value = 10, Text = "+10:00 UTC" },
30+
new TimeZoneData { Value = 11, Text = "+11:00 UTC" },
31+
new TimeZoneData { Value = 12, Text = "+12:00 UTC" },
32+
new TimeZoneData { Value = 13, Text = "+13:00 UTC" },
33+
new TimeZoneData { Value = 14, Text = "+14:00 UTC" }
34+
};
35+
36+
ViewBag.TimeZones = timeZones;
37+
return View();
38+
}
39+
40+

‎ej2-asp-core-mvc/code-snippet/grid/data-binding/localtime/razor

Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
@{
2+
ViewBag.Title = "Syncfusion Grid with Timezone Selection";
3+
}
4+
5+
@using Syncfusion.EJ2
6+
7+
<div style="display: flex; align-items: center; margin-bottom: 10px;" >
8+
<label style="margin-right: 10px">Select Timezone:</label>
9+
@Html.EJS().DropDownList("timezone").DataSource((IEnumerable < object >)ViewBag.TimeZones).Fields(new Syncfusion.EJ2.DropDowns.DropDownListFieldSettings { Value = "Value", Text = "Text" }).Index(0).Width("200px").Change("onTimezoneChange").Render()
10+
</div >
11+
<div style="margin-bottom: 20px;">
12+
@Html.EJS().CheckBox("timezoneCheckbox").Label("Prevent Timezone Conversion").Change("onCheckboxChange").Render()
13+
</div>
14+
<div>
15+
@*Replace xxxx with your actual port number.*@
16+
@Html.EJS().Grid("Grid").DataSource(dm => dm.Url("https://localhost:****/api/orders").Adaptor("WebApiAdaptor")).AllowPaging().Columns(col =>
17+
{
18+
col.Field("OrderID").HeaderText("Order ID").Width("120").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).IsPrimaryKey(true).Add();
19+
col.Field("CustomerID").HeaderText("Customer ID").Width("140").Add();
20+
col.Field("Freight").HeaderText("Freight").Format("C2").TextAlign(Syncfusion.EJ2.Grids.TextAlign.Right).Width("150").Add();
21+
col.Field("OrderDate").HeaderText("Order Date").Width("140").Format("dd/MM/yyyy HH:mm").Add();
22+
}).Load("load").Render()
23+
</div>
24+
25+
<script>
26+
var selectedTimezone = -12;
27+
var checkbox;
28+
var grid;
29+
function load() {
30+
checkbox = document.getElementById("timezoneCheckbox")?.ej2_instances?.[0];
31+
grid = document.getElementById("Grid")?.ej2_instances?.[0];
32+
ej.data.DataUtil.serverTimezoneOffset = checkbox.checked ? 0 : selectedTimezone;
33+
}
34+
function onTimezoneChange(event) {
35+
selectedTimezone = Number(event.value);
36+
ej.data.DataUtil.serverTimezoneOffset = checkbox.checked ? 0 : selectedTimezone;
37+
grid.setProperties({
38+
dataSource: new ej.data.DataManager({
39+
url: "https://localhost:****/api/orders", // Replace **** with your actual port number.
40+
adaptor: new ej.data.WebApiAdaptor(),
41+
crossDomain: true
42+
})
43+
});
44+
grid.refresh();
45+
}
46+
47+
function onCheckboxChange(event) {
48+
ej.data.DataUtil.serverTimezoneOffset = checkbox.checked ? 0 : selectedTimezone;
49+
grid.setProperties({
50+
dataSource: new ej.data.DataManager({
51+
url: "https://localhost:****/api/orders", // Replace **** with your actual port number.
52+
adaptor: new ej.data.WebApiAdaptor(),
53+
crossDomain: true
54+
})
55+
});
56+
grid.refresh();
57+
}
58+
</script>

‎ej2-asp-core-mvc/code-snippet/grid/data-binding/localtime/tagHelper

Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
@page
2+
@model IndexModel
3+
@{
4+
var timeZoneList = ViewBag.TimeZones;
5+
}
6+
<div style="display: flex; align-items: center; margin-bottom: 10px;">
7+
<label style="margin-right: 10px">Select Timezone:</label>
8+
<ejs-dropdownlist id="timezone" dataSource="@timeZoneList" fields="@(new Syncfusion.EJ2.DropDowns.DropDownListFieldSettings { Text = "Text", Value = "Value" })" placeholder="Select a Timezone" popupHeight="220px" width="200px" change="onTimezoneChange"></ejs-dropdownlist>
9+
</div>
10+
<div style="margin-bottom: 20px;">
11+
<ejs-checkbox type="checkbox" id="timezoneCheckbox" label="Prevent Timezone Conversion" onchange="onCheckboxChange"></ejs-checkbox>
12+
</div>
13+
<ejs-grid id="Grid" load="load" height="314" allowPaging="true">
14+
@* Replace **** with your actual port number.*@
15+
<e-data-manager url="https://localhost:****/api/Grid" adaptor="WebApiAdaptor"></e-data-manager>
16+
<e-grid-columns>
17+
<e-grid-column field="OrderID" headerText="Order ID" width="120" textAlign="Right" isPrimaryKey="true"></e-grid-column>
18+
<e-grid-column field="CustomerID" headerText="Customer ID" width="160"></e-grid-column>
19+
<e-grid-column field="Freight" headerText="Freight" format="C2" width="150"></e-grid-column>
20+
<e-grid-column field="OrderDate" headerText="Order Date" format="dd/MM/yyyy HH:mm" width="150"></e-grid-column>
21+
</e-grid-columns>
22+
</ejs-grid>
23+
24+
<script>
25+
var selectedTimezone = -12;
26+
var checkbox;
27+
var grid;
28+
29+
function load() {
30+
checkbox = document.getElementById("timezoneCheckbox")?.ej2_instances?.[0];
31+
grid = document.getElementById("Grid")?.ej2_instances?.[0];
32+
ej.data.DataUtil.serverTimezoneOffset = checkbox.checked ? 0 : selectedTimezone;
33+
}
34+
35+
function onTimezoneChange(event) {
36+
selectedTimezone = Number(event.value);
37+
updateTimezoneOffset();
38+
}
39+
40+
function onCheckboxChange() {
41+
if (!checkbox) {
42+
checkbox = document.getElementById("timezoneCheckbox")?.ej2_instances?.[0];
43+
}
44+
updateTimezoneOffset();
45+
}
46+
47+
function updateTimezoneOffset() {
48+
ej.data.DataUtil.serverTimezoneOffset = checkbox.checked ? 0 : selectedTimezone;
49+
grid.setProperties({
50+
dataSource: new ej.data.DataManager({
51+
url: "https://localhost:****/api/Grid", // Replace **** with your actual port number.
52+
adaptor: new ej.data.WebApiAdaptor(),
53+
crossDomain: true
54+
})
55+
});
56+
grid.refresh();
57+
}
58+
</script>

0 commit comments

Comments
 (0)