Mixing
Paged Datagrid using Syncfusion in Xamarin.Forms
I am trying to display a paged grid using MVVM architecture and Syncfusion controls. I managed to do just that using SfDataGrid in UWP, but I can't seem to get it right in Xamarin.Forms.
If I do not use the pager, the lines appear in the grid. (please see code below)
<xForms:SfDataGrid
x:Name="datagrid"
AutoGenerateColumns="False"
ItemsSource="{Binding Lines}"
ColumnSizer="Star"
DefaultColumnWidth="200"
Columns="{Binding GridColumns, Mode=TwoWay}" />
But when I try to use the pager like this:
<xForms:SfDataGrid
x:Name="datagrid"
AutoGenerateColumns="False"
ItemsSource="{Binding PagedSource, Source={x:Reference Name=dataPager}}"
ColumnSizer="Star"
DefaultColumnWidth="200"
Columns="{Binding GridColumns, Mode=TwoWay}" />
<dataPager:SfDataPager
Source="{Binding Lines, Mode=TwoWay}"
x:Name="dataPager"
Margin="5" Grid.Row="1" PageSize="7"
HorizontalOptions="FillAndExpand" />
I get the following result: the Grid is empty, no exception is thrown and I can not find any binding errors in the output.
Also, I think the paging example in the official Syncfusion documentation might be incomplete, since it states that a binding must be done between the ItemsSource of the Grid and the Source of the Pager, but this does not appear in the xaml code sample presented there.
https://help.syncfusion.com/xamarin/sfdatagrid/paging?cs-save-lang=1&cs-lang=csharp
Is it something that I am missing or do I need to use code behind to make it work?
xamarin.forms uwp paging syncfusion
asked Nov 20 '18 at 6:00
CosminCosmin
195
add a comment |
I am trying to display a paged grid using MVVM architecture and Syncfusion controls. I managed to do just that using SfDataGrid in UWP, but I can't seem to get it right in Xamarin.Forms.
If I do not use the pager, the lines appear in the grid. (please see code below)
<xForms:SfDataGrid
x:Name="datagrid"
AutoGenerateColumns="False"
ItemsSource="{Binding Lines}"
ColumnSizer="Star"
DefaultColumnWidth="200"
Columns="{Binding GridColumns, Mode=TwoWay}" />
But when I try to use the pager like this:
<xForms:SfDataGrid
x:Name="datagrid"
AutoGenerateColumns="False"
ItemsSource="{Binding PagedSource, Source={x:Reference Name=dataPager}}"
ColumnSizer="Star"
DefaultColumnWidth="200"
Columns="{Binding GridColumns, Mode=TwoWay}" />
<dataPager:SfDataPager
Source="{Binding Lines, Mode=TwoWay}"
x:Name="dataPager"
Margin="5" Grid.Row="1" PageSize="7"
HorizontalOptions="FillAndExpand" />
I get the following result: the Grid is empty, no exception is thrown and I can not find any binding errors in the output.
Also, I think the paging example in the official Syncfusion documentation might be incomplete, since it states that a binding must be done between the ItemsSource of the Grid and the Source of the Pager, but this does not appear in the xaml code sample presented there.
https://help.syncfusion.com/xamarin/sfdatagrid/paging?cs-save-lang=1&cs-lang=csharp
Is it something that I am missing or do I need to use code behind to make it work?
xamarin.forms uwp paging syncfusion
asked Nov 20 '18 at 6:00
CosminCosmin
195
Have you compiled syncfusion sample solution for forms?
– Nick Kovalsky
Nov 20 '18 at 6:58
@NickKovalsky I do not know which solution are you referring to. Can you please provide me with more details?
– Cosmin
Nov 20 '18 at 12:09
Install xamarin samples after you install the sdk and open/build SampleBrowser.SfDataGrid.sln
– Nick Kovalsky
Nov 20 '18 at 14:31
@NickKovalsky thanks for the suggestion, but that sample contains an unpaged SfDataGrid example. I had managed to bind the lines of the grid, paging seems to be the issue (which I also solved for UWP with some simillar code, can't seem to get it in forms)
– Cosmin
Nov 20 '18 at 18:01
add a comment |
I am trying to display a paged grid using MVVM architecture and Syncfusion controls. I managed to do just that using SfDataGrid in UWP, but I can't seem to get it right in Xamarin.Forms.
If I do not use the pager, the lines appear in the grid. (please see code below)
<xForms:SfDataGrid
x:Name="datagrid"
AutoGenerateColumns="False"
ItemsSource="{Binding Lines}"
ColumnSizer="Star"
DefaultColumnWidth="200"
Columns="{Binding GridColumns, Mode=TwoWay}" />
But when I try to use the pager like this:
<xForms:SfDataGrid
x:Name="datagrid"
AutoGenerateColumns="False"
ItemsSource="{Binding PagedSource, Source={x:Reference Name=dataPager}}"
ColumnSizer="Star"
DefaultColumnWidth="200"
Columns="{Binding GridColumns, Mode=TwoWay}" />
<dataPager:SfDataPager
Source="{Binding Lines, Mode=TwoWay}"
x:Name="dataPager"
Margin="5" Grid.Row="1" PageSize="7"
HorizontalOptions="FillAndExpand" />
I get the following result: the Grid is empty, no exception is thrown and I can not find any binding errors in the output.
Also, I think the paging example in the official Syncfusion documentation might be incomplete, since it states that a binding must be done between the ItemsSource of the Grid and the Source of the Pager, but this does not appear in the xaml code sample presented there.
https://help.syncfusion.com/xamarin/sfdatagrid/paging?cs-save-lang=1&cs-lang=csharp
Is it something that I am missing or do I need to use code behind to make it work?
xamarin.forms uwp paging syncfusion
asked Nov 20 '18 at 6:00
CosminCosmin
195
I am trying to display a paged grid using MVVM architecture and Syncfusion controls. I managed to do just that using SfDataGrid in UWP, but I can't seem to get it right in Xamarin.Forms.
If I do not use the pager, the lines appear in the grid. (please see code below)
<xForms:SfDataGrid
x:Name="datagrid"
AutoGenerateColumns="False"
ItemsSource="{Binding Lines}"
ColumnSizer="Star"
DefaultColumnWidth="200"
Columns="{Binding GridColumns, Mode=TwoWay}" />
But when I try to use the pager like this:
<xForms:SfDataGrid
x:Name="datagrid"
AutoGenerateColumns="False"
ItemsSource="{Binding PagedSource, Source={x:Reference Name=dataPager}}"
ColumnSizer="Star"
DefaultColumnWidth="200"
Columns="{Binding GridColumns, Mode=TwoWay}" />
<dataPager:SfDataPager
Source="{Binding Lines, Mode=TwoWay}"
x:Name="dataPager"
Margin="5" Grid.Row="1" PageSize="7"
HorizontalOptions="FillAndExpand" />
I get the following result: the Grid is empty, no exception is thrown and I can not find any binding errors in the output.
Also, I think the paging example in the official Syncfusion documentation might be incomplete, since it states that a binding must be done between the ItemsSource of the Grid and the Source of the Pager, but this does not appear in the xaml code sample presented there.
https://help.syncfusion.com/xamarin/sfdatagrid/paging?cs-save-lang=1&cs-lang=csharp
Is it something that I am missing or do I need to use code behind to make it work?
xamarin.forms uwp paging syncfusion
xamarin.forms uwp paging syncfusion
asked Nov 20 '18 at 6:00
CosminCosmin
195
asked Nov 20 '18 at 6:00
CosminCosmin
195
edited Dec 11 '18 at 4:58
Cosmin
asked Nov 20 '18 at 6:00
CosminCosmin
195
asked Nov 20 '18 at 6:00
CosminCosmin
195
asked Nov 20 '18 at 6:00
CosminCosmin
195
195
Have you compiled syncfusion sample solution for forms?
– Nick Kovalsky
Nov 20 '18 at 6:58
@NickKovalsky I do not know which solution are you referring to. Can you please provide me with more details?
– Cosmin
Nov 20 '18 at 12:09
Install xamarin samples after you install the sdk and open/build SampleBrowser.SfDataGrid.sln
– Nick Kovalsky
Nov 20 '18 at 14:31
@NickKovalsky thanks for the suggestion, but that sample contains an unpaged SfDataGrid example. I had managed to bind the lines of the grid, paging seems to be the issue (which I also solved for UWP with some simillar code, can't seem to get it in forms)
– Cosmin
Nov 20 '18 at 18:01
add a comment |
Have you compiled syncfusion sample solution for forms?
– Nick Kovalsky
Nov 20 '18 at 6:58
@NickKovalsky I do not know which solution are you referring to. Can you please provide me with more details?
– Cosmin
Nov 20 '18 at 12:09
Install xamarin samples after you install the sdk and open/build SampleBrowser.SfDataGrid.sln
– Nick Kovalsky
Nov 20 '18 at 14:31
@NickKovalsky thanks for the suggestion, but that sample contains an unpaged SfDataGrid example. I had managed to bind the lines of the grid, paging seems to be the issue (which I also solved for UWP with some simillar code, can't seem to get it in forms)
– Cosmin
Nov 20 '18 at 18:01
Have you compiled syncfusion sample solution for forms?
– Nick Kovalsky
Nov 20 '18 at 6:58
Have you compiled syncfusion sample solution for forms?
– Nick Kovalsky
Nov 20 '18 at 6:58
@NickKovalsky I do not know which solution are you referring to. Can you please provide me with more details?
– Cosmin
Nov 20 '18 at 12:09
@NickKovalsky I do not know which solution are you referring to. Can you please provide me with more details?
– Cosmin
Nov 20 '18 at 12:09
Install xamarin samples after you install the sdk and open/build SampleBrowser.SfDataGrid.sln
– Nick Kovalsky
Nov 20 '18 at 14:31
Install xamarin samples after you install the sdk and open/build SampleBrowser.SfDataGrid.sln
– Nick Kovalsky
Nov 20 '18 at 14:31
@NickKovalsky thanks for the suggestion, but that sample contains an unpaged SfDataGrid example. I had managed to bind the lines of the grid, paging seems to be the issue (which I also solved for UWP with some simillar code, can't seem to get it in forms)
– Cosmin
Nov 20 '18 at 18:01
@NickKovalsky thanks for the suggestion, but that sample contains an unpaged SfDataGrid example. I had managed to bind the lines of the grid, paging seems to be the issue (which I also solved for UWP with some simillar code, can't seem to get it in forms)
– Cosmin
Nov 20 '18 at 18:01
add a comment |
1 Answer
1
active
oldest
votes
Thanks for using Syncfusion Product.
We checked your query and the code shared, you need to set the Source of Binding, while setting value to the “SfDataGrid.Columns” property. Please find the code snippet of the same below.
<ContentPage.BindingContext>
<local:ViewModel x:Name="viewModel" />
</ContentPage.BindingContext>
<ContentPage.Content>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<sfgrid:SfDataGrid x:Name="sfGrid"
Grid.Row="0"
AutoGenerateColumns="False"
ColumnSizer="Star"
DefaultColumnWidth="200"
ItemsSource="{Binding PagedSource, Source={x:ReferencedataPager}}"
Columns="{Binding GridColumns, Source={x:ReferenceviewModel}}"
/>
<sfpager:SfDataPager x:Name ="dataPager"
Margin="5"
HorizontalOptions="FillAndExpand"
Grid.Row="1"
PageSize="7"
HeightRequest ="50"
Source="{Binding OrdersInfo}"
/>
</Grid>
</ContentPage.Content>
We have prepared the sample to achieve your requirement, you can download the same from the below link.
Sample Link: http://www.syncfusion.com/downloads/support/directtrac/221044/ze/DataGridDemo-741889615
Regarding your query on documentation of the XAML code “Binding must be done between the ItemsSource of the Grid and the Source of the Pager”, we will update the XAML code of the documentation.
Regards,
Vigneshkumar R
answered Nov 21 '18 at 9:23
Vignesh kumarVignesh kumar
583
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53387081%2fpaged-datagrid-using-syncfusion-in-xamarin-forms%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
Thanks for using Syncfusion Product.
We checked your query and the code shared, you need to set the Source of Binding, while setting value to the “SfDataGrid.Columns” property. Please find the code snippet of the same below.
<ContentPage.BindingContext>
<local:ViewModel x:Name="viewModel" />
</ContentPage.BindingContext>
<ContentPage.Content>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<sfgrid:SfDataGrid x:Name="sfGrid"
Grid.Row="0"
AutoGenerateColumns="False"
ColumnSizer="Star"
DefaultColumnWidth="200"
ItemsSource="{Binding PagedSource, Source={x:ReferencedataPager}}"
Columns="{Binding GridColumns, Source={x:ReferenceviewModel}}"
/>
<sfpager:SfDataPager x:Name ="dataPager"
Margin="5"
HorizontalOptions="FillAndExpand"
Grid.Row="1"
PageSize="7"
HeightRequest ="50"
Source="{Binding OrdersInfo}"
/>
</Grid>
</ContentPage.Content>
We have prepared the sample to achieve your requirement, you can download the same from the below link.
Sample Link: http://www.syncfusion.com/downloads/support/directtrac/221044/ze/DataGridDemo-741889615
Regarding your query on documentation of the XAML code “Binding must be done between the ItemsSource of the Grid and the Source of the Pager”, we will update the XAML code of the documentation.
Regards,
Vigneshkumar R
answered Nov 21 '18 at 9:23
Vignesh kumarVignesh kumar
583
add a comment |
Thanks for using Syncfusion Product.
We checked your query and the code shared, you need to set the Source of Binding, while setting value to the “SfDataGrid.Columns” property. Please find the code snippet of the same below.
<ContentPage.BindingContext>
<local:ViewModel x:Name="viewModel" />
</ContentPage.BindingContext>
<ContentPage.Content>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<sfgrid:SfDataGrid x:Name="sfGrid"
Grid.Row="0"
AutoGenerateColumns="False"
ColumnSizer="Star"
DefaultColumnWidth="200"
ItemsSource="{Binding PagedSource, Source={x:ReferencedataPager}}"
Columns="{Binding GridColumns, Source={x:ReferenceviewModel}}"
/>
<sfpager:SfDataPager x:Name ="dataPager"
Margin="5"
HorizontalOptions="FillAndExpand"
Grid.Row="1"
PageSize="7"
HeightRequest ="50"
Source="{Binding OrdersInfo}"
/>
</Grid>
</ContentPage.Content>
We have prepared the sample to achieve your requirement, you can download the same from the below link.
Sample Link: http://www.syncfusion.com/downloads/support/directtrac/221044/ze/DataGridDemo-741889615
Regarding your query on documentation of the XAML code “Binding must be done between the ItemsSource of the Grid and the Source of the Pager”, we will update the XAML code of the documentation.
Regards,
Vigneshkumar R
answered Nov 21 '18 at 9:23
Vignesh kumarVignesh kumar
583
add a comment |
Thanks for using Syncfusion Product.
We checked your query and the code shared, you need to set the Source of Binding, while setting value to the “SfDataGrid.Columns” property. Please find the code snippet of the same below.
<ContentPage.BindingContext>
<local:ViewModel x:Name="viewModel" />
</ContentPage.BindingContext>
<ContentPage.Content>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<sfgrid:SfDataGrid x:Name="sfGrid"
Grid.Row="0"
AutoGenerateColumns="False"
ColumnSizer="Star"
DefaultColumnWidth="200"
ItemsSource="{Binding PagedSource, Source={x:ReferencedataPager}}"
Columns="{Binding GridColumns, Source={x:ReferenceviewModel}}"
/>
<sfpager:SfDataPager x:Name ="dataPager"
Margin="5"
HorizontalOptions="FillAndExpand"
Grid.Row="1"
PageSize="7"
HeightRequest ="50"
Source="{Binding OrdersInfo}"
/>
</Grid>
</ContentPage.Content>
We have prepared the sample to achieve your requirement, you can download the same from the below link.
Sample Link: http://www.syncfusion.com/downloads/support/directtrac/221044/ze/DataGridDemo-741889615
Regarding your query on documentation of the XAML code “Binding must be done between the ItemsSource of the Grid and the Source of the Pager”, we will update the XAML code of the documentation.
Regards,
Vigneshkumar R
answered Nov 21 '18 at 9:23
Vignesh kumarVignesh kumar
583
Thanks for using Syncfusion Product.
We checked your query and the code shared, you need to set the Source of Binding, while setting value to the “SfDataGrid.Columns” property. Please find the code snippet of the same below.
<ContentPage.BindingContext>
<local:ViewModel x:Name="viewModel" />
</ContentPage.BindingContext>
<ContentPage.Content>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<sfgrid:SfDataGrid x:Name="sfGrid"
Grid.Row="0"
AutoGenerateColumns="False"
ColumnSizer="Star"
DefaultColumnWidth="200"
ItemsSource="{Binding PagedSource, Source={x:ReferencedataPager}}"
Columns="{Binding GridColumns, Source={x:ReferenceviewModel}}"
/>
<sfpager:SfDataPager x:Name ="dataPager"
Margin="5"
HorizontalOptions="FillAndExpand"
Grid.Row="1"
PageSize="7"
HeightRequest ="50"
Source="{Binding OrdersInfo}"
/>
</Grid>
</ContentPage.Content>
We have prepared the sample to achieve your requirement, you can download the same from the below link.
Sample Link: http://www.syncfusion.com/downloads/support/directtrac/221044/ze/DataGridDemo-741889615
Regarding your query on documentation of the XAML code “Binding must be done between the ItemsSource of the Grid and the Source of the Pager”, we will update the XAML code of the documentation.
Regards,
Vigneshkumar R
answered Nov 21 '18 at 9:23
Vignesh kumarVignesh kumar
583
answered Nov 21 '18 at 9:23
Vignesh kumarVignesh kumar
583
answered Nov 21 '18 at 9:23
Vignesh kumarVignesh kumar
583
answered Nov 21 '18 at 9:23
Vignesh kumarVignesh kumar
583
583
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53387081%2fpaged-datagrid-using-syncfusion-in-xamarin-forms%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Have you compiled syncfusion sample solution for forms?
– Nick Kovalsky
Nov 20 '18 at 6:58
@NickKovalsky I do not know which solution are you referring to. Can you please provide me with more details?
– Cosmin
Nov 20 '18 at 12:09
Install xamarin samples after you install the sdk and open/build SampleBrowser.SfDataGrid.sln
– Nick Kovalsky
Nov 20 '18 at 14:31
@NickKovalsky thanks for the suggestion, but that sample contains an unpaged SfDataGrid example. I had managed to bind the lines of the grid, paging seems to be the issue (which I also solved for UWP with some simillar code, can't seem to get it in forms)
– Cosmin
Nov 20 '18 at 18:01