laden von Daten aus dem Netz zu bilden
ich soll zum laden von Daten in ein Formular ein, wenn ein Benutzer auf eine Zeile klicken. Ich fand einige Beispiele, aber nicht sicher, wie Sie es in meinem Skript. Ich machte ein Formular, in dem Architekten und es sieht so aus
items: [
{
xtype: 'tabpanel',
id: 'mainTab',
activeTab: 0,
region: 'center',
items: [
{
xtype: 'panel',
id: 'configurationTab',
title: 'Configuration',
dockedItems: [
{
xtype: 'tabpanel',
height: 479,
id: 'configurationVehicles',
suspendLayout: true,
title: 'configuration',
activeTab: 0,
dock: 'top',
items: [
{
xtype: 'panel',
id: 'configurationDrivers',
layout: {
type: 'border'
},
collapsed: false,
title: 'Drivers',
items: [
{
xtype: 'form',
floating: false,
height: 420,
id: 'configurationDriversConfiguration',
itemId: 'configurationDriversConfiguration',
bodyPadding: 10,
animCollapse: false,
collapsed: false,
collapsible: true,
title: 'Driver Configuration',
floatable: false,
region: 'north',
items: [
{
xtype: 'textfield',
id: 'configurationDriversCode',
name: 'configurationDriversCode',
fieldLabel: 'Driver Code',
allowBlank: false
},
{
xtype: 'textfield',
id: 'configurationDriversName',
fieldLabel: 'Driver Name',
allowBlank: false
},
{
xtype: 'textfield',
id: 'configurationDriversLicense',
fieldLabel: 'Driver License nr',
allowBlank: false
},
{
xtype: 'textfield',
id: 'FirstName',
name: 'FirstName',
fieldLabel: 'Driver Given Name',
allowBlank: false
},
{
xtype: 'textfield',
id: 'configurationDriversFamilyName',
fieldLabel: 'Driver Familiy Name',
allowBlank: false
},
{
xtype: 'textfield',
id: 'configurationDriversPhone',
fieldLabel: 'Driver Phone Nr',
allowBlank: false
},
{
xtype: 'textfield',
id: 'configurationDriversEmail',
fieldLabel: 'Driver Email',
allowBlank: false
},
{
xtype: 'combobox',
id: 'configurationDriversProvider',
fieldLabel: 'Provider',
allowBlank: false,
displayField: 'name',
store: 'comboProviders',
valueField: 'id'
},
{
xtype: 'textareafield',
id: 'configurationDriversMemo',
fieldLabel: 'Memo',
allowBlank: false
},
{
xtype: 'button',
handler: function(button, event) {
var form = this.up('form');
var formfields = form.getForm().getValues();
//this.up('form').getForm().submit();
console.log(formfields);
Ext.MessageBox.alert('Submitted Values', formfields);
form.getForm().reset();
},
id: 'configurationDriversSave',
text: 'Save',
formBind: true
},
{
xtype: 'button',
handler: function(button, event) {
var form = this.up('form');
form.getForm().reset();
},
style: 'margin-left: 10px;',
text: 'Clear'
}
]
},
{
xtype: 'gridpanel',
id: 'configurationDriversGrid',
itemId: 'configurationDriversGrid',
animCollapse: false,
collapsible: true,
title: 'Drivers',
store: 'gridDrivers',
region: 'center',
viewConfig: {
},
columns: [
{
xtype: 'gridcolumn',
dataIndex: 'id',
text: 'Id'
},
{
xtype: 'gridcolumn',
dataIndex: 'version',
text: 'Version'
},
{
xtype: 'gridcolumn',
dataIndex: 'driverId',
text: 'DriverId'
},
{
xtype: 'gridcolumn',
id: 'FirstName',
dataIndex: 'firstName',
text: 'FirstName'
},
{
xtype: 'gridcolumn',
dataIndex: 'middleName',
text: 'MiddleName'
},
{
xtype: 'gridcolumn',
dataIndex: 'lastName',
text: 'LastName'
},
{
xtype: 'gridcolumn',
dataIndex: 'email',
text: 'Email'
},
{
xtype: 'gridcolumn',
dataIndex: 'workPhone',
text: 'WorkPhone'
},
{
xtype: 'gridcolumn',
dataIndex: 'note',
text: 'Note'
},
{
xtype: 'gridcolumn',
dataIndex: 'licenseNumber',
text: 'LicenseNumber'
},
{
xtype: 'gridcolumn',
dataIndex: 'providerId',
text: 'ProviderId'
},
{
xtype: 'actioncolumn',
id: 'idAction',
dataIndex: 'id',
items: [
{
handler: function(view, rowIndex, colIndex, item, e) {
console.log('Delete');
},
icon: 'img/delete.png'
}
]
}
],
Fand ich ein Beispiel, wie diese
onRowselectionmodelSelect: function(rowmodel, record, index, options) {
console.log(record.get('id'));
formpanel.getForm().load({
url: 'xml-form-data.xml',
waitMsg: 'Loading...'
});
}
Dem formpanel.getForm().load({ sollten zeigen Sie auf die form-Abschnitt. In den Beispielen, die Sie verwendet var formpanel = ...
Aber wie kann ich laden Sie es in diesem setup in meine form?
- sind Sie versuchen, das laden der Daten vom server auf rowselect? oder Sie haben genügend Daten, die in den bereits abgerufenen Datensatz, um zu zeigen, in der form?
- ich habe alle Daten die ich brauche in dieser Zeile. Will ich laden Sie es in das Formular, um es zu Bearbeiten. Wenn der Benutzer klickt auf speichern zu speichern, sollten die Daten mit der ID als Schlüssel, die durch eine Belastung mit einer PUT Methode.
Du musst angemeldet sein, um einen Kommentar abzugeben.
Ich nehme an, es ist ExtJs 4. Dann können Sie die Last aufnehmen, um das Formular mit
loadRecord
Funktion:Nachdem Sie mit der Bearbeitung fertig und drücken die Schaltfläche Speichern verwenden
updateRecord
Methode zum Auffüllen von Daten von einem Formular ein Datensatz geladen, siehe: Ext.form.Basic - updateRecord.und speichern Sie es dann mit
store.sync()
oderrecord.save()
je nachdem, wie Sie konfiguriert und speichern Sie Ihre Modell.var formpanel = Ext.getCmp('configurationDriversConfiguration')
driverId
dann Ihre form auch soll hat, das Feld. Stattdessen haben Sie ein Feld mit dem Namenname: 'configurationDriversCode'
dataIndex: 'firstName'
bedeutet es, dass die Datensatz-FeldfirstName
während der Feld-name istname: 'FirstName'
- es ist anders, es ist groß-und Kleinschreibung.