Crear o escribir un archivo con Flex y pasar un datagrid a un Excel

Muy buenas de nuevo a vertutoriales.com  y muchas gracias por seguirnos.

Hoy escribiremos archivos con flex (no Air el cual implementa métodos para hacer esto directamente).

En realidad no lo haremos directamente con FLEX si no que seremos ayudados por un script en php, existen varios métodos para hacer esto, yo elegí este por comodidez sencillez y versatilidad.

Primero debemos montar las funciones en flex que nos permita comunicar con el php, no usare un httpservice como de costumbre pues para esta acción este método es más directo y claro. En el ejemplo mostraremos como pasar un datagrid de flex a una tabla en Excel

private function pasoaphp(dg:DataGrid):void {
var variables:URLVariables = new URLVariables();
variables.htmltable = DGaHTMLTable(dg);
var u:URLRequest = new URLRequest(excelphp);
u.data = variables;
u.method = URLRequestMethod.POST;
navigateToURL(u,”_self”);
}

public var excelphp:String = “http://localhost/exportexcel.php”;

private function flex2php():void {

var variables:URLVariables = new URLVariables();

variables.htmltable = DGaHTMLTable(dg);

var u:URLRequest = new URLRequest(excelphp);

u.data = variables;

u.method = URLRequestMethod.POST;

navigateToURL(u,”_self”);

}

exportexcel.php:

<?php

header(“Pragma: “);

header(‘Cache-control: ‘);

header(“Cache-Control: post-check=0, pre-check=0”, false);

header(“ETag etagforie7download”);

header(“Content-type: application/vnd.ms-excel”);

header( “Content-Disposition: attachment; filename=Tabla.xls”);

echo “<html>

<body>

“.stripslashes($_POST[“htmltable”]).”

</body>

</html>”;

?>

Por supuesto antes de enviar los datos a nuestro php tenemos que formatearlo para que se transforme correctamente a un excel:

public static function DGaHTMLTable(dg:DataGrid):String {

var font:String = dg.getStyle(‘fontFamily’);

var size:String = dg.getStyle(‘fontSize’);

var str:String = ”;

var colors:String = ”;

var style:String = ‘style=”font-family:’+font+’;font-size:’+size+’pt;”‘;

var hcolor:Array;

if(dg.getStyle(“headerColor”) != undefined) {

hcolor = [dg.getStyle(“headerColor”)];

} else {

hcolor = dg.getStyle(“headerColors”);

}

str+= ‘

‘;

for(var i:int = 0;i

colors = dg.getStyle(“themeColor”);

if(dg.columns[i].headerText != undefined) {

str+=”

“;

} else {

str+= ”

“;

}

}

str += ”

“;

colors = dg.getStyle(“alternatingRowColors”);

for(var j:int =0;j

str+=”

“;

for(var k:int=0; k &lt; dg.columns.length; k++) {

if(dg.dataProvider.getItemAt(j) != undefined &amp;&amp; dg.dataProvider.getItemAt(j) != null) {

if(dg.columns[k].labelFunction != undefined) {

str += ”

“;

} else {

str += ”

“;

}

}

}

str += ”

“;

}

str+=”

<table border=”0″>

<thead>

<tr style=”background-color:#’ +Number((hcolor[0])).toString(16)+'”>

<th>”+dg.columns[i].headerText+”</th>

<th>”+dg.columns[i].dataField+”</th>

</tr>

</thead>

<tbody>

<tr>

<td>”+dg.columns[k].labelFunction(dg.dataProvider.getItemAt(j),dg.columns[k].dataField)+”</td>

<td>”+dg.dataProvider.getItemAt(j)[dg.columns[k].dataField]+”</td>

</tr>

</tbody></table>

“;

return str;

}

Y también los elementos básicos en flex para realizar este proyecto un datagrid y una función de llamada

<mx:DataGrid  id=”dataGrid”>

<mx:dataProvider>

<mx:Object name=”Enrique” pass=”claveja” />

<mx:Object

name=”Jacinta” pass=”claveen”/>

</mx:dataProvider>

<mx:columns>

<mx:DataGridColumn dataField=”name”/>

<mx:DataGridColumn dataField=”pass”/>

</mx:columns>

</mx:DataGrid>

<mx:Button label=”Tabla en Excel” click=”pasoaphp(dataGrid)” x=”27″ y=”185″/>

Espero les sirva , existen otros métodos sobre todo con librerías ya formateadas yo personalmente para una transformación simple prefiero usar este.

Te puede interesar:

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *