PDA

View Full Version : Populate a Form, using MVC pattern



Nopkev
1 Jul 2013, 4:27 AM
Hi Guys,
I'm a new EXTJS user.

I try to populate my Form, but i dont get it.
I use a Store who return a json string and with this string i try to populate the form.

Store:


Ext.define('FM.store.current_message_details', {
extend: 'Ext.data.Store',
model: 'FM.model.current_message_detail',
autoLoad: true,
proxy: {
type: 'ajax',
url: 'data/current_message_details.php',
reader: {
type: 'json'

}
}

});


view:


Ext.define('FM.view.message.current_message_details', {
extend: 'Ext.form.Panel',
alias: 'widget.current_message_details',
store: 'current_message_details',
title: 'Detallierte Ansicht',
id:'YourFormID',
layout: 'column',
border: true, //Soll ein rand vorhanden sein?
frame: true, //Soll ein Rahmen vorhanden sein?
labelWidth: 80, //Breite der Beschriftung für textfelder
margin: '0 0 0 355',
initComponent: function () {

this.items= [

{ xtype: 'textfield', fieldLabel: 'Job_nummer', dataIndex: 'job_nummer', margin:'0 0 0 1'},
{ xtype: 'textfield', fieldLabel: 'Fluggeber', dataIndex: 'fluggeber', margin:'0 0 0 1'},
{ xtype: 'textfield', fieldLabel: 'Kommentar', dataIndex: 'kommentar', margin:'0 0 0 1'},
{ xtype: 'textfield', fieldLabel: 'Typ', dataIndex: 'typ', margin:'0 0 0 1'},
{ xtype: 'textfield', fieldLabel: 'Format', dataIndex: 'format', margin:'0 0 0 1'},
{ xtype: 'textfield', fieldLabel: 'Parameter', dataIndex: 'parameter', margin:'0 0 0 1'},
{ xtype: 'textfield', fieldLabel: 'Export_date_start',dataIndex: 'export_date_start', margin:'0 0 0 1'},
{ xtype: 'textfield', fieldLabel: 'Export_date_end',dataIndex: 'export_date_end', margin:'0 0 1'},
{ xtype: 'textfield', fieldLabel: 'pid', dataIndex: 'pid', margin:'0 0 0 1'},
{ xtype: 'textfield', fieldLabel: 'Minute', dataIndex: 'minute', margin:'0 0 0 1'},
{ xtype: 'textfield', fieldLabel: 'Stunde', dataIndex: 'stunde', margin:'0 0 0 1'},
{ xtype: 'textfield', fieldLabel: 'Tag', dataIndex: 'tag', margin:'0 0 0 1'},
{ xtype: 'textfield', fieldLabel: 'Monat', dataIndex: 'monat', margin:'0 0 0 1'},
{ xtype: 'textfield', fieldLabel: 'Wochentag', dataIndex: 'wochentag', margin:'0 0 0 1'},
{ xtype: 'textfield', fieldLabel: 'next_run', dataIndex: 'next_run', margin:'0 0 0 1'}
];
this.callParent(arguments);
}
});


controller:



Ext.define('FM.controller.messages', {
extend: 'Ext.app.Controller',
stores: ['current_listeners','current_message_details','messages'],
models: ['current_listener','current_message_detail','message'],
views: [
'message.list_messages',
'message.current_message_details',
'listener.current_listeners'


],

init: function() {
this.control({
'list_message': {
itemdblclick: this.current_listeners

}
});
},
current_listeners: function(grid, records) {
var myStore=Ext.data.StoreManager.get('current_listeners');
myStore.load({
params:{
job_id: records.get('job_nummer')

}

});
var current_message_details=Ext.data.StoreManager.get('current_message_details');
var test= current_message_details.load({
url: 'data/current_message_details.php',
params:{
job_id: records.get('job_nummer')
}
});
}
});



json string
[{"id":1,"job_nummer":"14","fluggeber":"abc","kommentar":"Meldung abc","typ":"konti","format":"csv","parameter":"{\"data\":{\"total\":true}}","export_date_start":"NOW","export_date_end":"NOW + 365DAYS","pid":"0","minute":"0","stunde":"7,16","tag":"*","monat":"*","wochentag":"*","next_run":"2013-07-02 07:00:00"}]


So now is my Question how can i populate the form with my controller ? I try to populate the form with current_message_details.load... but it doesnt work.
I would rejoice over any help. :)

greeting

Nopkev

friend
1 Jul 2013, 5:29 AM
See the docs for Ext.form.action.Load (http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.form.action.Load). Your JSON response for a form load should look something like this:



{
success: true,
data: {
clientName: "Fred. Olsen Lines",
portOfLoading: "FXT",
portOfDischarge: "OSL"
}
}

Nopkev
1 Jul 2013, 5:57 AM
But i get my Data from a db. How can i creat this standard? If i use the Json string for a Grid it work, but not if i use it for the form.


{ success: true,
data: { clientName: "Fred. Olsen Lines", portOfLoading: "FXT", portOfDischarge: "OSL" } }





if(isset($_GET['job_id'])){
$runlist = $pdo->prepare("SELECT * FROM job WHERE job_id=:job_id order by job_id ");
$runlist->bindValue('job_id',$_GET['job_id']);
$runlist->execute();
}else{
$runlist = $pdo->query("SELECT * FROM job order by job_id ");
}

$count = $runlist->rowCount();
$i = 1;
if ($count >= 1) {
while ($row = $runlist->fetch(PDO::FETCH_ASSOC)) {
$a[] = array("id" => $i, 'job_nummer' => $row['job_id'], 'abc' => $row['abc'], 'kommentar' => $row['kommentar'], 'typ' => $row['typ'], 'format' => $row['format'], 'parameter' => $row['parameter'], 'export_date_start' => $row['export_date_start'], 'export_date_end' => $row['export_date_end'], 'pid' => $row['pid'], 'minute' => $row['minute'], 'stunde' => $row['stunde'], 'tag' => $row['tag'], 'monat' => $row['monat'], 'wochentag' => $row['wochentag'], 'next_run' => $row['next_run']);
$i++;
}
} else {
$a = "";
}
echo json_encode($a);

friend
1 Jul 2013, 8:44 AM
To load a form, you must format the data returned by your PHP code to conform to the structure I mentioned earlier. I usually have two server-side methods, where one returns a JSON list of data suitable for a Grid, and another which looks up/returns a single record formatted properly to load a form.

It's entirely up to you to properly format the JSON data structure required for a form load.

Nopkev
2 Jul 2013, 5:06 AM
Hi,

first thanks friend that you try to help me :).

Is this a single record formatted JSON-String or not ?




{"success":true,"data":{"job_nummer":"3","fluggeber":"abc","kommentar":"abc","typ":"abc","format":"abc","parameter":"abc","export_date_start":"abc","export_date_end":"abc","pid":"0","minute":"0","stunde":"7","tag":"*","monat":"*","wochentag":"*","next_run":"abc"}}