Saturday, November 19, 2011

itemEditEnd event mx Datagrid

Some salient points that I came across when working with itemEditEnd event in the mx:DataGrid. Thought I'd share.

  1. In case of editable datagrids, we can do some updation, if required before the completion of the edit by listening to the itemEditEnd event in the DataGrid.
  2. mx:DataGrid also listens to the same event and does some processing before destroying the itemEditor instance for the row.
  3. Flex adds the event listener with a priority of -50 in the DataGrid. The default priority when we add the event listener is 0. Hence, our code will be executed first always.
  4. To override this, we can set the event listener priority less than -50. Doing so will make our code to be executed after the Flex inbuilt code.
  5. We can also add multiple event listeners for the same event with varying priorities, to enable code synchronization.
  6. itemEditEvent does not store the old value and the new value, so we need to pick that ourselves to do some processing on them.
  7. It is also advisable to use the data from the itemRenderer as the old value and that from the itemEditor instance as the new value. Using this from values stored outside may have consequences, we might not like.
So, there it is. Hope this helps someone.


Thursday, November 17, 2011

Setting Excel Column Width with AS3XLS

In my previous posts we talked about exporting to excel and formatting using AS3XLS. Here we go furthur and add a feature into AS3XLS. We'll extend it to support custom column width. Let's see how we can achieve that. Onward ho!!!

Since AS3XLS does not give the capability of adding custom column width, we'll need to extend the saveToByteArray method of the AS3XLS. What I did was to create a new function in my code and passed the Sheet and an array of the custom column widths that I collected from the user. I have placed the code below. Hope it helps.


private function saveToByteArray(s:Sheet, columnWidths:Array):ByteArray 
{
        ....... same code as in the AS3XLS saveToByteArray()
        // Custom code starts
for (var i:uint = 0; i < columnWidths.length; i++) 
{
var colwidth:Record = new Record(Type.COLINFO);
colwidth.data.writeShort(i); // start index 
colwidth.data.writeShort(i); // end index
colwidth.data.writeShort(columnWidths[i] * 256);
br.writeTag(colwidth);
}

for(var r:uint = 0; r < s.rows; r++) 
{
for(var c:uint = 0; c < s.cols; c++) 
{
var value:* = s.getCell(r, c).value;
var cell:Record = new Record(1);
cell.data.writeShort(r);
cell.data.writeShort(c);

// Check for value types and add to the cell bytes as in AS3XLS and finally write it in the    BiffRecord
}
}
// Custom code ends
// Finally, the closing EOF record
var eof:Record = new Record(Type.EOF);
br.writeTag(eof);

br.stream.position = 0;
return br.stream;
}

Tuesday, November 15, 2011

Passing data between datagrid itemRenderers


Recently I had to build a component where I had to communicate between item renderers of 2 columns in a datagrid to keep them updated. What made the task more worthwhile was that the item renderers were combo boxes, the data providers for which came from an external source and not the data provider for the datagrid. So, here's how I went on about it. 


1. The datagrid dataprovider was set and the dataField for each of the column item renderers were added.
2. In the first item renderer, set the dataprovider for the combobox and add an event listener for the change event. In the event listener formulate a new event that  sends the itemIndex of the renderer and the selected data.
3. On the creation complete of the second itemrenderer add the event listener for the above event on the parentDocument.
4. In the handler function, if the itemIndex matches then based on the selected data, change the display.


And lo and behold!! We are all set.