Flex DataGrid sequencial inserting - apache-flex

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!).

Related

Infragistics WebDataGrid RowAdding: Are there no CheckBox editor providers?

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.

ASP.NET Dynamic Menu

I have to create a Dynamic menu in ASP.NET. I want to use dynamic LinkButtons (or can be a Menu Control), but should be appended with sequence numbers. Eg: 1,2,3a 3b etc..and these sequcenes could be dynamic. Any idea. I used a repeater with a label and LinkButton in it, but having problems with view state. Any idea how to append sequence to menu??
Essentially, you have two paradigms with web applications, at least from this conversation's standpoint.
Stream out the HTML, creating it as you stream
Create containers that can bind to data and shape the data
Your concept seems to be "only #1 is dynamic", but that is not true. Any time you can change the data and get a different output, you are dealing with something dynamic. My personal feeling is shape the menu data prior to binding. This cannot always be done, but more oft than not, it can. The second method would be to attach to an event like a item binding or row binding event. Controlling the HTML stream and writing out individual items is generally my last resort.
Now to the viewstate issue. Viewstate is a bastard when you start adding things to an item after binding and semi-problematic when you are playing the dynamic game from #1 above. The problem is things added after the initial definition cannot easily be set up with automagic bits. You end up having to rebind each time. This is why shaping data and then binding is superior. Even in cases where you have to rebuild, you can cache the shaped data and quickly rebind. It takes more "up front" work, but is less problematic.
The actual container you are binding with is inconsequential. Unless you can't use the menu control for some reason (other than having to dynamically add, which can be solved by playing with the bound data), I would head this direction. Actually, I would head this direction and use the CSS friendly adapters so you can alter the look and feel more easily. :-)

Need to "introspect" innards of flex <mx:itemRenderer>

I've got a flex app with a DataGrid with several columns (defined in the MXML file), and I need to "introspect" the grid columns. That is, I need to write some ActionScript code which, given the DataGrid object, can determine various things about the grid (and more specifically, the columns of the grid).
In particular, if a column is just plain text output, I don't really care about it... but if it's got "actionable" controls within it (checkboxes, linkbuttons, etc) I do.
First, I'm assuming that columns which contain "actionable" contents will be within <mx:itemRenderer> tags (else it would just be plain text); please let me know if this is incorrect.
Next I need to "dig down" into the structures, pulling the AS object corresponding to the <mx:DataGridColumn> out of the <mx:DataGrid> (I've got this), then pulling the AS object corresponding to the <mx:itemRenderer> out of the mx:DataGridColumn (two diff ways to do this; neither seems very useful), then pulling the AS object that corresponds to the <mx:Component> out of the mx:itemRenderer (if any; it's unclear to me whether the mx:Component actually creates an object), and finally pulling the AS object corresponding to the <mx:LinkButton> (or whatever) out of the mx:Component.
Does anyone know how to do this?
P.S. I understand that there's almost no limit to what could be lurking within the itemRenderer; if I can dig down that far, I'm willing to test for a handful of things that I expect and ignore the rest.
To clarify somewhat, I've been asked to provide Section 508 compliance (accessibility) to an existing application. There are a lot of pieces to this, of course, including screen readers, etc... but one of the first steps is making sure that the application can be used without a mouse.
Many of the existing screens have a UI technique consisting of a DataGrid with item renders which place controls like radio buttons and linkbuttons and whatnot into the cells (same type of control all the way down the column). All well and good, except I can find no way to interact with these controls via the keyboard.
So, I modified one screen to have a hot key which pops up a context menu, allowing the user to arrow up/down among the actionable items, and press ENTER to choose one (toggle the checkbox, press the linkbutton, etc). But this was screen-specific, and it will be too easy for someone to update the screen (e.g. adding another actionable column) and neglect the menu.
A better (?) approach was suggested: subclass the data grid, introspect to find the actionable columns, build the menu automatically, and now all we have to do is swap out the SuperDataGrid for the DataGrid, and our screens will be 508 compliant.
If someone can recommend a better way to make the screens 508-compliant (without redesigning the UI) and with minimal per-screen effort, I'm all ears.
Maybe I'm not being clear enough, since you keep missing the point, so let me try again.
I'm NOT writing application-level code... if I were, I'd know exactly what the logic is doing and I'd be able to use the bound data in the normal way. In fact, the application-level code DOES use the bound data in the normal way. But that's totally beside the point.
What I'm TRYING to do is write "infrastructure-level" code: that is, code which runs "below" the level of the application logic. I'm trying to effectively add a feature to DataGrids which Adobe should have included, but didn't. If I can get this class working, it will be possible to just drop it into dozens of screens WITHOUT ME, AS THE CLASS AUTHOR, KNOWING ANYTHING ABOUT THOSE SCREENS OR THE LOGIC WITHIN THEM. The only way I can imagine this working is to look into the datagrid and discover, at run time, what types of controls lurk within it, and possibly what they're bound to (actually, I can probably just execute whatever the click="foo()" attribute says to do, and I won't need to know what they're bound to).
Does this make sense?
Is it possible?
Item renders interact with the outside world through their data property. They should render the data as desired and make changes to data as required. They should not reach outside and you should not try to reach in to affect an item renderer directly.
As far as the underlying problem you're trying to solve, you haven't stated it at all. You're describing a desire to follow through on a particular solution only but haven't described the underlying problem. What are you really trying to accomplish? Don't talk about getting access to item renders or digging into the DataGrid, but what interaction or affect on the rows do you want? The problem is your approach is somewhat backwards and that's why it's not working out.

Editing an ASP.NET table control using the Design View in Visual Studio 2008

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.

ASP.Net - Possible to edit multi rows in grid, then save all? PLUS...partial postback of single row with new value retrieval from dataset

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.

Resources