@boikom
@boikom
Forum Replies Created
-
AuthorPosts
-
admin
KeymasterHello TurricanDE,
The allowExport functionality is now working in the latest version of Smart.Blazor.
Best Regards,
Peter StoevSmart HTMLElements Team
https://www.htmlelements.com/admin
KeymasterHi rizwan,
I would suggest you to check the getting started docs and the demos in the download package. They will help you to learn how to use our product.
Best regards,
Peter StoevSmart UI Team
https://www.htmlelements.com/February 14, 2022 at 10:50 am in reply to: GridAppearance.ShowTooltips has no effect for columns (Blazor) #102875admin
KeymasterHi,
Currently, we have no option built-in for DataGrid Column tooltips in Blazor as well as in Javascript. We will consider adding such an option in the future versions of the datagrid component.
Best regards,
Peter StoevSmart UI Team
https://www.htmlelements.com/admin
KeymasterHi riswan,
If you do not want the demo’s JS on another page, you can add a script tag on the html page and copy-paste the index.js into it. If you find it easier to use jQuery, you can use our jQuery product instead – https://www.jqwidgets.com/jquery-widgets-demo/
Best regards,
Peter StoevSmart UI Team
https://www.htmlelements.com/February 14, 2022 at 7:39 am in reply to: Proper way to update changes made on data grid editing (Blazor) #102871admin
KeymasterHi,
At present there is currently no such built in method in our blazor datagrid, but we will consider adding it for the upcoming versions. It will be helpful feature.
Best regards,
Peter StoevSmart UI Team
https://www.htmlelements.com/admin
KeymasterHi Kristopher,
Thank you for writing.
We tried to reproduce that:
Example:
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Tree Selection Modes</title> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" /> <link rel="stylesheet" type="text/css" href="../../../source/styles/jqx.default.css" /> <link rel="stylesheet" type="text/css" href="../../../styles/demos.css" /> <link rel="stylesheet" type="text/css" href="styles.css" /> <script type="text/javascript" src="../../../source/webcomponents-lite.js"></script> </head> <body class="viewport"> <smart-tree id="tree" selection-mode="zeroAndOne"> <smart-tree-item>Home</smart-tree-item> <smart-tree-item>Education</smart-tree-item> <smart-tree-item>Financial services</smart-tree-item> <smart-tree-item>Government</smart-tree-item> <smart-tree-item disabled>Manufacturing</smart-tree-item> <smart-tree-items-group> Communities <smart-tree-item>Partners</smart-tree-item> <smart-tree-items-group> By resource <smart-tree-item id="tv">TV</smart-tree-item> <smart-tree-item>Experience Design</smart-tree-item> </smart-tree-items-group> </smart-tree-items-group> </smart-tree> <!-- scripts --> <script type="module" src="../../../source/modules/smart.tree.js"></script> <script type="module" src="index.js"></script> </body> </html>
index.js
window.onload = function () {
const tree = document.querySelector(‘smart-tree’);tree.select(‘tv’);
tree.ensureVisible(‘tv’);
};Best regards,
Peter StoevSmart UI Team
https://www.htmlelements.com/February 13, 2022 at 7:56 am in reply to: Proper way to update changes made on data grid editing (Blazor) #102866admin
KeymasterHi and thanks for trying our Blazor DataGrid,
I prepared a sample which shows how to use the Editing events.
@page "/grid-editing-events" @using Smart.Blazor.Demos.Data @using System.Text.Json; @using System.Text.Json.Serialization; @inject RandomDataService dataService <style> body, html, app { height: 100%; } app { overflow: auto; } .content { height: calc(100% - 70px); } /* This is the CSS used in the demo */ @@media only screen and (max-width: 700px) { smart-grid { width: 100%; } } </style> <Example Name="Grid"> <h1>Grid Cells Editing Events</h1> <p> Click on any cell to begin edit its value. To confirm the changes, press 'Enter' or click on another cell or outside the Grid. To cancel the changes, press 'Escape'. </p> @if (dataRecords == null) { <p><em>Loading...</em></p> } else { <Grid @ref="grid" OnBeginEdit="BeginEditHandler" OnEndEdit="EndEditHandler" DataSource="dataRecords" Editing="@editing"> <Columns> <Column DataField="FirstName" Label="First Name"></Column> <Column DataField="LastName" Label="Last Name"></Column> <Column DataField="ProductName" Label="Product"></Column> <Column DataField="Expired" Label="Expired" DataType="boolean" Template="@checkBoxEditor" Editor="@checkBoxEditor"></Column> <Column DataField="Quantity" Label="Quantity" DataType="number" Editor="@numberInputEditor" Align="HorizontalAlignment.Right" CellsAlign="HorizontalAlignment.Right"></Column> <Column DataField="Price" Label="Unit Price" DataType="number" Editor="@numberInputEditor" Align="HorizontalAlignment.Right" CellsAlign="HorizontalAlignment.Right" CellsFormat="c2"></Column> </Columns> </Grid> } </Example> @code { private string checkBoxEditor = "checkBox"; private string numberInputEditor = "numberInput"; Grid grid; GridEditing editing = new GridEditing() { Enabled = true, Mode = GridEditingMode.Cell }; private List<DataRecord> dataRecords; async void EndEditHandler(Event args) { GridEndEditEventDetail detail = args["Detail"] as GridEndEditEventDetail; long rowId = detail.Row; string dataField = detail.Column; object value = await grid.GetCellValue(rowId, dataField); Console.WriteLine(value); } void BeginEditHandler(Event args) { GridBeginEditEventDetail detail = args["Detail"] as GridBeginEditEventDetail; } protected override void OnInitialized() { base.OnInitialized(); dataRecords = dataService.GenerateData(1000); } }
Hope this helps.
Best regards,
Peter StoevSmart UI Team
https://www.htmlelements.com/admin
KeymasterHi Joko,
Please, look at: https://www.htmlelements.com/demos/form/overview/. On submit, the form sends the data as it is a normal HTML Form element.
Best regards,
Peter StoevSmart UI Team
https://www.htmlelements.com/admin
KeymasterHi Joko,
If you have such scenario, you may use the Table instead – https://www.htmlelements.com/demos/table/basic/. It’s purpose is to replace the HTML Table. The DataGrid is for the more advanced and complex scenarios.
Best regards,
Peter StoevSmart UI Team
https://www.htmlelements.com/admin
KeymasterHi Joko,
What do you mean by default style compact? If you mean individual stylesheets for these components then they are already available in source\styles\components. In that folder you will find the individual stylesheets for each UI component.
Best regards,
Peter StoevSmart UI Team
https://www.htmlelements.com/admin
KeymasterThe property descriptions for all UI components have been improved and updated. For example: https://www.htmlelements.com/docs/combobox-api/#toc-autocomplete_none__auto__inline__manual.
Best regards,
Peter StoevSmart UI Team
https://www.htmlelements.com/admin
KeymasterHi Bryan,
It works with SQL calls, example: https://www.htmlelements.com/demos/grid/server-side-mysql-php/. If you have more complex scenario, you can use the native fetch and bind the grid to the fetch’s result.
Best regards,
Peter StoevSmart UI Team
https://www.htmlelements.com/admin
KeymasterHi Joko,
The Grid does not support such scenario. You can data bind it to Array, JSON, CSV, TSV or XML data.
Best regards,
Peter StoevSmart UI Team
https://www.htmlelements.com/admin
KeymasterHi Joko,
The ListBox displays only Label and has an additional Value field. For more complex scenarios, you can use the Table or Grid component which allow multiple fields and more complex data binding.
Best regards,
Peter StoevSmart UI Team
https://www.htmlelements.com/admin
KeymasterNo autocomplete: The combobox is editable, and when the popup is triggered, the suggested values it contains are the same regardless of the characters typed in the combobox. For example, the popup suggests a set of recently entered values, and the suggestions do not change as the user types.
List autocomplete with manual selection: When the popup is triggered, it presents suggested values. If the combobox is editable, the suggested values complete or logically correspond to the characters typed in the combobox. The character string the user has typed will become the value of the combobox unless the user selects a value in the popup.
List autocomplete with automatic selection: The combobox is editable, and when the popup is triggered, it presents suggested values that complete or logically correspond to the characters typed in the combobox, and the first suggestion is automatically highlighted as selected. The automatically selected suggestion becomes the value of the combobox when the combobox loses focus unless the user chooses a different suggestion or changes the character string in the combobox.
List with inline autocomplete: This is the same as list with automatic selection with one additional feature. The portion of the selected suggestion that has not been typed by the user, a completion string, appears inline after the input cursor in the combobox. The inline completion string is visually highlighted and has a selected state.Best regards,
Peter StoevSmart UI Team
https://www.htmlelements.com/ -
AuthorPosts