Flex datagrid custom itemRenderer - making column NOT EDITABLE
Hi all,
I am new to flex and having been trying to build custom editors and renderers for datagrid. I ran into this problem trying to fix another one (http://forums.adobe.com/post!reply.jspa?message=3569216)
The problem is :
I have a custom editor and a renderer for a text column. The whole grid is editable (i.e; editable=true). But clicking on the cell does not show me the editor. However, if I change the renderer to mx.controls.label, clicking on it takes me to my custom editor.
Can anyone please tell what I am doing wrong?? I am pasting the relevant code for more details.
DATAGRID : Replacing itemRenderer = "renderers.TextRenderer" with itemRenderer = "mx.controls.Label" makes the column editable
<mx:DataGrid id="dg" editable="true" rowHeight="100" width="861" x="10" y="10" height="498" dataProvider="{this.slideArray}">
<mx:columns>
<mx:DataGridColumn headerText="Text" width="100"
resizable="true" sortable="false"
itemRenderer = "renderers.TextRenderer"
itemEditor="editors.TextEditor"
dataField="text" editorDataField="myData"/>
</mx:columns>
</mx:DataGrid>
TEXT EDITOR
<?xml version="1.0" encoding="utf-8"?>
<s:MXDataGridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
focusEnabled="true"
initialize="initEditor()">
<mx:TextInput id="edit" width="{this.width}" height="{this.height}"/>
<fx:Script>
<![CDATA[
import domain.Slide; // contains just one property :::: public var text : String
override public function set data(value:Object):void{
super.data = value;
this.edit.text = (value as Slide).text;
public var myData : String; // editor data field
import mx.binding.utils.BindingUtils;
private function initEditor():void{
BindingUtils.bindProperty(this,"myData", this.edit, "text");
]]>
</fx:Script>
</s:MXDataGridItemRenderer>
TEXT RENDERER
<?xml version="1.0" encoding="utf-8"?>
<s:MXDataGridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
focusEnabled="true">
<s:Label id="txt" horizontalCenter="0" verticalCenter="0"/>
<fx:Script>
<![CDATA[
import domain.Slide;
override public function set data(value:Object):void{
super.data = text;
this.txt.text = (value as Slide).text;
]]>
</fx:Script>
</s:MXDataGridItemRenderer>
Tricks I have tried and failed :
1. added the following code to the renderer
override public function get data():Object{
return super.data;
2. remove/change focusEnabled
3. wrote the same renderer in Actionscript - making it extend MXDataGridItemRenderer. I had to add the label component txt using addElement. Clicking on this does show th editor but it doesnt show the label txt at all... i.e; I dont get any text displayed.
I am using Flex 4.0 sdk.
It worked!!!!!!! Thank you!! What you mentioned was indeed the problem!
Here is the custom item renderer's set data function
Before
Now
override public function set data(value : Object):void{
super.data = text;
this.txt.text = (value as Slide).text ; //txt is the Label control
override public function set data(value : Object):void{
super.data = value;
this.txt.text = (value as Slide).text ; //txt is the Label control
oh man, this is such a stupid mistake. I think I was confused with having three text properties - one inherited from MXDataGridItemRenderer, one in my txt Label control and one on my slide.
I had no idea that sending the value up to the super class was so important. None of the docs I read seemed to give much importance to this statement.
thanks so much and sorry for taking up so much of your time. I guess it is uncessary to post any more code.
Similar Messages
-
DataGrid: custom ItemRenderer changes Header renderer
If I assign custom ItemRenderer to a DataGrid, this also affects headers, i.e. headers start looking as the fields in a grid. Not only that, but it seems that render is much worse and it really looks bad. Is this how it's supposed to be, is there a workaround to keep the headers as they should be and just change the actual renderers in the grid?
Post a bit of your code.
Sincerely,
Michael
Sent from my iPhone
El 16/07/2009, a las 23:24, mraak <[email protected]> escribió:
>
If I assign custom ItemRenderer to a DataGrid, this also affects
headers, i.e. headers start looking as the fields in a grid. Not
only that, but it seems that render is much worse and it really
looks bad. Is this how it's supposed to be, is there a workaround to
keep the headers as they should be and just change the actual
renderers in the grid?
> -
GL Opening Balance Due Date Column not Editable
Hi Experts,
I am about to enter GL Opening balances for a new company I just created,I have created posting periods from January 2007 to date, I want to post an opening balance to 31 december 2007, I am able to enter the posting date but the due date (01.01.08 by default) is not editable,I want to change the due date to be the same as posting date(31.12.07) how can I achieve this ?
Thanks in anticiption of your prompt response.
RegardsHi Chiko,
Opening balance is for new period. Therefore, the due date should be in new period. If you can change it to last year, that should be called ending balance for 2007.
Thanks,
Gordon -
Flex datagrid custom itemEditor - not returning data
Hi,
I am new to flex and this is a basic "How to" question.
I want to write custom item editors and renderers for a datagrid column.
I am facing two problems here
1) override public function get data() : Object is not working. however, if the type of the column is just text then override public function get text():String is working. Specifying editorDataField in the datagrid column definition is working for some types ex:Strings, Numbers
2) Nothing is working for slightly more complex types like an Image. even editorDataField is not working. Somewhere between the user editing the data (in the case of an image, edit = browse, select & load an image) and grid asking for data at itemEditEnd, the entire data loaded by the user is disappearing and it is returning null or some default value I'd set it to in override public function set data().
I am aware that datagrid reuses both editors and renderers but I dono how the data user has set is getting lost while the focus is on the same cell
I have tried to use getter setter for this custom data field mentioned in editorDataField but when I do so, nothing works.. it fails even for string type
It should be a simple thing to do and I am sure I am making some silly mistake .. please help me out. It has driven me nuts since today morning..
any pointers would be really appreciated.Hi,
thanks for the info. This is the understanding that I had after reading livedocs about item renderers.
I have given the correct editorDataField and dataField. But it isnt working..I am not sure what you mean by For complex renderers, make sure the property is properly implemented on the outer component.
The weird part is specifying editorDataField works for String and not for an image. I am pasting some of code (highlighting relevant parts) below.. please have a look and tell me what I am missing.
Datagrid :
<mx:DataGrid id="dg" editable="true" rowHeight="100" width="861" x="10" y="10" height="498"
dataProvider="{this.slideArray}">
<mx:columns>
<mx:DataGridColumn headerText="Text" width="100"
resizable="true" sortable="false"
itemRenderer = "mx.controls.Label"
itemEditor="editors.TextEditor"
dataField="text" editorDataField="myData"/>
<mx:DataGridColumn headerText="Image" width="600" resizable="true" sortable="false"
itemRenderer="mx.controls.Image"
itemEditor="editors.ImageEditor"
dataField="image" editorDataField="myData"/>
</mx:columns>
</mx:DataGrid>
Text editor :
<?xml version="1.0" encoding="utf-8"?>
<s:MXDataGridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
focusEnabled="true"
initialize="initEditor()">
<mx:TextInput id="edit" width="{this.width}" height="{this.height}"/>
<fx:Script>
<![CDATA[
import domain.Slide; // has two properties : public var text : String and public var image : mx.controls.Image;
override public function set data(value:Object):void{
super.data = value;
this.edit.text = (value as Slide).text;
public var myData : String; // editor data field
import mx.binding.utils.BindingUtils;
private function initEditor():void{
BindingUtils.bindProperty(this,"myData", this.edit, "text");
]]>
</fx:Script>
</s:MXDataGridItemRenderer>
ImageEditor :
<?xml version="1.0" encoding="utf-8"?>
<s:MXDataGridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
width="100%" height="100%"
focusEnabled="true" contentBackgroundColor="#F1B4B4">
<mx:Image id="img" x="0" y="0" width="200" height="200" />
<s:Button label="Click to Add Image" id="addImageButton" click="addImageButton_clickHandler(event)"
x="0" y="{this.height - addImageButton.height}"/>
<fx:Script>
<![CDATA[
import domain.Slide;
public var myData : Image; //editor data field
override public function set data(value:Object):void{
super.data = value;
if( (value as Slide).image != null) this.img.source = (value as Slide).image.source;
protected function addImageButton_clickHandler(event:MouseEvent):void
// select image from file system
var imgFilter : FileFilter = new FileFilter("Images","*.jpg;*.png;*.gif");
var fileRef : FileReference = new FileReference();
fileRef.addEventListener(Event.SELECT, fileSelectHandler);
fileRef.addEventListener(Event.OPEN, fileOpenHandler);
fileRef.addEventListener(Event.CANCEL, fileCancelHandler);
fileRef.browse([imgFilter]);
function fileRefSelectListenerUp(e:Event):void{}
private function fileSelectHandler(event : Event):void{
var fileRef : FileReference = event.target as FileReference;
fileRef.addEventListener(Event.COMPLETE, fileLoadHandler);
fileRef.load();
private function fileLoadHandler(event : Event) : void{
var fileRef : FileReference = event.target as FileReference;
this.myData = new Image;
this.myData.name = fileRef.name;
this.myData.source = fileRef.data;
this.img.source = fileRef.data;
private function fileOpenHandler(event : Event):void{}
private function fileCancelHandler(event : Event):void{}
]]>
</fx:Script>
</s:MXDataGridItemRenderer> -
Datagrid: Custom Itemrenderer
Hello,
my Datagrid consists of a variable number of columns that are
handled by the same Itemrenderer. Now I have the problem that I
can't find out which column I belong to when I am in the override
set data function.
Any hints how i can back track to what column the "current"
Itemrenderer belongs or is processing at that moment?
Thanks and GzG
NerunI had the exact requirement. Multiple columns using the same
item renderer and needing to know what was clicked. Essentially I
solved it in three steps.
1. Override the datagid to add your own custom events;
package com.psc.eis.view
import mx.controls.DataGrid;
import mx.events.ListEvent;
[Event( name = "MyViewCurrentEvent", type =
"mx.events.ListEvent" ) ]
[Event( name = "MyEditCurrentEvent", type =
"mx.events.ListEvent" ) ]
[Event( name = "MyDeleteCurrentEvent", type =
"mx.events.ListEvent" ) ]
[Event( name = "MySearchEvent", type = "mx.events.ListEvent"
public class MyDataGrid extends DataGrid
public function MyDataGrid() { super()}
public static var
MY_VIEW_CURRENT_EVENT:String="MyViewCurrentEvent";
public static var
MY_EDIT_CURRENT_EVENT:String="MyEditCurrentEvent";
public static var
MY_DELETE_CURRENT_EVENT:String="MyDeleteCurrentEvent";
public static var MY_SEARCH_EVENT : String =
"MySearchEvent";
2. In your item renderer create a click handler that
dispatches the appropriate event
<?xml version="1.0" encoding="utf-8"?>
<mx:HBox xmlns:mx="
http://www.adobe.com/2006/mxml"
horizontalAlign="center">
<mx:Script>
<![CDATA[
private function clickHandler() : void
import mx.events.ListEvent;
var event:ListEvent = new ListEvent(
MyDataGrid.MY_EDIT_CURRENT_EVENT );
event.itemRenderer = this;
owner.dispatchEvent(event);
]]>
</mx:Script>
<mx:Image id="imageDelete" source="images/bluepencil.gif"
width="20" click="clickHandler()"/>
</mx:HBox>
3. In your mxml for the datagrid setup the event handler
<psc:MyDataGrid id="dataGridProjects" dataProvider="{. .
MyViewCurrentEvent="viewCurrentHandler(event)"
MyEditCurrentEvent="editCurrentHandler(event)"
MyDeleteCurrentEvent="deleteCurrentHandler(event)"
>
That's it. -
Hi
We recently did a migration to 10.2 from 9.2 and we had our custom item-descriptors mapped in merchandising view.
In 9.2, whenever we tried creating a new asset of this item descriptor we used to get the id field as editable. But after the upgrade this field is not coming as editable.
Please see the below item descriptor
<item-descriptor display-property="key" query-cache-size="100" display-name-resource="Message Key" item-cache-size="100" name="messageKey">
<table id-column-names="key" type="primary" name="msg_key">
<property readable="true" writable="true" queryable="true" column-name="key" display-name="Key" hidden="false" expert="false" name="key" data-type="string" cache-mode="inherit" required="true">
<attribute value="10" name="propertySortPriority"/> </property>
<property column-name="value" display-name="Value" name="value" data-type="big string">
<attribute value="20" name="propertySortPriority"/> </property>
</table>
</item-descriptor>
Here the key used to be coming as editable in 9.2 version when we tried creating a new asset, but it doesnt come editable and atg auto populates it with some id in 10.2 version
ThanksThanks Shaik
All i did was the following and it broke the UI and now I am not able to create a new item for that repository.
<add-item item-descriptor="attributeValue" id="AvMsgKeyEditId">
<set-property name="value"><![CDATA[true]]></set-property>
</add-item>
<add-item item-descriptor="itemMapping" id="AmaMsgKey">
<set-property name="name"><![CDATA[AssetManager]]></set-property>
<set-property name="description"><![CDATA[AssetManager Message Key itemMapping]]></set-property>
<set-property name="mode"><![CDATA[AmMmDef]]></set-property>
<set-property name="itemPath"><![CDATA[/atg/commerce/catalog/ProductCatalog]]></set-property>
<set-property name="itemName"><![CDATA[messageKey]]></set-property>
<set-property name="formHandler"><![CDATA[AmFhDef]]></set-property>
<set-property name="attributes"><![CDATA[showCreationId=AvMsgKeyEditId]]></set-property>
</add-item>
I think there is more to be done apart from attribute value and item mapping?
property mapping or something else maybe.
Any pointers would be helpful.
Thanks -
Task column not editable in Project Server 2013 (PWA)
Hello,
is that possible that Project's task column which are published on PWA cant be editable for any Project Manager, Team members?
We have a scenario where my management team wants that after creating project from MS Project Professional 2013 (where we have provided standard template for projects to chose from ) needs to published on PWA. After publishing it, no one can't modify
task name in Projects but can add task if required.
Is it possible??For the field:
Go to server settings, enterprise custom fields and lookup table,
Click on Create
Select task type, then formula,
Click on the field selector button and pickup the [task name] field under the text group,
Save.
For the view:
Go to the server settings, then manage views,
Select the view in question under "project" (for example tasks details)
In the field section, select your new field from the left side and add it to the right side,
Select the default task name field from the right side and remove it (it'll go to the left side),
Validate.
To validate:
Go to the project center and open your project,
Navigate to the schedule PDP and select your view tasks details)
Click on "edit" to open the project schedule,
Publish the project plan and check that your field is there and cannot be edited.
Hope this helps,
Guillaume Rouyre, MBA, MVP, P-Seller | -
Make custom ItemRenderer Bindable?
If I do not use my custom ItemRenderer then the tiles in my
TileList change when the dataProvider changes, however when I use
my custom ItemRenderer they do not change when the dataProvider
changes.
I am not sure how to fix this???
Here is the code for my ItemRenderer component.
THANKS!!quote:
Originally posted by:
Newsgroup User
"john isaacks" <[email protected]> wrote in
message
news:gigrvl$a6h$[email protected]..
> If I do not use my custom ItemRenderer then the tiles in
my TileList
> change
> when the dataProvider changes, however when I use my
custom ItemRenderer
> they
> do not change when the dataProvider changes.
>
> I am not sure how to fix this???
>
> Here is the code for my ItemRenderer component.
http://www.magnoliamultimedia.com/flex_examples/Amys_Flex_FAQ.pdf
Q2
Maybe you ought to read all of it this time, since you've
been sent to it
before on a different issue :-)
You might also find the example item renderer here helpful:
http://flexdiary.blogspot.com/2008/09/groupingcollection-example-featuring.html
Thanks, I read your whole FAQ, I didn't follow all the links
it referenced though. -
How To Update Custom ItemRenderer (Image) on DataGrid Edit
I have an DataGrid with 2 columns, column 1 called "Name" and column 2 called "Actions".
The "Name" column contains editable text and the "Actions" column uses a (inline) custom ItemRenderer which displays 2 icon images ( for Edit and Delete). All works fine. Clicking Edit or Delete calls the corrosponding outerDocument method.
The feature I am trying to add is as follows: when someone double-clicks on the text in the Name column to edit it, I would like the edit icon in the Actions column to ( grow/shrink, change color - or some such indication/reminder to click it ). Not seeing how to do this with the inline ItemRenderer, I created a custom item renderer class and, in that class, use mx:Resize to perform the "grow/shrink". I created a method called "pulse()" and, from within that renderer, all works well. ( for testing, I wired the icons click event to the pulse() method ). However, now I am not sure how to call that ItemRenderers "pulse()" method to perform the effect from the main DataGrid (when the user double-clicks on Name field to edit).
The tried using the DataGrid's "itemEditBegin", which fires correctly, but from that point I am not sure how to access the selected rows edit icon in the "Action" column. ( to call its pulse() ) method.
So any suggestions how I can achieve my end result? Being able to manipulate the edit icon in the "Actions" column, when the user double-clicks (edits) that row's "Name" column?
If I'm going about it all wrong, feel free to offer alternative solutions.
Any help would be appreciated.
Thanks,
~eHi,
Check the BAPI_MATERIAL_SAVEDATA ,in the BAPI is there a table parameter EXTENSIONIN ?
which you can use to pass the values for user defined fields to the BAPI..
Regards
Kiran Sure -
Custom ItemRenderer makes the column non editable
Hi Folks,
I have a DataGrid which s editable, I've created a custom ItemRenderer to deal with special format needed for Date variables, for that I extended the mx:Text class in order to get access to the listData.dataField variable.
The problem is that this makes the column non-editable, the other column in the table are editabe.
When I used a VBox container the column was editable however I didn't get access to the listData, which I need for the dataField variable.
Any help will be appreciated.
Thanks,
MR.
Here is the my DateItemRenderer code:
<?xml version="1.0" encoding="utf-8"?>
<mx:Text xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx">
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<fx:Script>
<![CDATA[
import aslib.common.Constants;
import aslib.common.Utils;
import aslib.connection.JSONConnector;
import mx.controls.dataGridClasses.DataGridListData;
import mx.controls.listClasses.ListData;
import mx.formatters.DateFormatter;
[Bindable]
private var _dispValue:String;
public function dateStr(val:Object):String {
var innerDt:Date;
if(!(val is Date))
innerDt = Utils.convertDateStr(val as String);
else
innerDt = val as Date;
if(innerDt){
var df:DateFormatter = new DateFormatter();
df.formatString = "DD/MM/YYYY";
var formatedDate:String = df.format(innerDt);
return formatedDate;
}else{
return "";
public override function set data(value:Object):void {
var date:Object = value[(listData as DataGridListData).dataField];
if(date){
_dispValue = dateStr(date);
]]>
</fx:Script>
<mx:text>{_dispValue}</mx:text>
</mx:Text>OK, found the issue, forgot to add 'super.data = value' in the set data method...
-
Flex spark dataGrid gridColumn itemrenderer binding bug
I hava a TextInput within mx DataGrid gridColumn itemrenderer and binding its text to {data.f1} ,
when I set DataGrid dataProvider column (0,0) to "value1" by actionsript code,
it will update "value1" to TextInput field.
But if I change to spark DataGrid, TextInput Text won't be changed.
Please see below two samples, when user click "set var" button, it set dataProvider column (0,0) to "value1",
sample1 is in mx comopent, it works fine and will update "value1" to TextInput Text.
sample2 is in spark component, it did not work.
anyone can help for spark component ?
many thanks.
*** sample1 (mx componet): ***
<?xml version="1.0" encoding="utf-8"?>
<mx:Application
xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
minWidth="955" minHeight="600"
layout="absolute">
<mx:Button x="235" y="52" label="set var" click="setVar()"/>
<mx:DataGrid id="grid_1" dataProvider="{ia_row}" x="25" y="52">
<mx:columns>
<mx:DataGridColumn dataField="f1" headerText="Column 1">
<mx:itemRenderer>
<fx:Component>
<mx:TextInput text="{data.f1}" width="95%"/>
</fx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn dataField="f2" headerText="Column 2"></mx:DataGridColumn>
</mx:columns>
</mx:DataGrid>
<fx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.events.FlexEvent;
[Bindable]
private var ia_row:ArrayCollection = new ArrayCollection([
{f1:"a1", f2:"b1"},
{f1:"a2", f2:"b2"}
private function setVar():void{
var t_row:Object = ia_row.getItemAt(0);
t_row.f1 = "value1";
ia_row.setItemAt(t_row, 0);
]]>
</fx:Script>
</mx:Application>
*** sample2 (spark componet): ***
<?xml version="1.0" encoding="utf-8"?>
<s:Application
xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
minWidth="955" minHeight="600"
>
<s:Button x="267" y="94" label="set var" click="setVar()"/>
<s:DataGrid id="grid_1" x="55" y="94" width="204" height="139" dataProvider="{ia_row}">
<s:columns>
<s:ArrayList>
<s:GridColumn dataField="f1" headerText="Column 1" width="120">
<s:itemRenderer>
<fx:Component>
<s:GridItemRenderer>
<s:TextInput text="{data.f1}" width="95%"/>
</s:GridItemRenderer>
</fx:Component>
</s:itemRenderer>
</s:GridColumn>
<s:GridColumn dataField="f2" headerText="Column 2"></s:GridColumn>
</s:ArrayList>
</s:columns>
</s:DataGrid>
<fx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.events.FlexEvent;
[Bindable]
private var ia_row:ArrayCollection = new ArrayCollection([
{f1:"a1", f2:"b1"},
{f1:"a2", f2:"b2"}
private function setVar():void{
var t_row:Object = ia_row.getItemAt(0);
t_row.f1 = "value1";
ia_row.setItemAt(t_row, 0);
]]>
</fx:Script>
</s:Application>sir, I think it does not send CHANGE event to dataGrid, so my suggestion is following:
private function setVar():void{
var t_row:Object = ia_row.getItemAt(0);
Alert.show(t_row.f1);
t_row.f1 = "value1";
ia_row.setItemAt(t_row, 0);
ia_row.refresh();//it is used to dispatch Event if dataprovider was changed. -
DataGrid ComboBox itemRenderer/editor not updating dataProvider properly
I have a DataGrid with one column using a ComboBox as the itemRenderer. The column is editable but if you trace the dataProvider, the changes lag behind by one. So uncheck two row's ComboBox and the dataProvider only shows one row's data updated.
Any ideas?Yep, its a CheckBox, too early in the morning.
Another component (DataGrid) will be filtered depending on what rows in the ADG have their CheckBox checked, so leaving the row may be too late.
Here is the code I have so far. In the itemEditEnd event handler I'm trying to set the field in the dataProvider manually, but it causes an infinite loop. preventDefault and stopImmediatePropagation don't help.
----- CheckBoxRenderer.mxml -----
<?xml version="1.0"?>
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
<![CDATA[
import mx.controls.CheckBox;
[Bindable] public var newSelected:Boolean;
]]>
</mx:Script>
<mx:CheckBox id="selectedChbx" selected="{data.FLAG}"/>
</mx:VBox>
----- mainapp.mxml -----
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
<![CDATA[
import mx.events.AdvancedDataGridEvent;
import mx.collections.ArrayCollection;
import mx.controls.CheckBox;
[Bindable] private var transactions:ArrayCollection = new ArrayCollection([
{orderID: "33725", theirOrderNumber: "10170", name: "Bob Smith", SKUs: "21", PICKS: "50", FLAG: "true"},
{orderID: "33729", theirOrderNumber: "10172", name: "Mary Wilson", SKUs: "3", PICKS: "6", FLAG: "true"},
{orderID: "33730", theirOrderNumber: "10176", name: "Fred Carson", SKUs: "1", PICKS: "2", FLAG: "true"},
{orderID: "33731", theirOrderNumber: "10177", name: "Morten Hills", SKUs: "5", PICKS: "16", FLAG: "true"},
{orderID: "33732", theirOrderNumber: "10178", name: "Bill Trundy", SKUs: "5", PICKS: "34", FLAG: "true"},
{orderID: "33734", theirOrderNumber: "10179", name: "Ocean Boat Supply", SKUs: "8", PICKS: "19", FLAG: "true"},
{orderID: "33736", theirOrderNumber: "10180", name: "Janet Aberdine", SKUs: "5", PICKS: "18", FLAG: "true"},
{orderID: "33737", theirOrderNumber: "10181", name: "Kim Restine", SKUs: "2", PICKS: "6", FLAG: "true"},
{orderID: "33738", theirOrderNumber: "10182", name: "Thomas Overby", SKUs: "5", PICKS: "12", FLAG: "true"}
public function handleGridChanged(evt:AdvancedDataGridEvent):void{
var newData:Boolean = CheckBoxRenderer(evt.currentTarget.itemEditorInstance).newSelected;
trace(evt.rowIndex);
var obj:Object = transactions.getItemAt(evt.rowIndex);
trace("BEFORE: " + obj.FLAG);
obj.FLAG = newData;
trace("AFTER: " + obj.FLAG);
transactions.setItemAt(obj, evt.rowIndex);
return;
evt.preventDefault();
evt.stopImmediatePropagation();
// for each(var item:Object in transactions){
//trace(item.FLAG);
]]>
</mx:Script>
<mx:Label fontSize="12" text="Bulk Print / Pull - Step 1"/>
<mx:HBox>
<mx:AdvancedDataGrid id="dgTransactions" dataProvider="{transactions}"
fontSize="12" editable="true" sortableColumns="true" height="500"
width="100%" itemEditEnd="handleGridChanged(event);">
<mx:columns>
<mx:AdvancedDataGridColumn dataField="orderID" headerText="WMSOID" width="100"
editable="false" textAlign="center"/>
<mx:AdvancedDataGridColumn dataField="theirOrderNumber" headerText="Order #"
textAlign="center" width="130" editable="false"/>
<mx:AdvancedDataGridColumn dataField="name" headerText="Customer"
width="125" textAlign="left" editable="false"/>
<mx:AdvancedDataGridColumn dataField="SKUs" headerText="SKU's"
width="75" textAlign="right" editable="false"/>
<mx:AdvancedDataGridColumn dataField="PICKS" headerText="Picks"
width="75" textAlign="right" editable="false"/>
<mx:AdvancedDataGridColumn dataField="FLAG" headerText="I" width="20" textAlign="center"
editable="true" rendererIsEditor="true" editorDataField="newSelected"
itemRenderer="CheckBoxRenderer"/>
</mx:columns>
</mx:AdvancedDataGrid>
<mx:DataGrid>
</mx:DataGrid>
</mx:HBox>
</mx:Application> -
A DataGrid with a Custom ItemRenderer
Hi all,
I have a DataGrid whose DataProvider is bound to a simple Array. I have a custom ItemRenderer that includes a button that can remove the item itself (I don't want two separate columns with a remove button in one of them). However, I don't understand the behaviour - clicking the button rearranges the data in the DataGrid and sometimes duplicate the entries! See the example attached. Any idea what's happening?
Martin.
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="onCreationComplete();" xmlns:local="*">
<mx:Script>
<![CDATA[
[Bindable]
public var _data : Array;
protected function onCreationComplete() : void {
_data = new Array();
_data.push(1, 2, 3, 4, 5);
]]>
</mx:Script>
<mx:VBox>
<mx:DataGrid dataProvider="{_data}">
<mx:columns>
<mx:DataGridColumn>
<mx:itemRenderer>
<mx:Component>
<mx:HBox implements="mx.controls.listClasses.IDropInListItemRenderer" creationComplete="dataLabel.text = String(data);">
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.controls.DataGrid;
import mx.controls.listClasses.BaseListData;
protected var _listData : BaseListData;
public function get listData() : BaseListData {
return _listData;
public function set listData(d : BaseListData) : void {
_listData = d;
protected function onClick(e : Event) : void {
var dp : ArrayCollection = (owner as DataGrid).dataProvider as ArrayCollection;
dp.removeItemAt(listData.rowIndex);
]]>
</mx:Script>
<mx:Label id="dataLabel" width="100%" />
<mx:Button click="onClick(event);"/>
</mx:HBox>
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
</mx:columns>
</mx:DataGrid>
</mx:VBox>
</mx:Application>creationComplete is rarely used in renderers. See the itemrenderer posts on my blog
Alex Harui
Flex SDK Developer
Adobe Systems Inc.
Blog: http://blogs.adobe.com/aharui -
DataGrid tooltip doesn't work for customized itemRenderer
I have a DataGrid with one column is a customized renderer,
when I try to use the dataTripFunc, it is not showing tooltips,
same function works for the other non-customized column, here is
the code:
<mx:DataGrid id="myDataGrid" dataProvider="{dataContent}"
width="100%" height="100%">
<mx:columns>
<mx:DataGridColumn dataField="name" headerText=""/>
<mx:DataGridColumn dataField="DateTime"
headerText="DateTime" showDataTips="true"
dataTipFunction="cellDataTipFunc"/>
<mx:DataGridColumn dataField="ImgBar" headerText="ImgBar"
itemRenderer="ImgBarCell" minWidth="40" showDataTips="true"
dataTipFunction="cellDataTipFunc"/>
</mx:columns>
</mx:DataGrid>
public function cellDataTipFunc(item:Object):String {
return "hello world";
Where the itemRenderer -- "ImgBarCell" is a customized HBox
component with a label and image on it.
The tooltip -- "helloworld" shows up for column "DateTime",
but not for customized ImgBar.
Does this one have anything to do with event generation for
customized itemRenderer? Or a bug in flex2?Hi
The TREX server (service) must started and be contactable by RFC - this can be checked by carrying out the actions listed above. (Refer OSS Note - 866547 Error when accessing TREX server for more details )
<b>Please have a look at the following SAP OSS Note, which will help -></b>
Note 851106 - Search in catalog from SRM leads to "Service not reachable"
<u>Other related OSS Notes</u>
Note 973594 Cross Catalog Search - Configuration
Note 894717 Items from Cross Catalogs Result does not appears in step 2
Note 803731 Cross-category search returns no result
Note 847137 OCI, cross-catalog search: detail display
Note 996885 Cross Catalog Search - Timeout while accessing MDM Catalog
1023487 cross-catalog-serach in portal opens up a duplicate window
1020025 Item detail display in Cross Catalog Search
1027352 Item detail display in Cross Catalog Search
Note 866547 - Error when accessing TREX server
Note 988427 - Update to TREX 6.1 Rev 27
Note 994623 - Hierarchy Buffer and BIA
Note 1030056 - Improvement in the Search within Results feature of CSE
Note 798988 CCM/CSE: Sorting sometimes returns no results
Note 778688 TREX_INDEX_MANAGER unit test update_view(): incorrect search
Note 808754 Display sequence of the characteristics is not changeable
Note 794325 - Error in OCI transfer in the BAdI /CCM/OCI_SCALEPRI
Note 745235 Search ability changes to cross-catalog characteristics
Note 724097 - Search of the comp. in case of structured characteristics
Note 743643 Search ability change in cross-catalog characteristics
Note 847551 Displaying date, time, and timestamp in the CSE
Note 750756 Program for the deletion/clean up of TREX indexes
Do update me as well.
Regards
- Atul -
How to disaply multiple column of a table in a single flex datagrid column
Hi,
I have a table in my database which has say 3 column (Firstname,LastName,Location). I wanted to display these 3 different values in a single column in flex datagrid.
Could you please help me out in this
Thanks,
PratikGenerally, in such scenarios each column is made corresponding to the column in database only and not single column.
However, we can setStyle of a datagrid to make it appear as if all three columns have been populated in single.
set verticalGridLines="false" for dataGrid. Further cosmetic changes can be made to realise the required look.
In some cases, labelFunction of a datagridColumn also suffices the need.
Tanu
Maybe you are looking for
-
Unable to deploy EJB 3.0 on JBoss 4.0.4GA - no home interface
I am stuck in that my EJB3.0 project (one entity bean, one session bean and one client test bean) builds OK but somehow Eclipse Europa is unable to deploy it to JBoss (4.0.4 GA and 5 Beta) -- something to do with JNDI error as it involves javax.namin
-
The + sign to add a new tab suddenly stopped working a while ago. I tried uninstalling and re-installing and it still doesn't work. What may have happened and how do I fix it?
-
Getting a Javascript Error On New Azure Portal
I am getting a JavaScript error on new portal when I right click on monitoring chart and select Edit Chart. Below is the screenshot for the same. Line: 951 The error says "Unable to get property 'timeGrain' of undefined or null reference
-
Can't apply transitions to timeline
This is new because it worked before. Now I drag the transition (like a dissolve) over to the clips and it bounces back; nothing happens. I try through Edit, the same thing. It simply will not allow me to put a transition in (and, yes, there's mor
-
Hello, We have 2 OC4J instances deployed in our application. Both the OC4J instances run on seperate machines on seperate Oracle J2EE (Standalone) installations. One of the OC4J instances has an EJB application which we try to call from the other OC4