Skip to content

Commit 24a5337

Browse files
Merge pull request #6850 from syncfusion-content/985851-PreviewD1
985851: Need to correct the preview output in data-binding sections
2 parents 06f41a7 + a2d9675 commit 24a5337

File tree

5 files changed

+54
-38
lines changed

5 files changed

+54
-38
lines changed
Lines changed: 17 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,29 @@
11
@using Syncfusion.Blazor.MultiColumnComboBox
22
@using Syncfusion.Blazor.Data
33

4-
<SfMultiColumnComboBox TItem="EmployeeData" TValue="string" AllowFiltering=true ValueField="EmployeeID" OnActionBegin="@OnActionBeginhandler" TextField="FirstName" PopupWidth="600px" Placeholder="e.g. Andrew">
5-
<SfDataManager Url="https://blazor.syncfusion.com/services/release/api/Employees" CrossDomain="true" Adaptor="Syncfusion.Blazor.Adaptors.WebApiAdaptor"></SfDataManager>
4+
<SfMultiColumnComboBox TItem="OrderDetails" TValue="string" AllowFiltering=true ValueField="CustomerID" OnActionBegin="@OnActionBeginhandler" TextField="CustomerID" PopupWidth="Auto" Placeholder="e.g. Andrew">
5+
<SfDataManager Url="https://blazor.syncfusion.com/services/production/api/Orders" CrossDomain="true" Offline="true" Adaptor="Syncfusion.Blazor.Adaptors.WebApiAdaptor"></SfDataManager>
66
</SfMultiColumnComboBox>
77

88
@code {
99
public Query RemoteQuery = new Query();
10-
public class EmployeeData
10+
public class OrderDetails
1111
{
12-
public int EmployeeID { get; set; }
13-
public string FirstName { get; set; }
14-
public string LastName { get; set; }
15-
public string Country { get; set; }
12+
public int? OrderID { get; set; }
13+
public string CustomerID { get; set; }
14+
public int? EmployeeID { get; set; }
15+
public double? Freight { get; set; }
16+
public string ShipCity { get; set; }
17+
public bool Verified { get; set; }
18+
public DateTime? OrderDate { get; set; }
19+
public string ShipName { get; set; }
20+
public string ShipCountry { get; set; }
21+
public DateTime? ShippedDate { get; set; }
22+
public string ShipAddress { get; set; }
1623
}
17-
private void OnActionBeginhandler(ActionBeginEventArgs args)
24+
25+
private void OnActionBeginhandler(Syncfusion.Blazor.MultiColumnComboBox.ActionBeginEventArgs args)
1826
{
1927
// Here, you can customize your code.
2028
}
21-
}
29+
}

blazor/multicolumn-combobox/code-snippet/data-binding/action-failure.razor

Lines changed: 16 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,27 @@
1-
@using Syncfusion.Blazor.MultiColumnComboBox
1+
@using Syncfusion.Blazor.MultiColumnComboBox
22
@using Syncfusion.Blazor.Data
33

4-
<SfMultiColumnComboBox TItem="EmployeeData" TValue="string" AllowFiltering=true ValueField="EmployeeID" OnActionFailure="@OnActionFailurehandler" TextField="FirstName" PopupWidth="600px" Placeholder="e.g. Andrew">
5-
<SfDataManager Url="https://blazor.syncfusion.com/services/release/api/Employees" CrossDomain="true" Adaptor="Syncfusion.Blazor.Adaptors.WebApiAdaptor"></SfDataManager>
4+
<SfMultiColumnComboBox TItem="OrderDetails" TValue="string" AllowFiltering=true ValueField="CustomerID" OnActionFailure="@OnActionFailurehandler" TextField="CustomerID" PopupWidth="Auto" Placeholder="e.g. Andrew">
5+
<SfDataManager Url="https://blazor.syncfusion.com/services/production/api/Orders" CrossDomain="true" Offline="true" Adaptor="Syncfusion.Blazor.Adaptors.WebApiAdaptor"></SfDataManager>
66
</SfMultiColumnComboBox>
77

88
@code {
99
public Query RemoteQuery = new Query();
10-
public class EmployeeData
10+
public class OrderDetails
1111
{
12-
public int EmployeeID { get; set; }
13-
public string FirstName { get; set; }
14-
public string LastName { get; set; }
15-
public string Country { get; set; }
12+
public int? OrderID { get; set; }
13+
public string CustomerID { get; set; }
14+
public int? EmployeeID { get; set; }
15+
public double? Freight { get; set; }
16+
public string ShipCity { get; set; }
17+
public bool Verified { get; set; }
18+
public DateTime? OrderDate { get; set; }
19+
public string ShipName { get; set; }
20+
public string ShipCountry { get; set; }
21+
public DateTime? ShippedDate { get; set; }
22+
public string ShipAddress { get; set; }
1623
}
24+
1725
private void OnActionFailurehandler(Exception args)
1826
{
1927
// Here, you can customize your code.
Lines changed: 15 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,24 @@
1-
@using Syncfusion.Blazor.Data
2-
@using Syncfusion.Blazor.DropDowns
31
@using Syncfusion.Blazor.MultiColumnComboBox
42
@using Syncfusion.Blazor.Data
53

6-
<SfMultiColumnComboBox TItem="EmployeeData" TValue="string" AllowFiltering=true ValueField="EmployeeID" OnActionBegin="@OnActionBeginhandler" TextField="FirstName" PopupWidth="600px" Placeholder="e.g. Andrew">
7-
<SfDataManager Url="https://blazor.syncfusion.com/services/release/api/Employees" CrossDomain="true" Adaptor="Syncfusion.Blazor.Adaptors.WebApiAdaptor"></SfDataManager>
4+
<SfMultiColumnComboBox TItem="OrderDetails" TValue="string" AllowFiltering=true ValueField="CustomerID" TextField="CustomerID" PopupWidth="Auto" Placeholder="e.g. Andrew">
5+
<SfDataManager Url="https://blazor.syncfusion.com/services/production/api/Orders" CrossDomain="true" Offline="true" Adaptor="Syncfusion.Blazor.Adaptors.WebApiAdaptor"></SfDataManager>
86
</SfMultiColumnComboBox>
97

108
@code {
119
public Query RemoteQuery = new Query();
12-
public class EmployeeData
13-
{
14-
public int EmployeeID { get; set; }
15-
public string FirstName { get; set; }
16-
public string LastName { get; set; }
17-
public string Country { get; set; }
18-
}
19-
private void OnActionBeginhandler(ActionBeginEventArgs args)
10+
public class OrderDetails
2011
{
21-
// Here, you can customize your code.
12+
public int? OrderID { get; set; }
13+
public string CustomerID { get; set; }
14+
public int? EmployeeID { get; set; }
15+
public double? Freight { get; set; }
16+
public string ShipCity { get; set; }
17+
public bool Verified { get; set; }
18+
public DateTime? OrderDate { get; set; }
19+
public string ShipName { get; set; }
20+
public string ShipCountry { get; set; }
21+
public DateTime? ShippedDate { get; set; }
22+
public string ShipAddress { get; set; }
2223
}
23-
}
24+
}

blazor/multicolumn-combobox/data-binding.md

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -125,7 +125,7 @@ The [OnActionBegin](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Mult
125125

126126
{% endhighlight %}
127127

128-
{% previewsample "https://blazorplayground.syncfusion.com/embed/rtVTXahAKvxlOgaH?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" %}
128+
{% previewsample "https://blazorplayground.syncfusion.com/embed/LNVeMZjQHJYqdimB?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" %}
129129

130130
### OnActionFailure event
131131

@@ -137,7 +137,7 @@ The [OnActionFailure](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Mu
137137

138138
{% endhighlight %}
139139

140-
{% previewsample "https://blazorplayground.syncfusion.com/embed/rZLpZkrKqPQmofLv?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" %}
140+
{% previewsample "https://blazorplayground.syncfusion.com/embed/LtVoWNZwRIdKNBsr?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" %}
141141

142142
### OData v4 services
143143

@@ -163,9 +163,8 @@ The [Web API Adaptor](https://blazor.syncfusion.com/documentation/data/adaptors#
163163

164164
{% endhighlight %}
165165

166-
{% previewsample "https://blazorplayground.syncfusion.com/embed/VZhTDaLKUlkAUjhM?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" %}
166+
{% previewsample "https://blazorplayground.syncfusion.com/embed/hZhIWjjwnRBWAlvb?appbar=false&editor=false&result=true&errorlist=false&theme=bootstrap5" %}
167167

168-
![Blazor MultiColumn ComboBox with Web API Adaptor](./images/data-binding/blazor_combobox_web-api-adaptor.png)
169168

170169
### Offline mode
171170

blazor/multicolumn-combobox/value-binding.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
---
22
layout: post
3-
title: Data Binding in Blazor MultiColumn ComboBox Component | Syncfusion
3+
title: Value Binding in Blazor MultiColumn ComboBox Component | Syncfusion
44
description: Checkout and learn here all about value binding in Syncfusion Blazor MultiColumn ComboBox component and more.
55
platform: Blazor
66
control: MultiColumn ComboBox
@@ -103,7 +103,7 @@ First, create a `MultiColumnComboBox.razor` file as a parent component in the `/
103103
public EventCallback<TValue> ComboBoxValueChanged { get; set; }
104104
}
105105

106-
{% endhighlight razor %}
106+
{% endhighlight %}
107107
{% endtabs %}
108108

109109
### Usage of generic component with different type
@@ -143,5 +143,5 @@ Here, the MultiColumn ComboBox component with TValue as an int nullable type in
143143
};
144144
}
145145

146-
{% endhighlight razor %}
146+
{% endhighlight %}
147147
{% endtabs %}

0 commit comments

Comments
 (0)