Foros del Web » Programando para Internet » Javascript »

Establecer datos dinamicos entre php y javascript

 Estas en el tema de Establecer datos dinamicos entre php y javascript en el foro de Javascript en Foros del Web. Hola, tengo un pequeño problema, actualmente estoy modificando un archivo javascript para que me muestre datos estaticos desde un archivo php que tiene una conexion ...
  #1 (permalink)  
Antiguo 13/02/2013, 11:29
 
Fecha de Ingreso: febrero-2013
Ubicación: Lima
Mensajes: 301
Antigüedad: 11 años, 2 meses
Puntos: 5
Establecer datos dinamicos entre php y javascript
Hola, tengo un pequeño problema, actualmente estoy modificando un archivo javascript para que me muestre datos estaticos desde un archivo php que tiene una conexion hacia una tabla en sql, sin embargo no me esta mostrando los datos, pero si el contenedor donde van los archivos.
les comparto el codigo para que me apoyen.

Ext.onReady(function(){

Ext.QuickTips.init();
var xg = Ext.grid;

var encode = false;
var local =true;

var proxy=new Ext.data.HttpProxy({url:'data.php'});
var reader = new Ext.data.JsonReader({
},[
{name: 'projectId', type: 'int'},
{name: 'project', type: 'string'},
{name: 'taskId', type: 'int'},
{name: 'description', type: 'string'},
{name: 'estimate', type: 'float'},
{name: 'rate', type: 'float'},
{name: 'cost', type: 'float'},
{name: 'due', type: 'date', dateFormat:'m/d/Y'},
{name: 'x', type: 'date', dateFormat:'m/d/Y'}
]
)
var store=new Ext.data.Store({
proxy:proxy,
reader:reader

});
store.load();

// definir una función de resumen personalizado
Ext.ux.grid.GroupSummary.Calculations['totalCost'] = function(v,

record, field){
return v + (record.data.estimate * record.data.rate);
};

// utilizar extensión personalizada para Resumen del grupo
var summary = new Ext.ux.grid.GroupSummary();

//create the grid
var grid = new xg.EditorGridPanel({
ds: new Ext.data.GroupingStore({
store: store,
// use local data
//data: app.grid.dummyData,
//sortInfo: {field: 'due', direction: 'ASC'},
//groupField: 'project'
}),
columns: [
{
id: 'description',
header: 'Tareas',
width: 80,
sortable: true,
dataIndex: 'description',
summaryType: 'count',
hideable: false,
summaryRenderer: function(v, params, data){
return ((v === 0 || v > 1) ? '(' + v +' Tareas)' : '(1

Tarea)');
},
editor: new Ext.form.TextField({
allowBlank: false
})
},{
header: 'Proyecto',
width: 20,
sortable: true,
dataIndex: 'project'
},{
header: 'Fecha de Vencimiento',
width: 25,
sortable: true,
dataIndex: 'due',
summaryType: 'max',
renderer: Ext.util.Format.dateRenderer('m/d/Y'),
editor: new Ext.form.DateField({
format: 'm/d/Y'
})
},{
header: 'Fecha de Produccion',
width: 25,
sortable: true,
dataIndex: 'x',
summaryType: 'max',
renderer: Ext.util.Format.dateRenderer('m/d/Y'),
editor: new Ext.form.DateField({
format: 'm/d/Y'
})
},{
header: 'Tiempo Estimado',
width: 20,
sortable: true,
dataIndex: 'estimate',
summaryType: 'sum',
renderer : function(v){
return v +' hours';
},
editor: new Ext.form.NumberField({
allowBlank: false,
allowNegative: false,
style: 'text-align:left'
})
},{
header: 'Precio',
width: 20,
sortable: true,
renderer: Ext.util.Format.usMoney,
dataIndex: 'rate',
summaryType: 'average',
editor: new Ext.form.NumberField({
allowBlank: false,
allowNegative: false,
style: 'text-align:left'
})
},{
id: 'cost',
header: 'Total',
width: 20,
sortable: false,
groupable: false,
renderer: function(v, params, record){
return Ext.util.Format.usMoney(record.data.estimate *

record.data.rate);
},
dataIndex: 'cost',
summaryType: 'totalCost',
summaryRenderer: Ext.util.Format.usMoney
}
],

view: new Ext.grid.GroupingView({
forceFit: true,
showGroupName: false,
enableNoGroups: false,
enableGroupingMenu: false,
hideGroupedColumn: true
}),

plugins: summary,

tbar : [{
text: 'Alternar',
tooltip: 'Alterna la visibilidad de la tabla de resumen',
handler: function(){summary.toggleSummaries();}
}],

frame: true,
width: 800,
height: 450,
clicksToEdit: 1,
collapsible: true,
animCollapse: false,
trackMouseOver: false,
//enableColumnMove: false,
title: 'MCI',
iconCls: 'icon-grid',
renderTo: document.body
});

});

// crear espacio para la aplicación
Ext.ns('app.grid');
// almacenar datos de prueba en el espacio de aplicación
app.grid.dummyData = [
{projectId: 100, project: 'Field Anchoring', taskId: 112, description:

'Integrate 2.0 Forms with 2.0 Layouts', estimate: 6, rate: 150,

due:'06/24/2007'},
{projectId: 100, project: 'Field Anchoring', taskId: 113, description:

'Implement AnchorLayout', estimate: 4, rate: 150, due:'06/25/2007'},
{projectId: 100, project: 'Field Anchoring', taskId: 114, description:

'Add support for multiple types of anchors', estimate: 4, rate: 150,

due:'06/27/2007'},
{projectId: 100, project: 'Field Anchoring', taskId: 115, description:

'Testing and debugging', estimate: 8, rate: 0, due:'06/29/2007'},
{projectId: 101, project: 'Single-level Grouping', taskId: 101,

description: 'Add required rendering "hooks" to GridView', estimate: 6,

rate: 100, due:'07/01/2007'},
{projectId: 101, project: 'Single-level Grouping', taskId: 102,

description: 'Extend GridView and override rendering functions', estimate:

6, rate: 100, due:'07/03/2007'},
{projectId: 101, project: 'Single-level Grouping', taskId: 103,

description: 'Extend Store with grouping functionality', estimate: 4, rate:

100, due:'07/04/2007'},
{projectId: 101, project: 'Single-level Grouping', taskId: 121,

description: 'Default CSS Styling', estimate: 2, rate: 100,

due:'07/05/2007'},
{projectId: 101, project: 'Single-level Grouping', taskId: 104,

description: 'Testing and debugging', estimate: 6, rate: 100,

ue:'07/06/2007'},
{projectId: 102, project: 'Summary Rows', taskId: 105, description:

'Ext Grid plugin integration', estimate: 4, rate: 125, due:'07/01/2007'},
{projectId: 102, project: 'Summary Rows', taskId: 106, description:

'Summary creation during rendering phase', estimate: 4, rate: 125,

due:'07/02/2007'},
{projectId: 102, project: 'Summary Rows', taskId: 107, description:

'Dynamic summary updates in editor grids', estimate: 6, rate: 125,

due:'07/05/2007'},
{projectId: 102, project: 'Summary Rows', taskId: 108, description:

'Remote summary integration', estimate: 4, rate: 125, due:'07/05/2007'},
{projectId: 102, project: 'Summary Rows', taskId: 109, description:

'Summary renderers and calculators', estimate: 4, rate: 125,

due:'07/06/2007'},
{projectId: 102, project: 'Summary Rows', taskId: 110, description:

'Integrate summaries with GroupingView', estimate: 10, rate: 125,

due:'07/11/2007'},
{projectId: 102, project: 'Summary Rows', taskId: 111, description:

'Testing and debugging', estimate: 8, rate: 125, due:'07/15/2007'}
];

gracias....!!!
  #2 (permalink)  
Antiguo 13/02/2013, 12:55
Avatar de hackjose  
Fecha de Ingreso: abril-2010
Ubicación: Edo Mexico
Mensajes: 1.178
Antigüedad: 14 años
Puntos: 131
Respuesta: Establecer datos dinamicos entre php y javascript
Te recomiendo que uses el resaltador de codigo
Saludos
  #3 (permalink)  
Antiguo 14/02/2013, 08:16
 
Fecha de Ingreso: febrero-2013
Ubicación: Lima
Mensajes: 301
Antigüedad: 11 años, 2 meses
Puntos: 5
Respuesta: Establecer datos dinamicos entre php y javascript
hola, gracias por responder sin embargo, no te entendi muy bien cuando me dices que use el resaltador de codigo, lo que sucede es que soy nuevo en el foro y con esto de javascript.
agradeceria puedas ser un poco mas especifico.
gracias
  #4 (permalink)  
Antiguo 14/02/2013, 11:05
Avatar de hackjose  
Fecha de Ingreso: abril-2010
Ubicación: Edo Mexico
Mensajes: 1.178
Antigüedad: 14 años
Puntos: 131
Respuesta: Establecer datos dinamicos entre php y javascript
Cuando publicas un nuevo tema tienes un textarea que tiene una barra de herramientas, bueno en la barra de herramientas hay un select que dice Highlight, tienes varias opciones si vas a usar PHP eliges php y te inserta en el textarea un codigo, en medio de ese codigo pones tu codigo para que sea mas facil de leer y por lo tanto alguien te pueda ayudar

Saludos
  #5 (permalink)  
Antiguo 14/02/2013, 11:49
 
Fecha de Ingreso: febrero-2013
Ubicación: Lima
Mensajes: 301
Antigüedad: 11 años, 2 meses
Puntos: 5
Respuesta: Establecer datos dinamicos entre php y javascript
ok gracias, ya entendi, les comparto el codigo para que puedan ayudarme.

Código Javascript: 
Ver original
  1. /*!
  2.  * Ext JS Library 3.4.0
  3.  * Copyright(c) 2006-2011 Sencha Inc.
  4.  * [email protected]
  5.  * http://www.sencha.com/license
  6.  */
  7. Ext.onReady(function(){
  8.  
  9.     Ext.QuickTips.init();
  10.  
  11.     var xg = Ext.grid;
  12.  
  13.     var reader = new Ext.data.JsonReader({
  14.         idProperty: 'taskId',
  15.         fields: [
  16.             {name: 'projectId', type: 'int'},
  17.             {name: 'project', type: 'string'},
  18.             {name: 'taskId', type: 'int'},
  19.             {name: 'description', type: 'string'},
  20.             {name: 'estimate', type: 'float'},
  21.             {name: 'rate', type: 'float'},
  22.             {name: 'cost', type: 'float'},
  23.             {name: 'due', type: 'date', dateFormat:'m/d/Y'}
  24.         ]
  25.  
  26.     });
  27.  
  28.     // define a custom summary function
  29.     Ext.ux.grid.GroupSummary.Calculations['totalCost'] = function(v, record, field){
  30.         return v + (record.data.estimate * record.data.rate);
  31.     };
  32.  
  33.     // utilize custom extension for Group Summary
  34.     var summary = new Ext.ux.grid.GroupSummary();
  35.  
  36.     var grid = new xg.EditorGridPanel({
  37.         ds: new Ext.data.GroupingStore({
  38.             reader: reader,
  39.             // use local data
  40.             data: app.grid.dummyData,
  41.             sortInfo: {field: 'due', direction: 'ASC'},
  42.             groupField: 'project'
  43.         }),
  44.         columns: [
  45.             {
  46.                 id: 'description',
  47.                 header: 'Task',
  48.                 width: 80,
  49.                 sortable: true,
  50.                 dataIndex: 'description',
  51.                 summaryType: 'count',
  52.                 hideable: false,
  53.                 summaryRenderer: function(v, params, data){
  54.                     return ((v === 0 || v > 1) ? '(' + v +' Tasks)' : '(1 Task)');
  55.                 },
  56.                 editor: new Ext.form.TextField({
  57.                    allowBlank: false
  58.                 })
  59.             },{
  60.                 header: 'Project',
  61.                 width: 20,
  62.                 sortable: true,
  63.                 dataIndex: 'project'
  64.             },{
  65.                 header: 'Due Date',
  66.                 width: 25,
  67.                 sortable: true,
  68.                 dataIndex: 'due',
  69.                 summaryType: 'max',
  70.                 renderer: Ext.util.Format.dateRenderer('m/d/Y'),
  71.                 editor: new Ext.form.DateField({
  72.                     format: 'm/d/Y'
  73.                 })
  74.             },{
  75.                 header: 'Estimate',
  76.                 width: 20,
  77.                 sortable: true,
  78.                 dataIndex: 'estimate',
  79.                 summaryType: 'sum',
  80.                 renderer : function(v){
  81.                     return v +' hours';
  82.                 },
  83.                 editor: new Ext.form.NumberField({
  84.                    allowBlank: false,
  85.                    allowNegative: false,
  86.                    style: 'text-align:left'
  87.                 })
  88.             },{
  89.                 header: 'Rate',
  90.                 width: 20,
  91.                 sortable: true,
  92.                 renderer: Ext.util.Format.usMoney,
  93.                 dataIndex: 'rate',
  94.                 summaryType: 'average',
  95.                 editor: new Ext.form.NumberField({
  96.                     allowBlank: false,
  97.                     allowNegative: false,
  98.                     style: 'text-align:left'
  99.                 })
  100.             },{
  101.                 id: 'cost',
  102.                 header: 'Cost',
  103.                 width: 20,
  104.                 sortable: false,
  105.                 groupable: false,
  106.                 renderer: function(v, params, record){
  107.                     return Ext.util.Format.usMoney(record.data.estimate * record.data.rate);
  108.                 },
  109.                 dataIndex: 'cost',
  110.                 summaryType: 'totalCost',
  111.                 summaryRenderer: Ext.util.Format.usMoney
  112.             }
  113.         ],
  114.  
  115.         view: new Ext.grid.GroupingView({
  116.             forceFit: true,
  117.             showGroupName: false,
  118.             enableNoGroups: false,
  119.             enableGroupingMenu: false,
  120.             hideGroupedColumn: true
  121.         }),
  122.  
  123.         plugins: summary,
  124.  
  125.         tbar : [{
  126.             text: 'Toggle',
  127.             tooltip: 'Toggle the visibility of summary row',
  128.             handler: function(){summary.toggleSummaries();}
  129.         }],
  130.  
  131.         frame: true,
  132.         width: 800,
  133.         height: 450,
  134.         clicksToEdit: 1,
  135.         collapsible: true,
  136.         animCollapse: false,
  137.         trackMouseOver: false,
  138.         //enableColumnMove: false,
  139.         title: 'Sponsored Projects',
  140.         iconCls: 'icon-grid',
  141.         renderTo: document.body
  142.     });
  143.  
  144. });
  145.  
  146. // set up namespace for application
  147. Ext.ns('app.grid');
  148. // store dummy data in the app namespace
  149. app.grid.dummyData = [
  150.     {projectId: 100, project: 'Ext Forms: Field Anchoring', taskId: 112, description: 'Integrate 2.0 Forms with 2.0 Layouts', estimate: 6, rate: 150, due:'06/24/2007'},
  151.     {projectId: 100, project: 'Ext Forms: Field Anchoring', taskId: 113, description: 'Implement AnchorLayout', estimate: 4, rate: 150, due:'06/25/2007'},
  152.     {projectId: 100, project: 'Ext Forms: Field Anchoring', taskId: 114, description: 'Add support for multiple types of anchors', estimate: 4, rate: 150, due:'06/27/2007'},
  153.     {projectId: 100, project: 'Ext Forms: Field Anchoring', taskId: 115, description: 'Testing and debugging', estimate: 8, rate: 0, due:'06/29/2007'},
  154.     {projectId: 101, project: 'Ext Grid: Single-level Grouping', taskId: 101, description: 'Add required rendering "hooks" to GridView', estimate: 6, rate: 100, due:'07/01/2007'},
  155.     {projectId: 101, project: 'Ext Grid: Single-level Grouping', taskId: 102, description: 'Extend GridView and override rendering functions', estimate: 6, rate: 100, due:'07/03/2007'},
  156.     {projectId: 101, project: 'Ext Grid: Single-level Grouping', taskId: 103, description: 'Extend Store with grouping functionality', estimate: 4, rate: 100, due:'07/04/2007'},
  157.     {projectId: 101, project: 'Ext Grid: Single-level Grouping', taskId: 121, description: 'Default CSS Styling', estimate: 2, rate: 100, due:'07/05/2007'},
  158.     {projectId: 101, project: 'Ext Grid: Single-level Grouping', taskId: 104, description: 'Testing and debugging', estimate: 6, rate: 100, due:'07/06/2007'},
  159.     {projectId: 102, project: 'Ext Grid: Summary Rows', taskId: 105, description: 'Ext Grid plugin integration', estimate: 4, rate: 125, due:'07/01/2007'},
  160.     {projectId: 102, project: 'Ext Grid: Summary Rows', taskId: 106, description: 'Summary creation during rendering phase', estimate: 4, rate: 125, due:'07/02/2007'},
  161.     {projectId: 102, project: 'Ext Grid: Summary Rows', taskId: 107, description: 'Dynamic summary updates in editor grids', estimate: 6, rate: 125, due:'07/05/2007'},
  162.     {projectId: 102, project: 'Ext Grid: Summary Rows', taskId: 108, description: 'Remote summary integration', estimate: 4, rate: 125, due:'07/05/2007'},
  163.     {projectId: 102, project: 'Ext Grid: Summary Rows', taskId: 109, description: 'Summary renderers and calculators', estimate: 4, rate: 125, due:'07/06/2007'},
  164.     {projectId: 102, project: 'Ext Grid: Summary Rows', taskId: 110, description: 'Integrate summaries with GroupingView', estimate: 10, rate: 125, due:'07/11/2007'},
  165.     {projectId: 102, project: 'Ext Grid: Summary Rows', taskId: 111, description: 'Testing and debugging', estimate: 8, rate: 125, due:'07/15/2007'}
  166. ];

Etiquetas: dinamicos, establecer, js, php
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta


« Tema Anterior | Próximo Tema »


La zona horaria es GMT -6. Ahora son las 21:43.