I need to implement a grid in asp.net that behaves almost exactly like MS Excel.
- can navigate around with arrow keys
- you can edit the cell that currently has focus by simply typing
- supports checkboxes, dropdownlists, etc
One crucial requirement is....I need to be able to somehow, after update of any cell within a row, pass that updated value back to the server, as there is a calculation process that happens using that updated value that can update other cells in the row, and I need to essentially rebind all the cells in the current row with the updated values resulting from the calculation. AND...when I do this, I want to retain focus on the cell that had it after the update of the former cell. Without grid scrolling, etc, etc.
If you're wondering what I'm talking about, just imagine Microsoft Excel, but I need to perform the formula calculations on the server and refresh all cells in the current row with the results....and, not lose focus of my current cell.
I am more than happy to pay $1000 or whatever it is for one of the full blown commercial ASP.Net grid controls, but from the ones I have tried so far, they seem to not be capable of this, at least I don't know how.
Aspose Grid - would have worked great, except it is totally full of bugs
Telerik RadGrid - a colleague familiar with that grid is trying to figure it out with no luck
Farpoint Grid - looks promising but haven't tried it out yet
If anyone has any advice on how to specifically accomplish this, it would be much appreciated.
Have you tried the extjs sample?
It has a commercial licence, but you can try it for free.
I managed to find an example about Excel-like RadGrid by Telerik - if you are interested in it, you can see it here. And good luck with your implementation.
Did you look into using jQuery for this? Look into jQuery templates and ajax.
Related
In my ig:WebDataGrid there are two columns that hold boolean values coming from a database; the column is defined via
<ig:BoundCheckBoxField Key="Mandatory" DataFieldName="Mandatory" Header-Text="test" />
Every editing option (be it RowEditing or CellEditing) works fine with the automatically provided CheckBoxes that represent the values. But now I want to use the RowAdding feature. Unfortunately I can't find any EditorProvider that seems to fit for CheckBoxes, and just leaving the definition for the respective columns empty results in the cells not being clickable/editable in the adding row, although there are grayed out CheckBoxes shown and the column is not set to be ReadOnly.
Is there any way to get an editor provider fit for this? Since editing works automatically with the CheckBoxes I feel like there should be an easy way to get RowAdding to work analogously. Otherwise I'd have to go the 'painful' way via creating a DropDown Provider with 'true/false' as values... which would be way less elegant.
The problem turned out to be a bug in the specific Infragistics version we were using. Updating to the latest Service Release of the 14.1 controls fixed this particular problem. Although there is indeed no CheckBox editor provider, those just work by default now.
I would like to show my table data in grid. The table has more than 50 columns. By default they are displayed fine but I need a way to hide/show columns which are not required on screen.
So is there any way to achieve this? I think right clicking on the header should show all headers in a list box, allowing selection of which columns we want, then refresh the grid.
Please let me know if Telerik supports this and, if so, how?
No builtin feature available and this is one of many reasons why we are still thinking about other grids instead of telerik.
In the demo site there is a page where they show all the column names with checkboxes on top of the grid and you can check/uncheck to show/hide columns. see that sample source code, is simple to implement but still is custom code to add manually. I love the devexpress grid with customization popup and columns dragdrop from there but nothing like that for us in Telerik :-(
I come from the Delphi school. I was really used and pleased with Delphi grids with the plus features of InfoPower. Not just me, my users loves all features that include grids. Some motives for that are:
With grids they have the ability to insert detail information using only the keyboard. Input, Tab, Input, Tab, Input Tab (automatically insert new row), input, tab, etc.
They were able to simply click in a row and edit it´s data.
They could navigate between records using only arrow keys.
In my flex apps I´ve being working arround this quite often, sometimes using a popup to insert data, sometimes using repeater instead of grid. But now I really really need some intuitive, fast way for my users to insert this data.
I am trying to use DataGrid (or AdvancedDataGrid) with inline editors and I am living a real hell to do that. For the last 3 days I am struggling, tweaking and workarrounding in order to try to mimic the features that I had with Delphi.
Main problems are:
DateField simply don´t work as an inline editor. It gets focus but never looses, only with pressing ESC, wich makes me loose the inputed data.
AdvancedAutoComplete: I have a component descendant from AdvancedAutoComplete with a custom browser. The custom browser is a popup, when I try to PopupManager.remove flex raises an exception of a null pointer inside it´s focus managing engines.
I couldn´t get to insert a new line focused in it´s first column when TABing in the last column of last row.
Having all these problems and not getting substantial material to solve them makes me think the (now obvious) fact that it is just not the way grids are intended to work in flex. My question is: what are the patterns used in flex applications to make sequencial, intuitive, fast, keyboard only insertions in a detail?
To answer your question bluntly, there are no specific established patterns to make editing or inserting data in the DataGrid fast and easy. Not being able to Tab between fields is one of the things I really wish Adobe had added to the DataGrid by default.
In order to get the functionality you want, you'll have to do some custom coding and extend/override the DataGrid's default functionality. Switch On The Code has an example up on tabbing between fields, but you would have to build upon their sample a bit further to include features like adding a new row when pressing tab in the last field of the last row in the DataGrid.
You may also want to consider Flexicious. Based on the Flexicious Ultimate demo, it looks like they have the functionality you're looking for (and then some!).
Coolite has excellent support for Grids, and the GridPanel control has an obvious property: EnableDragDrop. But after a lengthy search through the forums and given examples, I have yet to come across a good example that demonstrates a fairly simple task: drag-and-drop rearranging of rows in a normal GridPanel.
Has anyone implemented drag-and-drop of GridPanel rows in Coolite without resorting to working directly with Ext JS?
Edit:
#Kheu: I have indeed tried setting EnableDragDrop="true" on a Coolite ext:GridPanel. But that is just part of the equation. Just setting EnableDragDrop="true" will give you the ability to drag rows (well, kind of; a simple "n row(s) selected" placeholder appears) but disallow you from dropping them. I’ve managed to enable drag and drop by augmenting the Coolite controls with plain ExtJS, but I am hesitant to post my work, because it seems there should be a simple solution in Coolite. There is even a good multiselect drag-and-drop example (see the "Drag/Drop (Insert Mode)" tab, but with no clear means of recreating the same functionality in GridPanels (that example uses ext:Multiselect nested within a regular ext:Panel).
Maybe you have to take a look at how rearranging columns is implemented in ExtJS (quite complicated)? And reimplement it for rows in a similar way.
I have spent a while searching google for an answer to the following question, with no luck.
Does anyone know if there is any way (at all) to use the Design view to edit the contents of an ASP.NET table control (an <asp:Table runat="server">...)?
From all that I can tell, devs are stuck coding their <asp:TableRow>s and <asp:TableCell>s by hand! This is ludicrous, given that you can use the design view as a WYSIWYG editor for standard HTML tables.
In design view go to the properties of your table and select rows and click the button. You can add rows there. Likewise the row properties has a cells property that lets you add cells one at a time.
Still pretty bad but it would cut down on the hand typing.
There is a Rows property you can play with in the design view.
As you add rows to the Rows collection, you have access to the Cell property as well through the dialog presented to you.