Code:
// reference local blank image
Ext.BLANK_IMAGE_URL = 'images/default/s.gif';
// create namespace
Ext.namespace('ibePartner');
// create application
ibePartner.app = function()
{
// do NOT access DOM from here; elements don't exist yet
// PRIVATE VARIABLES
var partnerWindowCount = 1;
// PRIVATE FUNCTIONS
//==========================================================================
// FORM
//==========================================================================
var createPartnerForm = function(id) {
// turn on validation errors beside the field globally
Ext.form.Field.prototype.msgTarget = 'side';
var partnerRequestsTypesDef = new Array(
{"key":"AddPartner","value":55},
{"key":"AddUser","value":50},
{"key":"BookFlight","value":5},
{"key":"BookHotel","value":10},
{"key":"CancelBookingItem","value":101},
{"key":"ConfirmBookingItemPayment","value":104},
{"key":"DeactivatePartner","value":56},
{"key":"DeactivateUser","value":51},
{"key":"GetBookings","value":100},
{"key":"GetDictionary","value":11},
{"key":"GetFareInfo","value":3},
{"key":"GetFlightInfo","value":2},
{"key":"GetHotelConditions","value":8},
{"key":"GetHotelInfo","value":7},
{"key":"GetPartner","value":58},
{"key":"GetPartners","value":59},
{"key":"GetUser","value":53},
{"key":"GetUsers","value":54},
{"key":"ModifyFlightBookingItem","value":102},
{"key":"ModifyHotelBookingItem","value":103},
{"key":"PriceFlight","value":4},
{"key":"PriceHotel","value":9},
{"key":"SearchFlights","value":1},
{"key":"SearchHotels","value":6},
{"key":"UpdatePartner","value":57},
{"key":"UpdateUser","value":52}
)
var partnerRequestsTypes = new Array();
for (var a=0; a<partnerRequestsTypesDef.length; a++)
{
var bla = new Ext.form.Checkbox({
boxLabel:" ",
name: partnerRequestsTypesDef[a].key,
value: partnerRequestsTypesDef[a].value,
inputValue: partnerRequestsTypesDef[a].value,
fieldLabel: partnerRequestsTypesDef[a].key,
xtype: "checkbox"
});
partnerRequestsTypes.push(bla);
}
var formPartner = new Ext.FormPanel({
id: 'partnerForm',
border:false,
labelAlign: 'right',
labelWidth: 180,
width:540,
loadingText:'Loading. asfasdfasd..',
savingText:'Saving..asdfasdfa.',
errorReader: new Ext.form.XmlErrorReader(),
// configure how to read the XML Data
reader: new Ext.data.XmlReader({
record : 'GetPartner',
success: '@success'
}, [
{name: 'PartnerCode'},
{name: 'PartnerName'},
{name: 'Street'},
{name: 'HouseNumber'},
{name: 'RoomNumber'},
{name: 'ZipCode'},
{name: 'CityName'},
{name: 'CountryName'},
{name: 'NIP'},
{name: 'Email'},
{name: 'RequestUserId'},
{name: 'RequestUserPassword'},
{name: 'ToolkitUserId'},
{name: 'ToolkitUserPassword'},
{name: 'PartnerLocations'}
]),
items: {
id: 'partnerTabs',
xtype:'tabpanel',
activeTab: 0,
defaults:{autoHeight:true, bodyStyle:'padding:10px', height: '500'},
autoScroll: true,
deferredRender:false,
enableTabScroll:true,
items:[{
title:'Detale',
layout:'form',
defaults: {width: 500},
defaultType: 'textfield',
items: [{
xtype:"hidden",
name:"PartnerCodeId"
},{
fieldLabel: 'Code',
name:"PartnerCode",
width: 190,
disabled: true
},{
fieldLabel: 'Name',
name: 'PartnerName',
width:190
}, {
fieldLabel: 'Street',
name: 'Street',
width:190
}, {
fieldLabel: 'HouseNumber',
name: 'HouseNumber',
width:80
}, {
fieldLabel: 'RoomNumber',
name: 'RoomNumber',
width:80
}, {
fieldLabel: 'ZipCode',
name: 'ZipCode',
width:80
}, {
fieldLabel: 'CityName',
name: 'CityName',
width:190
}, {
fieldLabel: 'CountryName',
name: 'CountryName',
width:190
}, {
fieldLabel: 'NIP',
name: 'NIP',
width:190
}, {
fieldLabel: 'Email',
name: 'Email',
vtype: 'email',
width:190
}, {
fieldLabel: 'RequestUserId',
name: 'RequestUserId',
width:190
}, {
fieldLabel: 'RequestUserPassword',
name: 'RequestUserPassword',
width:190
}, {
fieldLabel: 'ToolkitUserId',
name: 'ToolkitUserId',
width:190
},{
fieldLabel: 'ToolkitUserPassword',
name: 'ToolkitUserPassword',
width:190
}]
},{
id: 'partnerPermissionsTab',
title:'Uprawnienia',
listeners: {activate: handleActivateTab},
layout:'form',
defaultType: 'checkbox',
items: partnerRequestsTypes
},{
id: 'partnerLocationsTab',
title:'Lokalizacje',
layout:'form',
defaults: {width: 190},
defaultType: 'textfield',
items: [{
fieldLabel: 'LocationCode',
name: 'LocationCode1',
width:190
}, {
fieldLabel: 'LocationName',
name: 'LocationName1',
width:190
},{
fieldLabel: 'IP',
name: 'IP1',
width:190
}, {
fieldLabel: 'LocationCode',
name: 'LocationCode2',
width:190
}, {
fieldLabel: 'LocationName',
name: 'LocationName2',
width:190
}, {
fieldLabel: 'IP',
name: 'IP2',
width:190
}, {
fieldLabel: 'LocationCode',
name: 'LocationCode3',
width:190
}, {
fieldLabel: 'LocationName',
name: 'LocationName3',
width:190
}, {
fieldLabel: 'IP',
name: 'IP3',
width:190
}, {
fieldLabel: 'LocationCode',
name: 'LocationCode4',
width:190
}, {
fieldLabel: 'LocationName',
name: 'LocationName4',
width:190
}, {
fieldLabel: 'IP',
name: 'IP4',
width:190
}]
},{
title:'PartnerConnectionStrings',
layout:'form',
defaults: {width: 190},
defaultType: 'textfield',
items: [{
fieldLabel: 'ProviderCode',
name: 'ProviderCode1',
width:190
}, {
fieldLabel: 'ConnectionString',
name: 'ConnectionString1',
width:190
},{
fieldLabel: 'ProviderCode',
name: 'ProviderCode2',
width:190
}, {
fieldLabel: 'ConnectionString',
name: 'ConnectionString2',
width:190
}, {
fieldLabel: 'ProviderCode',
name: 'ProviderCode3',
width:190
}, {
fieldLabel: 'ConnectionString',
name: 'ConnectionString3',
width:190
}, {
fieldLabel: 'ProviderCode',
name: 'ProviderCode4',
width:190
}, {
fieldLabel: 'ConnectionString',
name: 'ConnectionString4',
width:190
}, {
fieldLabel: 'ProviderCode',
name: 'ProviderCode5',
width:190
}, {
fieldLabel: 'ConnectionString',
name: 'ConnectionString5',
width:190
}, {
fieldLabel: 'ProviderCode',
name: 'ProviderCode6',
width:190
}, {
fieldLabel: 'ConnectionString',
name: 'ConnectionString6',
width:190
}]
}]
}
}); //end of form partner
formPartner.on({
actioncomplete: function(form, action){
if(action.type == 'load'){
//lame but works, need to activate permissions tab or the checkboxes won't get submitted if this tab will never be activated
var t = Ext.getCmp("partnerTabs");
t.hide();
t.activate(0);
t.activate(1);
t.activate(2);
t.activate(3);
t.show();
t.activate(0);
form.setValues([{id: "PartnerCodeId", value: form.findField("PartnerCode").value}]);
var n = partnerWindowCount;
var wname = 'partnerWnd' + (n-1);
Ext.getCmp(wname).buttons[0].enable();
}
}
});
function handleActivateTab(tab)
{
//alert(tab.title + ' was activated.');
}
return formPartner;
}
var showPartnerFormHandler = function(id) {
var form = createPartnerForm();
var adding = (!id || id == "");
var wname = 'partnerWnd' + partnerWindowCount;
var partnerWindow = new Ext.Window({
id: wname,
title: 'Partner',
width: 500,
height: 490,
minWidth: 500,
minHeight: 490,
layout: 'fit',
plain:false,
resizable: true,
bodyStyle:'padding:5px;',
buttonAlign:'center',
items: [form],
buttons: [
new Ext.Button({
text: 'Zapisz',
type: 'submit',
disabled: true,
handler: function(){
if (!adding)
form.getForm().submit({url:'Partner/json/exec/updatepartner/', waitMsg:'Zapisywanie Partnera...', success: submitOK, failure: submitError});
else
form.getForm().submit({url:'Partner/json/exec/addpartner/', waitMsg:'Dodawanie Partnera...', success: submitOK, failure: submitError});
}
}),
new Ext.Button({
text: 'Anuluj',
disabled:false,
handler: function(){
partnerWindowCount--;
var wname = 'partnerWnd' + partnerWindowCount;
Ext.getCmp(wname).hide();
}
})
]
});
partnerWindow.show();
if (!adding) //we are editing
{
form.getForm().load({url:'Partner/json/exec/getpartner/id/' + id, waitMsg:'Ładowanie...', success: wtf});
}
else //adding
{
var wname = 'partnerWnd' + partnerWindowCount;
Ext.getCmp(wname).buttons[0].enable();
form.getForm().findField("PartnerCode").enable();
}
partnerWindowCount++;
function submitOK(o)
{
Ext.MessageBox.alert('Partnerzy', o.errorReader.xmlData.firstChild.attributes[1].nodeValue);
partnerWindow.hide();
Ext.getCmp("partnerGrid").store.load({params:{start:0, limit:25}});
}
function submitError(o)
{
var error = o.errorReader.xmlData.firstChild.attributes[1].nodeValue;
if (error != "")
error = ": " + error;
else
error = " " + error;
Ext.MessageBox.alert('Partnerzy', "Wystąpił Błąd" + error);
}
function wtf(o)
{
var partnerRTset = false;
var partnerCSset = false;
var partnerLocset = false;
var elements = form.getForm().items.items;
for (var a=0; a<o.reader.xmlData.firstChild.childNodes[0].childNodes.length; a++)
{
var item = o.reader.xmlData.firstChild.childNodes[0].childNodes[a];
if (item.nodeName == 'PartnerRequestTypes')
{
partnerRTset = true;
for (var x=0; x<item.childNodes.length; x++)
{
var i = item.childNodes[x];
for (var e=0; e<elements.length; e++)
{
if (elements[e].xtype == "checkbox" && elements[e].value == i.firstChild.nodeValue)
{
elements[e].checked = true;
break;
}
}
}
}
if (item.nodeName == 'PartnerLocations')
{
var lc_step = 1;
var ln_step = 1;
var ip_step = 1;
partnerLocset = true;
for (var x=0; x<item.childNodes.length; x++)
{
var items_cs = item.childNodes[x].childNodes;
for (var z=0; z<items_cs.length; z++)
{
var lc_name = "LocationCode" + lc_step;
var ln_name = "LocationName" + ln_step;
var ip_name = "IP" + ip_step;
var i = items_cs[z];
if (i.nodeName == "LocationCode")
{
for (var e=0; e<elements.length; e++)
{
if (elements[e].name == lc_name)
{
if (i.firstChild != null)
elements[e].value = i.firstChild.nodeValue;
break;
}
}
}
if (i.nodeName == "LocationName")
{
for (var e=0; e<elements.length; e++)
{
if (elements[e].name == ln_name)
{
if (i.firstChild != null)
elements[e].value = i.firstChild.nodeValue;
break;
}
}
}
if (i.nodeName == "IP")
{
for (var e=0; e<elements.length; e++)
{
if (elements[e].name == ip_name)
{
if (i.firstChild != null)
elements[e].value = i.firstChild.nodeValue;
break;
}
}
}
}
lc_step++;
ln_step++;
ip_step++;
}
}
if (item.nodeName == 'PartnerConnectionStrings')
{
var pc_step = 1;
var cs_step = 1;
partnerCSset = true;
for (var x=0; x<item.childNodes.length; x++)
{
var items_cs = item.childNodes[x].childNodes;
for (var z=0; z<items_cs.length; z++)
{
var pc_name = "ProviderCode" + pc_step;
var cs_name = "ConnectionString" + cs_step;
var i = items_cs[z];
if (i.nodeName == "ProviderCode")
{
for (var e=0; e<elements.length; e++)
{
if (elements[e].name == pc_name)
{
if (i.firstChild != null)
elements[e].value = i.firstChild.nodeValue;
break;
}
}
}
if (i.nodeName == "ConnectionString")
{
for (var e=0; e<elements.length; e++)
{
if (elements[e].name == cs_name)
{
if (i.firstChild != null)
elements[e].value = i.firstChild.nodeValue;
break;
}
}
}
}
pc_step++;
cs_step++
}
}
if (partnerRTset && partnerLocset && partnerCSset) break;
}
}
};
//==============================================================================
// GRID
//==============================================================================
var createPartnerGrid = function() {
var xg = Ext.grid;
var sm = new xg.CheckboxSelectionModel();
// create the Data Store
var store = new Ext.data.Store({
// load using script tags for cross domain, if the data in on the same domain as
// this page, an HttpProxy would be better
proxy: new Ext.data.HttpProxy({
url: 'Partner/json/exec/getpartner/'
}),
// create reader that reads the Topic records
reader: new Ext.data.JsonReader({
root: 'partners',
totalProperty: 'totalCount',
id: 'PartnerCode',
fields: [
'PartnerName',
'Street',
'HouseNumber',
'RoomNumber',
'ZipCode',
'CityName',
'CountryName',
'NIP',
'Email',
'RequestUserId',
'RequestUserPassword',
'ToolkitUserId',
'ToolkitUserPassword',
'PartnerLocations',
'PartnerConnectionStrings'
]
}),
// turn on remote sorting
remoteSort: true
});
store.setDefaultSort('PartnerName', 'desc');
// the column model has information about grid columns
// dataIndex maps the column to the specific data field in
// the data store
var cm = new xg.ColumnModel([
sm,
{
id: 'PartnerCode', // id assigned so we can apply custom css (e.g. .x-grid-col-topic b { color:#333 })
header: "PartnerName",
dataIndex: 'PartnerName'
},
{
header: "Street",
dataIndex: 'Street'
},
{
header: "HouseNumber",
dataIndex: 'HouseNumber'
},
{
header: "RoomNumber",
dataIndex: 'RoomNumber'
},
{
header: "ZipCode",
dataIndex: 'ZipCode'
},
{
header: "CountryName",
dataIndex: 'CountryName'
},
{
header: "NIP",
dataIndex: 'NIP'
},
{
header: "Email",
dataIndex: 'Email'
},
{
header: "RequestUserId",
dataIndex: 'RequestUserId'
},
{
header: "RequestUserPassword",
dataIndex: 'RequestUserPassword'
},
{
header: "ToolkitUserId",
dataIndex: 'ToolkitUserId'
},
{
header: "ToolkitUserPassword",
dataIndex: 'ToolkitUserPassword'
},
{
header: "PartnerLocations",
dataIndex: 'PartnerLocations'
},
{
header: "PartnerConnectionStrings",
dataIndex: 'PartnerConnectionStrings'
}
]);
// by default columns are sortable
cm.defaultSortable = true;
var grid = new xg.GridPanel({
id: 'partnerGrid',
el:'partner_body',
width:700,
height:500,
title:'Partnerzy',
store: store,
cm: cm,
trackMouseOver: true,
/*sm: new xg.RowSelectionModel({selectRow:Ext.emptyFn}),*/
sm: sm,
viewConfig: {
forceFit:false
},
bbar: new Ext.PagingToolbar({
pageSize: 3,
store: store,
displayInfo: true,
displayMsg: 'Displaying topics {0} - {1} of {2}',
emptyMsg: "No topics to display"
}),
// inline toolbars
tbar:[{
text:'Dodaj Partnera',
tooltip:'Dodaj nowy element',
iconCls:'add',
handler: partnerAdd
},
{
text:'Edytuj Partnera',
tooltip:'Edytuj wybrany element',
iconCls:'edit',
handler: partnerEdit
},
{
text:'Odśwież',
tooltip:'Odśwież Liste',
iconCls:'edit',
handler: partnerReload
},
'-',
{
text:'Usuń Partnera',
tooltip:'Usuń wybrany element',
iconCls:'remove',
handler: partnerDelete
}]
});
// render it
grid.render();
// trigger the data store load
store.load({params:{start:0, limit:25}});
function partnerReload()
{
store.load({params:{start:0, limit:25}});
}
function partnerAdd()
{
showPartnerFormHandler(false);
}
function partnerEdit()
{
var record = sm.getSelected();
if ('undefined' == typeof record)
{
Ext.MessageBox.alert("Błąd","Należy najpierw zaznaczyć Partnera na liście");
return;
}
showPartnerFormHandler(record.id);
}
function partnerDelete()
{
var record = sm.getSelected();
if ('undefined' == typeof record)
{
Ext.MessageBox.alert("Błąd","Należy najpierw zaznaczyć Partnera na liście");
return
}
Ext.MessageBox.confirm('Potwierdź', 'Napewno usunąć Partnera: ' + record.id, partnerDeleteExec);
}
function partnerDeleteExec(btn)
{
if (btn == "no") return;
var record = sm.getSelected();
function partnerDeleteOk(o)
{
Ext.MessageBox.alert('Partnerzy', o.responseXML.firstChild.attributes[1].nodeValue);
store.load({params:{start:0, limit:25}});
}
function partnerDeleteFailure()
{
Ext.MessageBox.alert('Partnerzy', o.responseXML.firstChild.attributes[1].nodeValue);
Ext.MessageBox.alert('Błąd', 'Error while deleting')
}
Ext.Ajax.request({
url: 'Partner/json/exec/deletepartner/',
success: partnerDeleteOk,
failure: partnerDeleteFailure,
headers: {
'my-header': 'foo'
},
params: { PartnerCode: record.id}
});
//Ext.getCmp("partnerForm").getForm().submit({url:'partner/json/exec/deletepartner/', waitMsg:'Usuwanie Partnera...', success: submitOK, failure: submitError});
}
return xg;
}
// PUBLIC SPACE
return {
// public properties, e.g. strings to translate
PageTitle: "partnerzy",
pGrid: false,
// public methods
init: function()
{
},
addPartner: function ()
{
if (!this.pGrid);
this.init();
showPartnerFormHandler(false);
},
exec: function ()
{
setPageTitle(this.PageTitle);
setRenderBlock("partner_body");
this.pGrid = createPartnerGrid();
}
};
}(); // end of app
// A reusable error reader class for XML forms
Ext.form.XmlErrorReader = function(){
Ext.form.XmlErrorReader.superclass.constructor.call(this, {
record : 'field',
success: '@success'
}, [
'id', 'msg'
]
);
};
Ext.extend(Ext.form.XmlErrorReader, Ext.data.XmlReader);
Ext.onReady(ibePartner.app.init, ibePartner.app);
How to make tab scrollable?!
Reply With Quote