Flex :: Use Custom Background Skin On Datagrid Header For Currently Sorted Column
Apr 26, 2011
I use a flex mx:datagrid. I can set the headerBackgroundSkin to specify a skin or a picture to be displayed in all datagrid column's headers and it works just fine !
The problem is I can't find any way to specify a custom skin for the currently sorted column (doesn't matter if the sort is asc or desc, this is just to show the user which column is currently sorted).
I also tried to create a custom headerRenderer for each column but it is quite complicated and doesn't work very well.
I have been looking for the solution for a while but I can't find a good approach to do it. It sounds like a very basic need for me...incredible it is so complicated to achieve with Flex !!
I noticed someone was looking for the same thing few years ago but without success... [URL]
I want to know which header the user clicked on to give the currently sorted view. Is there an API in flex framework that I can use to achieve this? Hopefully I can get back a column index so I know how it is currently sorted.
I have a column in a data grid that has the values of "Monday", "Tuesday" etc, as varchars, and I wanted to know, how do i sort the column to be in the correct order. Doing a normal sort doesnt work obviously, as the days are not alphabetically ordered naturally (Wed after Thurs). I am assuming some sort of itemrenderer, but anyone got a snippet of code to illustrate how this would work?
I want to display the grid control in Flex ( version 3 . with a marker/(or)icon (which acts like a button) in each colum header of the grid.2. on click of the button i want o popup a textaread to capture some comments.3. on close of the popup i wan to then change th markericon in a way highliting it which would indicate that some comments(footnotes) are present for this column. I am very new to flex looking at the data grid control at this point. I understand that the standard features can be easily plugged in by msxml. Do i need to write some complex action script for above feature listed?
I have below columnGroup in advancedDataGrid control and I want to show the header in red background color and also applied the style but the background color in the header does not show as red only the text color in the header is changed.[code]...
I am looking for a solution to complete within AS2 that allows a user to hover over a column header within a datagrid and a tooltip would pop-up.I'm completeing a sports statistics sheet within Flash and I am obviously putting numbers in each column, else I would use the full column header but its just a number so I don't want to increase the width of the columns just for that.If anyone knows of a way to make each individual column header able to pop up a tooltip plz post or recommend something. To give an example if it isnt obvious of what I'm trying to doLets say my Table looks like soGP | G | A | +/- | %
I have a Flex 4, mx:DataGrid with the following (pertinent) properties set:
width="100%"horizontalScrollPolicy="off"
I have the minWidth set on all of the DataGridColumns and the width set on one of them. If I simply maximize/minimize the display (in browser or stand-alone flash player) of the application, the columns scale up and down nicely. But if you grab the edge of the application and drag it to make it bigger, only one column grows really big. When you drag the size down again, the one column remains big, but all of the other columns get squished way down.
I'm trying to create a layout not too different from the feed reader sample.The problem I'm having is that I'm finding the documentation unclear. There are so many different types of layouts that I don't know which one to use when.In the example, on the right side there are a few horizontal panels:
this does not include the details panel and the resize handle.I would like to swap the DataGrid with my custom content which is basically a sprite. The problem I have is that I cannot just include a sprite, because it does some funky resizing. I would like the scroll bar to appear when the content is too tall, and have have the same skin for the background as the DataGrid.
I am trying to use the same custom renderer for all the columns in a spark DataGrid. I need to know the dataField or columnIndex based on which I can change state in my custom itemrenderer.
Earlier in mx:DataGrid, this can be achieved by extending the MXDataGridItemRenderer which implements IDropInListItemRenderer and hence dataGridListData property is available.
But using the spark DataGrid, I am extending the GridItemRenderer which DOES NOT implement the IDropInListItemRenderer and hence unable to access dataGridListData property. I have tried to write an action script class extending GridItemRenderer and implementing dataGridListData but flex throws an error in the set function of this variable.
// Sample itemRenderer used for mx:DataGrid [Working Code] <fx:Script> <![CDATA[ import mx.events.FlexEvent;
I am using the DataGrid component in Flash, that is loaded with data via a external XML file. I have a column, A (Serial), which once loaded, I'd like for the information to be sorted Ascendingly, automatically.
Is it possible to set a tooltip just on the header of a spark datagrid. I do not want any tooltips on the data - just the header. I have played with mouse over and this sort of looks like it might work. This seems a bit of a hack to me though.
In my flex app I store the widths and visiblility of columns in an xml file. When the app loads it reads from the xml file and sets he columns values as applicable:
In a flex datagrid, by default clicking on column headers does sorting. I want it such that if a user clicks a column header the entire column is selected. I have the datagrid listening for the HEADER_RELEASE event so I know when the column header is clicked.
How can I have the column and header appear highlighted similar to how a row is highlighted when selected?
Context: I have a data grid where the following has been implemented. tabbing through each column in a single row and creating a new row when tabbing from the last column. The last column in my datagrid is now a checkbox. I set the 'editable' to false as shown below (since we don't want editable text to be shown when user clicks on/tabs to checkbox.
Problem: When I tab through the columns of a given row, I cannot tab to the checkbox column and therefore cannot use the space bar to toggle between checked/unchecked. The user is forced to use the mouse to toggle the check box. Question: How do I let user tab to the checkbox column, and press spacebar to toggle between checked and unchecked?
We have a Datagrid:[code]where practiceJoinRequestThicks is an ArrayCollection of PracticeJoinRequestThick object.The PracticeJoinRequestThick has an Practice Object.Practice has an arraycollection "PracticeContactAddresses" which is an arraycollection of PracticeContactAddress object and Practice ContactAddress object has Address object which has the field city:String.Now when I try to display the City, it does not work.
I have defined the datagrid as followsmx:DataGrid id="dg" width="100%" height="100%" >n the part i am trying to get the details from the database and setting the dataProvider for the DataGrid as follows.
var arrayContent:ArrayCollection = new ArrayCollection(); for(var i:int=0;i<assetClassDetails.length;i++) {
I am stuck in a problem working on Flex datagrid, in an AIR application. How can I access a specific row in datagrid in Flex. I am not talking about the selectedItem or any particular record of dataProvider of datagrid. What exactly I want to do is I am showing some files data (name, description etc.) on a datagrid, and the data of these files comes from an array which is the dataProvider of the datagrid. Now when these files are being uploaded one by one to the server (using a webservice), I want to show a ProgressBar on, say, "Progress" column in the datagrid. How can I access this column for a particular row in datagrid i.e. current file being uploaded.
Tried col.setStyle('percentWidth',20) //doesn't work col.setStyle('percentWidth',0.2)//doesn't work && col.percentWidth //doesnt compile Where col is one of the columns in a datagrid.
I created a component that is multiple datagrids side by side that share the same columns (each datagrid is the same as the one before but with different data).ProblemThe header text only shows up on the last datagrid. How can I get the text to show up on all the datagrid headers?Here is how I instantiate the component.