Latest source merged from Syncfusion
This commit is contained in:
pipeline
Родитель
1f67a64677
Коммит
d2dfa7b94d
|
|
@ -1286,6 +1286,12 @@
|
|||
<li>
|
||||
<a href="/blazor/datagrid/how-to/effectively-add-range-of-items-to-observable-collection">Effectively add a range of items into ObservableCollection</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/blazor/datagrid/how-to/hide-command-column-based-on-record-detail">Hide command column in record based on record detail</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="/blazor/datagrid/how-to/hide-detail-template-icon-when-record-details-has-no-record">Hide detail template icon when record details has no record</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
|
|
@ -2970,7 +2976,7 @@
|
|||
</ul>
|
||||
</li>
|
||||
<li>Release Notes
|
||||
<ul><li>2021 Volume 2 - 19.2.*<ul><li> Weekly Nuget Release <ul><li><a href="/blazor/release-notes/19.2.59">19.2.59</a></li><li><a href="/blazor/release-notes/19.2.57">19.2.57</a></li><li><a href="/blazor/release-notes/19.2.56">19.2.56</a></li><li><a href="/blazor/release-notes/19.2.51">19.2.51</a></li><li><a href="/blazor/release-notes/19.2.49">19.2.49</a></li><li><a href="/blazor/release-notes/19.2.48">19.2.48</a></li><li><a href="/blazor/release-notes/19.2.47">19.2.47</a></li><li><a href="/blazor/release-notes/19.2.46">19.2.46</a></li></ul></li><li><a href="/blazor/release-notes/19.2.55">19.2.55 Service Pack Release</a></li><li><a href="/blazor/release-notes/19.2.44">19.2.44 Main Release</a></li></ul></li><li>2021 volume 1 - 19.1.*<ul><li> Weekly Nuget Release <ul><li><a href="/blazor/release-notes/19.1.69">19.1.69</a></li><li><a href="/blazor/release-notes/19.1.67">19.1.67</a></li><li><a href="/blazor/release-notes/19.1.66">19.1.66</a></li><li><a href="/blazor/release-notes/19.1.65">19.1.65</a></li><li><a href="/blazor/release-notes/19.1.64">19.1.64</a></li><li><a href="/blazor/release-notes/19.1.59">19.1.59</a></li><li><a href="/blazor/release-notes/19.1.58">19.1.58</a></li><li><a href="/blazor/release-notes/19.1.57">19.1.57</a></li><li><a href="/blazor/release-notes/19.1.56">19.1.56</a></li><li><a href="/blazor/release-notes/19.1.55">19.1.55</a></li></ul></li><li><a href="/blazor/release-notes/19.1.63">19.1.63 Service Pack Release</a></li><li><a href="/blazor/release-notes/19.1.54">19.1.54 Main release</a></li></ul></li>
|
||||
<ul><li>2021 Volume 2 - 19.2.*<ul><li> Weekly Nuget Release <ul><li><a href="/blazor/release-notes/19.2.60">19.2.60</a></li><li><a href="/blazor/release-notes/19.2.59">19.2.59</a></li><li><a href="/blazor/release-notes/19.2.57">19.2.57</a></li><li><a href="/blazor/release-notes/19.2.56">19.2.56</a></li><li><a href="/blazor/release-notes/19.2.51">19.2.51</a></li><li><a href="/blazor/release-notes/19.2.49">19.2.49</a></li><li><a href="/blazor/release-notes/19.2.48">19.2.48</a></li><li><a href="/blazor/release-notes/19.2.47">19.2.47</a></li><li><a href="/blazor/release-notes/19.2.46">19.2.46</a></li></ul></li><li><a href="/blazor/release-notes/19.2.55">19.2.55 Service Pack Release</a></li><li><a href="/blazor/release-notes/19.2.44">19.2.44 Main Release</a></li></ul></li><li>2021 volume 1 - 19.1.*<ul><li> Weekly Nuget Release <ul><li><a href="/blazor/release-notes/19.1.69">19.1.69</a></li><li><a href="/blazor/release-notes/19.1.67">19.1.67</a></li><li><a href="/blazor/release-notes/19.1.66">19.1.66</a></li><li><a href="/blazor/release-notes/19.1.65">19.1.65</a></li><li><a href="/blazor/release-notes/19.1.64">19.1.64</a></li><li><a href="/blazor/release-notes/19.1.59">19.1.59</a></li><li><a href="/blazor/release-notes/19.1.58">19.1.58</a></li><li><a href="/blazor/release-notes/19.1.57">19.1.57</a></li><li><a href="/blazor/release-notes/19.1.56">19.1.56</a></li><li><a href="/blazor/release-notes/19.1.55">19.1.55</a></li></ul></li><li><a href="/blazor/release-notes/19.1.63">19.1.63 Service Pack Release</a></li><li><a href="/blazor/release-notes/19.1.54">19.1.54 Main release</a></li></ul></li>
|
||||
<li>2020 volume 4 - 18.4.*<ul><li> Weekly Nuget Release <ul><li><a href="/blazor/release-notes/18.4.49">18.4.49</a></li><li><a href="/blazor/release-notes/18.4.48">18.4.48</a></li><li><a href="/blazor/release-notes/18.4.47">18.4.47</a></li><li><a href="/blazor/release-notes/18.4.46">18.4.46</a></li><li><a href="/blazor/release-notes/18.4.44">18.4.44</a></li><li><a href="/blazor/release-notes/18.4.43">18.4.43</a></li><li><a href="/blazor/release-notes/18.4.42">18.4.42</a></li><li><a href="/blazor/release-notes/18.4.41">18.4.41</a></li><li><a href="/blazor/release-notes/18.4.35">18.4.35</a></li><li><a href="/blazor/release-notes/18.4.34">18.4.34</a></li><li><a href="/blazor/release-notes/18.4.33">18.4.33</a></li><li><a href="/blazor/release-notes/18.4.32">18.4.32</a></li><li><a href="/blazor/release-notes/18.4.31">18.4.31</a></li></ul></li><li><a href="/blazor/release-notes/18.4.39">18.4.39 Service Pack Release</a></li><li><a href="/blazor/release-notes/18.4.30">18.4.30 Main Release</a></li></ul></li>
|
||||
<li>2020 volume 3 - 18.3.*<ul><li> Weekly Nuget Release <ul><li><a href="/blazor/release-notes/18.3.53">18.3.53</a></li><li><a href="/blazor/release-notes/18.3.52">18.3.52</a></li><li><a href="/blazor/release-notes/18.3.51">18.3.51</a></li><li><a href="/blazor/release-notes/18.3.50">18.3.50</a></li><li><a href="/blazor/release-notes/18.3.48">18.3.48</a></li><li><a href="/blazor/release-notes/18.3.44">18.3.44</a></li><li><a href="/blazor/release-notes/18.3.42">18.3.42</a></li><li><a href="/blazor/release-notes/18.3.41">18.3.41</a></li><li><a href="/blazor/release-notes/18.3.40">18.3.40</a></li><li><a href="/blazor/release-notes/18.3.38">18.3.38</a></li></ul></li><li><a href="/blazor/release-notes/18.3.47">18.3.47 Service Pack Release</a></li><li><a href="/blazor/release-notes/18.3.35">18.3.35 Main release</a></li></ul></li>
|
||||
<li>2020 volume 2 - 18.2.*<ul><li> Weekly Nuget Release <ul><li><a href="/blazor/release-notes/18.2.59">18.2.59</a></li><li><a href="/blazor/release-notes/18.2.58">18.2.58</a></li><li><a href="/blazor/release-notes/18.2.57">18.2.57</a></li><li><a href="/blazor/release-notes/18.2.56">18.2.56</a></li><li><a href="/blazor/release-notes/18.2.55">18.2.55</a></li><li><a href="/blazor/release-notes/18.2.54">18.2.54</a></li><li><a href="/blazor/release-notes/18.2.48">18.2.48</a></li><li><a href="/blazor/release-notes/18.2.47">18.2.47</a></li><li><a href="/blazor/release-notes/18.2.46">18.2.46</a></li><li><a href="/blazor/release-notes/18.2.45">18.2.45</a></li></ul></li><li><a href="/blazor/release-notes/18.2.44">18.2.44 Main Release</a></li></ul></li>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,17 @@
|
|||
---
|
||||
title: Essential Studio for Blazor Weekly Nuget Release Release Notes
|
||||
description: Essential Studio for Blazor Weekly Nuget Release Release Notes
|
||||
platform: Blazor
|
||||
documentation: ug
|
||||
---
|
||||
|
||||
# Essential Studio for Blazor Release Notes
|
||||
|
||||
{% include release-info.html date="September 7, 2021" version="v19.2.60" %}
|
||||
|
||||
{% directory path: _includes/release-notes/v19.2.60 %}
|
||||
|
||||
{% include {{file.url}} %}
|
||||
|
||||
{% enddirectory %}
|
||||
|
||||
|
|
@ -111,4 +111,220 @@ The pager dropdown allows you to change the number of records in the DataGrid dy
|
|||
```
|
||||
|
||||
> You can refer to our [Blazor Grid Paging](https://www.syncfusion.com/blazor-components/blazor-datagrid/paging) Feature tour page to know about paging and its feature representations.
|
||||
> You can refer to our [Blazor DataGrid](https://www.syncfusion.com/blazor-components/blazor-datagrid) feature tour page for its groundbreaking feature representations. You can also explore our [Blazor DataGrid example](https://blazor.syncfusion.com/demos/datagrid/overview?theme=bootstrap4) to understand how to present and manipulate data.
|
||||
> You can refer to our [Blazor DataGrid](https://www.syncfusion.com/blazor-components/blazor-datagrid) feature tour page for its groundbreaking feature representations. You can also explore our [Blazor DataGrid example](https://blazor.syncfusion.com/demos/datagrid/overview?theme=bootstrap4) to understand how to present and manipulate data.
|
||||
|
||||
## Pager Template
|
||||
|
||||
Blazor DataGrid provides a way to customize the pager UI using the pager template feature. We can make use of the **Template** property of the [GridPageSettings](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Grids.GridPageSettings.html) component to customize the pager template of DataGrid component.
|
||||
|
||||
> Inside the **Template** RenderFragment, we can access the parameters passed to the pager templates using implicit parameter named context matching with the [PagerTemplateContent](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Grids.PagerTemplateContext.html) class name.
|
||||
|
||||
In the below sample, we have customized the Pager component in DataGrid control with custom button and input element to navigate between Grid pages. We have used **GotoPageAsync** method of Grid to navigate to specific page in DataGrid control.
|
||||
|
||||
```cshtml
|
||||
@using Syncfusion.Blazor.Grids
|
||||
|
||||
<SfGrid @ref="defaultGrid" DataSource="students" AllowPaging="true">
|
||||
<GridPageSettings PageSize="10">
|
||||
<Template>
|
||||
<div class="PagerTemplate">
|
||||
<div class="@($"e-first e-icons e-icon-first {ValidateFirst()} align-icons e-firstpage")" @onclick="ShowFirstPage" title="Go to first page">
|
||||
</div>
|
||||
<div class="@($"e-prev e-icons e-icon-prev {ValidateBack()} align-icons")" @onclick="ShowPreviousPage" title="Go to previous page"></div>
|
||||
<div>
|
||||
<input class="textbox add-border" type="text" @bind="pageNo" size="2" @oninput="LaunchEnteredPage" />
|
||||
<div id="totalpages" class="textbox"> of @totalPages pages </div>
|
||||
</div>
|
||||
<div class="@($"e-next e-icons e-icon-next {ValidateForward()} align-icons e-next")" @onclick="ShowNextPage" title="Go to next page"></div>
|
||||
<div class="@($"e-last e-icons e-icon-last {ValidateLast()} align-icons")" @onclick="ShowLastPage" title="Go to last page"></div>
|
||||
</div>
|
||||
<style>
|
||||
.PagerTemplate {
|
||||
width: 1000px;
|
||||
height: 64px;
|
||||
left: 183px;
|
||||
top: 615px;
|
||||
border-radius: 0px;
|
||||
}
|
||||
|
||||
.textbox {
|
||||
margin-top: 9px;
|
||||
margin-bottom: 9px;
|
||||
margin-right: 2px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.add-border {
|
||||
border: #ddd 1px solid;
|
||||
}
|
||||
|
||||
.align-icons {
|
||||
margin-top: 9px;
|
||||
margin-bottom: 9px;
|
||||
margin-right: 16px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.e-firstpage {
|
||||
margin-left: 6px;
|
||||
}
|
||||
|
||||
.e-next {
|
||||
margin-left: 16px;
|
||||
}
|
||||
|
||||
.disableFirst {
|
||||
pointer-events: none;
|
||||
opacity: 0.3;
|
||||
}
|
||||
|
||||
.disableLast {
|
||||
pointer-events: none;
|
||||
opacity: 0.3;
|
||||
}
|
||||
|
||||
.disableFront {
|
||||
pointer-events: none;
|
||||
opacity: 0.3;
|
||||
}
|
||||
|
||||
.disableBack {
|
||||
pointer-events: none;
|
||||
opacity: 0.3;
|
||||
}
|
||||
</style>
|
||||
</Template>
|
||||
</GridPageSettings>
|
||||
<GridColumns>
|
||||
<GridColumn Field="@nameof(Order.OrderID)" HeaderText="Order ID" TextAlign="TextAlign.Right" Width="120"></GridColumn>
|
||||
<GridColumn Field="@nameof(Order.CustomerID)" HeaderText="Customer ID" TextAlign="TextAlign.Left" Width="150"></GridColumn>
|
||||
<GridColumn Field="@nameof(Order.OrderDate)" HeaderText="Order Date" TextAlign="TextAlign.Center" Width="130" Format="d" Type="ColumnType.Date"></GridColumn>
|
||||
<GridColumn Field="@nameof(Order.Freight)" HeaderText="Freight" Format="c2" TextAlign="TextAlign.Right" Width="130"></GridColumn>
|
||||
<GridColumn Field="@nameof(Order.ShipCountry)" HeaderText="Ship Country" TextAlign="TextAlign.Left" Width="140"></GridColumn>
|
||||
</GridColumns>
|
||||
</SfGrid>
|
||||
|
||||
@code{
|
||||
public SfGrid<Order> defaultGrid;
|
||||
public List<Order> students { get; set; }
|
||||
public int pageNo { get; set; }
|
||||
public int totalPages { get; set; }
|
||||
public bool DisableBackIcon = false;
|
||||
public bool DisableForwardIcon = false;
|
||||
public bool DisableFirstIcon = false;
|
||||
public bool DisableLastIcon = false;
|
||||
protected override void OnInitialized()
|
||||
{
|
||||
base.OnInitialized();
|
||||
students = Enumerable.Range(1, 100).Select((x) => new Order()
|
||||
{
|
||||
OrderID = x,
|
||||
CustomerID = (new string[] { "ALFKI", "ANATR", "ANTON", "BLONP", "BOLID" })[new Random().Next(5)],
|
||||
Freight = 2.1 * x,
|
||||
ShipCountry = new string[] { "Denmark", "Germany", "Austria", "Brazil", "Switzerland" }[new Random().Next(5)],
|
||||
OrderDate = new DateTime[] { new DateTime(2010, 12, 19), new DateTime(2005, 08, 20), new DateTime(1991, 01, 10), new DateTime(1992, 10, 11), new DateTime(1999, 12, 14) }[new Random().Next(5)]
|
||||
}).ToList();
|
||||
}
|
||||
protected override void OnAfterRender(bool firstRender)
|
||||
{
|
||||
base.OnAfterRender(firstRender);
|
||||
if (firstRender)
|
||||
{
|
||||
totalPages = defaultGrid.TotalItemCount / defaultGrid.PageSettings.PageSize;
|
||||
}
|
||||
pageNo = defaultGrid.PageSettings.CurrentPage;
|
||||
if (defaultGrid.PageSettings.CurrentPage == totalPages)
|
||||
{
|
||||
DisableForwardIcon = true;
|
||||
DisableLastIcon = true;
|
||||
}
|
||||
else
|
||||
{
|
||||
DisableForwardIcon = false;
|
||||
DisableLastIcon = false;
|
||||
}
|
||||
if (defaultGrid.PageSettings.CurrentPage == 1)
|
||||
{
|
||||
DisableBackIcon = true;
|
||||
DisableFirstIcon = true;
|
||||
}
|
||||
else
|
||||
{
|
||||
DisableBackIcon = false;
|
||||
DisableFirstIcon = false;
|
||||
}
|
||||
StateHasChanged();
|
||||
}
|
||||
public class Order
|
||||
{
|
||||
public int OrderID { get; set; }
|
||||
public string CustomerID { get; set; }
|
||||
public double Freight { get; set; }
|
||||
public string ShipCountry { get; set; }
|
||||
public DateTime OrderDate { get; set; }
|
||||
}
|
||||
public string ValidateFirst()
|
||||
{
|
||||
if (DisableFirstIcon)
|
||||
{
|
||||
return "disableFirst";
|
||||
}
|
||||
return "";
|
||||
}
|
||||
public string ValidateLast()
|
||||
{
|
||||
if (DisableLastIcon)
|
||||
{
|
||||
return "disableLast";
|
||||
}
|
||||
return "";
|
||||
}
|
||||
public string ValidateForward()
|
||||
{
|
||||
if (DisableForwardIcon)
|
||||
{
|
||||
return "disableFront";
|
||||
}
|
||||
return "";
|
||||
}
|
||||
public string ValidateBack()
|
||||
{
|
||||
if (DisableBackIcon)
|
||||
{
|
||||
return "disableBack";
|
||||
}
|
||||
return "";
|
||||
}
|
||||
public void ShowNextPage()
|
||||
{
|
||||
defaultGrid.GoToPageAsync((defaultGrid.PageSettings.CurrentPage) + 1);
|
||||
}
|
||||
public void ShowPreviousPage()
|
||||
{
|
||||
defaultGrid.GoToPageAsync((defaultGrid.PageSettings.CurrentPage) - 1);
|
||||
}
|
||||
public void ShowFirstPage()
|
||||
{
|
||||
defaultGrid.GoToPageAsync(1);
|
||||
}
|
||||
public void ShowLastPage()
|
||||
{
|
||||
defaultGrid.GoToPageAsync(totalPages);
|
||||
}
|
||||
public void LaunchEnteredPage(Microsoft.AspNetCore.Components.ChangeEventArgs page)
|
||||
{
|
||||
if (page.Value == null || page.Value.ToString() == "")
|
||||
{
|
||||
return;
|
||||
}
|
||||
else
|
||||
{
|
||||
double enteredPage = Convert.ToDouble(page.Value);
|
||||
if (enteredPage <= totalPages)
|
||||
defaultGrid.GoToPageAsync(enteredPage);
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
> You can refer to our [Blazor Grid Pager Template](https://blazor.syncfusion.com/demos/datagrid/pager-template) online demo of Pager Template feature in Blazor DataGrid.
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче