PDA

View Full Version : Exjts + php + mysql



umutemre
1 Oct 2012, 12:25 PM
hi guys, i have a question about extjs.
i dont have any experience about extjs. I need to know how to make integration php to extjs.
Actually i want to make a software like, insert, update, delete record.

My client want a software for his customers.

He want to manage his customers (add,remove,edit)
he want to print invoices.

its all. its actually very very basic system by php. I can write it by codeigniter or salt php. But i want to make it by EXTJS.

can somone help me pls ?

Thanks

scottmartin
1 Oct 2012, 8:33 PM
Here are a few CRUD examples:
http://www.sencha.com/forum/showthread.php?229457

Scott.

umutemre
2 Oct 2012, 5:18 AM
thank you soo much. i'll check over !

umutemre
2 Oct 2012, 6:51 AM
hi again, when i design something by Sencha Architect. Its giving me the codes like that ;

App.js


/* * File: app.js
*
* This file was generated by Sencha Architect version 2.1.0.
* http://www.sencha.com/products/architect/
*
* This file requires use of the Ext JS 4.1.x library, under independent license.
* License of Sencha Architect does not include license for Ext JS 4.1.x. For more
* details see http://www.sencha.com/license or contact [email protected]
*
* This file will be auto-generated each and everytime you save your project.
*
* Do NOT hand edit this file.
*/


Ext.Loader.setConfig({
enabled: true
});


Ext.application({
views: [
'container'
],
autoCreateViewport: true,
name: 'MyApp'
});




container


/* * File: app/view/container.js
*
* This file was generated by Sencha Architect version 2.1.0.
* http://www.sencha.com/products/architect/
*
* This file requires use of the Ext JS 4.1.x library, under independent license.
* License of Sencha Architect does not include license for Ext JS 4.1.x. For more
* details see http://www.sencha.com/license or contact [email protected]
*
* This file will be auto-generated each and everytime you save your project.
*
* Do NOT hand edit this file.
*/


Ext.define('MyApp.view.container', {
extend: 'Ext.container.Viewport',


disabled: true,
layout: {
type: 'absolute'
},


initComponent: function() {
var me = this;


Ext.applyIf(me, {
items: [
{
xtype: 'toolbar',
height: 100,
enableOverflow: false,
items: [
{
xtype: 'label',
height: 35,
style: 'font-size:28px;\r\ncolor:#00000;\r\nfont-weight:bold;\r\nmargin:10px 35px;',
width: 244,
text: 'Lastikci v1.0'
}
]
},
{
xtype: 'menu',
x: 0,
y: 100,
floating: false,
height: 180,
hidden: false,
width: 137,
closable: false,
collapseDirection: 'left',
collapseFirst: false,
collapsed: false,
collapsible: true,
items: [
{
xtype: 'menuitem',
text: 'Anasayfa'
},
{
xtype: 'menuitem',
width: 1274,
text: 'Mü?teriler'
},
{
xtype: 'menuitem',
text: 'Ayarlar'
},
{
xtype: 'menuitem',
text: 'Logout'
}
]
},
{
xtype: 'gridpanel',
x: 110,
y: 100,
floating: false,
style: 'margin-left:30px;\r\nposition:absloute;\r\ntop:0px;',
bodyPadding: '',
header: true,
hideCollapseTool: false,
title: 'Mü?teriler',
columns: [
{
xtype: 'gridcolumn',
dataIndex: 'string',
text: 'String'
},
{
xtype: 'numbercolumn',
dataIndex: 'number',
text: 'Number'
},
{
xtype: 'datecolumn',
dataIndex: 'date',
text: 'Date'
},
{
xtype: 'booleancolumn',
dataIndex: 'bool',
text: 'Boolean'
}
],
viewConfig: {


}
},
{
xtype: 'toolbar',
x: -11,
y: 880,
border: '',
disabled: false,
draggable: false,
floating: false,
height: 110,
padding: '',
layout: {
align: 'stretchmax',
type: 'hbox'
},
items: [
{
xtype: 'label',
height: 35,
style: 'font-size:14px;\r\ncolor:#00000;\r\nmargin:50px 35px;',
width: 244,
text: 'Powered by : Ducentia Media Group'
}
]
}
]
});


me.callParent(arguments);
}


});

but the examples are very different.

here is the grid example codes :


Ext.onReady(function(){ Ext.define('model', {
extend: 'Ext.data.Model',
idProperty: 'abbr',
fields: [
{ name: 'abbr' },
{ name: 'name' },
{ name: 'slogan' }
],
proxy: {
type: 'ajax',
actionMethods: 'POST',
url: 'server.php',
reader: {
type: 'json',
root: 'data',
totalProperty: 'total'
}
}
});


store = new Ext.data.Store({
autoLoad: true, // also tested false using button to load
type: 'json',
model: 'model',
pageSize: 10,
remoteSort: true,
sorters: [
{
property : 'abbr',
direction: 'ASC'
}
]
});


var grid = Ext.create('Ext.grid.Panel', {
store: store,
columns: [
{
text : 'State',
width : 75,
sortable : true,
dataIndex: 'abbr'
},
{
text : 'Name',
width : 175,
sortable : true,
dataIndex: 'name'
},
{
text : 'Slogan',
flex : 1,
sortable : true,
dataIndex: 'slogan'
}
],
height: 350,
width: 600,
title: 'JSON Grid',
renderTo: Ext.getBody(),
viewConfig: {
stripeRows: true
},
bbar: Ext.create('Ext.PagingToolbar', {
store: store,
displayInfo: true,
displayMsg: 'Displaying {0} - {1} of {2}',
emptyMsg: 'No records to display'
})


});


var button = new Ext.Button({
text: 'load store',
width: 150,
renderTo: Ext.getBody(),
handler: function(){
store.load();
}
});


});




i dont know how to sync my architect's codes to sql like example. because its different styles.

if you help me about that i'll be very happy.

Thank you !

scottmartin
3 Oct 2012, 7:16 AM
You would need to make adjustments in your model/store to simply call the server code.

If you populate your store, the rest is transparent.

Scott.

umutemre
3 Oct 2012, 7:37 AM
is there any sample about that ?