I started experimenting with devexpress Blazor Grid component for a project that we are migrating from Webforms to Blazor WebAssembly.
I see the pagination component in the grid works really fine.
But I have this requirement to load all records without pagination and kind of struggling to get the right settings
<DxDataGrid DataAsync="#GetEmployeeStatssAsync" WIDTH="700px" VerticalScrollBarMode="ScrollBarMode.Auto"
VerticalScrollableHeight="200">
<DxDataGridColumn Field="#nameof(EmployeeStatResponse.FullName)" Width="30px" />
<DxDataGridColumn Field="#nameof(EmployeeStatResponse.Batches)" Width="30px" />
<DxDataGridColumn Field="#nameof(EmployeeStatResponse.Lines)" Width="20px" />
<DxDataGridColumn Field="#nameof(EmployeeStatResponse.Units)" Width="20px" />
<DxDataGridColumn Field="#nameof(EmployeeStatResponse.Hours)" Width="30px" />
<DxDataGridColumn Field="#nameof(EmployeeStatResponse.LPH)" Width="30px" />
<DxDataGridColumn Field="#nameof(EmployeeStatResponse.Errors)" Width="30px" />
<DxDataGridColumn Field="#nameof(EmployeeStatResponse.EPer)" Width="30px" />
</DxDataGrid>
I tried by setting the pagesize as 10,000, But when I do that the screen freezes.
<DxDataGrid DataAsync="#GetEmployeeStatssAsync(51)" WIDTH="700px" PageSize="10000"
VerticalScrollBarMode="ScrollBarMode.Auto"
VerticalScrollableHeight="200">
Please let me know what is the correct wat to implement
Thank you in advance.
you can use the ShowPager, PagerAllDataRowsItemVisible, PageSize properties for DxDataGrid
<DxDataGrid Data="#employees" ShowPager="false" PagerAllDataRowsItemVisible="false" PageSize="10000">
<DxDataGridColumn Field="Id" AllowSort="false" Width="50px"/>
<DxDataGridColumn Field="Name" AllowSort="false" Width="50px"/>
<DxDataGridColumn Field="PhoneNumber" AllowSort="false" Width="50px"/>
</DxDataGrid>
Related
I'm trying to implement a simple AjaxControlToolkit PieChart, but whatever data I'm using the page looks like this, on Chrome or IE 11 and IE 10:
Here is my simple code:
<asp:piechart id="PieChart1" runat="server" backcolor="#993333" bordercolor="#660033"
borderstyle="Solid" forecolor="White" height="349px" width="320px" charttitle="Country Population"
charttitlecolor="Blue">
<PieChartValues>
<asp:PieChartValue Category="India" Data="1000" PieChartValueColor="green" PieChartValueStrokeColor="white" />
<asp:PieChartValue Category="US" Data="3000" PieChartValueColor="blue" PieChartValueStrokeColor="black" />
<asp:PieChartValue Category="China" Data="6000" PieChartValueColor="pink" PieChartValueStrokeColor="red" />
<asp:PieChartValue Category="Australia" Data="7000" PieChartValueColor="yellow" PieChartValueStrokeColor="blue" />
</PieChartValues>
</asp:piechart>
Any help will be appreciated.
Thanks.
I have asp.net menu that uses xml datasource here's the html code:
<DataBindings>
<asp:MenuItemBinding DataMember="Menu" NavigateUrlField="Nav" TextField="Text" ToolTipField="Text" />
</DataBindings>
</asp:Menu>
<asp:XmlDataSource XPath="/Menus/Menu" ID="XmlDataSource1" runat="server" DataFile="~/data.xml" >
</asp:XmlDataSource>
The xml is at:
http://www.nlprogramming.net/data.xml
The error is that the Nav property not found for navigateurlfield
Can u help me?
Thanks
i wanto to start use a Ext.Net desktop (i use it as "normal page" for other application).
i want to know the best approach of initialization desktop from database data.
my actual approach is:
1. start with "minimal" desktop page (start menu ecc...) without any modules;
2. read data from database (based on same parameters) and create dynamic modules (i think with DesktopModuleProxy) whit userc control (ex i save path/title/etc... of usercontrol in database);
3. create usercontrol and render it in desktop
i start with this example: http://examples.ext.net/#/Desktop/Introduction/Overview/
method AddNewModule() works only if there is a submit (ex with a launcher), but it doesn't works from Page_Load event and i have this javascript error:
"Cannot read property 'length' of undefined" in ext.axd:93
maybe i use wrong lifecycle page?
finally maybe i use a webform instead usercontrol, but i have same case where i must use usercontrol...
thanks!
.aspx FILE
<ext:Desktop ID="Desktop1" runat="server">
<StartMenu Title="Ext.Net Desktop" Icon="Application" Height="300">
<ToolConfig>
<ext:Toolbar ID="Toolbar1" runat="server" Width="100">
<Items>
<ext:Button ID="Button1" runat="server" Text="Settings" Icon="Cog" />
<ext:Button ID="Button2" runat="server" Text="Logout" Icon="Key">
<DirectEvents>
<Click OnEvent="Logout_Click">
<EventMask ShowMask="true" Msg="Ciao..." MinDelay="1000" />
</Click>
</DirectEvents>
</ext:Button>
</Items>
</ext:Toolbar>
</ToolConfig>
</StartMenu>
<TaskBar TrayWidth="100">
<QuickStart>
<ext:Toolbar ID="Toolbar2" runat="server">
<Items>
<ext:Button ID="Button3" runat="server" Handler="tile" Icon="ApplicationTileVertical">
<QTipCfg Text="Tile windows" />
</ext:Button>
<ext:Button ID="Button4" runat="server" Handler="cascade" Icon="ApplicationCascade">
<QTipCfg Text="Cascade windows" />
</ext:Button>
</Items>
</ext:Toolbar>
</QuickStart>
<Tray>
<ext:Toolbar ID="Toolbar3" runat="server">
<Items>
<ext:ToolbarFill ID="ToolbarFill1" runat="server" />
</Items>
</ext:Toolbar>
</Tray>
</TaskBar>
<DirectEvents>
<Ready OnEvent="loadTest"></Ready>
</DirectEvents>
</ext:Desktop>
.cs file
[DirectMethod]
public void loadTest(object sender, DirectEventArgs e)
{
DesktopModuleProxy control = Ext.Net.Utilities.ControlUtils.FindControl<Ext.Net.DesktopModuleProxy> (this.LoadControl("/user/default.ascx"));
control.RegisterModule();
}
Error by chrome:
Uncaught TypeError: Cannot read property 'app' of undefined Default.aspx:31
Uncaught TypeError: Cannot read property 'length' of undefined ext.axd:93
these is a "last version" of my various tests. if i invoke same method "loadTest" by button (like the original example) it works. User control has only 1 label with datetime.
thanks!
You can use Ext.onReady and ext:ResourcePlaceHolder with DirectMethod on server, like this:
<ext:ResourcePlaceHolder runat="server" Mode="Script" />
<script type="text/javascript">
Ext.onReady(function () {
App.direct.YourDirectMethod();
});
</script>
I'm using Ext.NET 1.2. I need to create a ColumnTree in my system.
Markup
<ext:ColumnTree ID="colProjects" runat="server" RootVisible="false" Title="Projetos" EnableDD="true">
<TopBar>
<ext:Toolbar ID="Toolbar1" runat="server">
<Items>
<ext:Button ID="btnExpandAll" runat="server" Text="Expandir Tudo">
<Listeners>
<Click Handler="#{colProjects}.expandAll();" />
</Listeners>
</ext:Button>
<ext:Button ID="btnCollapseAll" runat="server" Text="Recolher Tudo">
<Listeners>
<Click Handler="#{colProjects}.collapseAll();" />
</Listeners>
</ext:Button>
</Items>
</ext:Toolbar>
</TopBar>
<Loader>
<ext:TreeLoader>
<UIProviders>
<ext:TreeNodeUIProvider Alias="col" ClassName="<%# ColumnTree.ColumnNodeUI %>" AutoDataBind="true" />
</UIProviders>
</ext:TreeLoader>
</Loader>
<Columns>
<ext:ColumnTreeColumn Header="Nome" Width="330" DataIndex="Name" />
<ext:ColumnTreeColumn Header="Sistema" Width="100" DataIndex="ProjectGroup" />
<ext:ColumnTreeColumn Header="Recurso" Width="100" DataIndex="SprintOwner" />
<ext:ColumnTreeColumn Header="Status" Width="100" DataIndex="Status" />
</Columns>
</ext:ColumnTree>
I populate it dynamically via codebehind which works well. The last column needs to be editable and updated to the database but I have no idea whether or not it is possible to do so. How can I do that?
With 1.2 version of Ext.NET you can't do this.
Found at Ext.NET forum message from mcgill, author of Ext.NET.
http://forums.ext.net/showthread.php?12251-CLOSED-ColumnTree-cell-editing
At the moment Editors are not supported on the Component.
We did some preliminary investigation and will add this as a Feature
Request to implement in a future release.
There is a problem though... I think this functionality may be
included in the next major release of Ext.NET (v2). But that release
is a ways off yet.
As a solution I recommend you to look at this example: http://examples.ext.net/#/GridPanel/Data_with_Details/Form_Details/
You can do this in your project for grid and without unnecessary request to the server.
I have a question about AJAX MultiHandleSliderExtender. Code is following:
<form runat="server" id="myForm">
<asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server" CombineScripts="false" />
<asp:TextBox ID="strMinModTB" runat="server" Style="display:none;" Text="80" />
<asp:TextBox ID="strCurModTB" runat="server" Style="display:none;" Text="100" />
<asp:TextBox ID="strMaxModTB" runat="server" Style="display:none;" Text="160" />
<asp:TextBox ID="strSlider" runat="server" Style="display:none;" />
<asp:MultiHandleSliderExtender ID="strModMultiSlider" runat="server"
BehaviorID="strModMultiSlider"
TargetControlID="strSlider"
Minimum="0"
Maximum="300"
Length="600"
EnableHandleAnimation="true"
EnableKeyboard="false"
EnableMouseWheel="false"
ShowInnerRail="true"
ShowHandleDragStyle="true"
ShowHandleHoverStyle="true">
<MultiHandleSliderTargets>
<asp:MultiHandleSliderTarget ControlID="strMinModTB" />
<asp:MultiHandleSliderTarget ControlID="strCurModTB" />
<asp:MultiHandleSliderTarget ControlID="strMaxModTB" />
</MultiHandleSliderTargets>
</asp:MultiHandleSliderExtender>
<asp:Label ID="sliderLabel" runat="server" Visible="true"></asp:Label>
</form>
Now what I want to do is to lock positions of outter handles and allow only the middle one to be dragged in range from the left hanle to the right one thus changing the value in asp:Label (ID="sliderLabel").
I've tried readOnly="true" attribute on TextBoxes but with no result. There is also IsReadOnly Extender property but that blocks all handles.
Also when I add the BoundControlID property (containing ID of label) to the Extender it stops working (all handles on 0 position and I cannot drag them)
Is there a way around this or am I missing something?
Thank you for replies :)
You don't need a BoundControlID for the MHSE do you?
Also, could you not add a class to each Handle and then fix the outer handles positions using CSS?
See below for code example.
ASP Code
<asp:MultiHandleSliderExtender ID="strModMultiSlider" runat="server"
BehaviorID="strModMultiSlider" TargetControlID="strSlider"
Minimum="0" Maximum="300" Length="600"
EnableHandleAnimation="true" EnableKeyboard="false"
EnableMouseWheel="false" ShowInnerRail="true"
ShowHandleDragStyle="true" ShowHandleHoverStyle="true">
<MultiHandleSliderTargets>
<asp:MultiHandleSliderTarget ControlID="strMinModTB" HandleCssClass="handle_outer"/>
<asp:MultiHandleSliderTarget ControlID="strCurModTB" HandleCssClass="handle_inner" />
<asp:MultiHandleSliderTarget ControlID="strMaxModTB" HandleCssClass="handle_outer"/>
</MultiHandleSliderTargets>
</asp:MultiHandleSliderExtender>
CSS Code
.handle_outer
{
//Code to Fix Handle in Place
}
.handle_inner
{
}