Ext.ns('Ext.app');
Ext.apply(Ext.form.VTypes, {
phone: function(v) {
v = v.replace(/-/g,'');
if (v.length > 11) {return false;}
return /[0-9]/.test(v);
},
phoneText: '電話番号が間違っています。',
phoneMask: /[\d-]/i,
postal: function(v) {
v = v.replace(/-/g,'');
if (v.length > 7) {return false;}
return /[0-9]/.test(v);
},
postalText: '郵便番号の形式が間違っています。',
postalMask: /[\d-]/i
});
Ext.app.AddressForm = Ext.extend(Ext.form.FormPanel,{
userData:{},
initComponent:function()
{
var form = this;
Ext.apply(this,{
autoScroll:true,
layout:'column',
defaults:{
xtype:'fieldset',
border:false,
columnWidth:0.5,
defaults:{
xtype:'textfield',
allowBlank:false,
anchor:'95%',
msgTarget:'under'
}
},
items:[
{
title:'お客様情報',
itemId:'primary_form',
ref:'primaryform',
columnWidth:1,
items:[
{
xtype:'displayfield',
hideLabel:true,
cls:'address-header',
value:'お客様情報
'
},
{
name:'od_name',
fieldLabel:'お名前'
},
{
name:'od_postal',
vtype:'postal',
xtype:'postalfield',
anchor:false,
width:120,
fieldLabel:'郵便番号',
parentFormType:'app-address-form',
address1:'od_address1',
address2:'od_address2',
pref:'od_pref'
},
{
xtype:'displayfield',
value:'記入例：464-0071(半角英数字)'
},
{
name:'od_pref',
itemId:'pref',
anchor:false,
width:120,
xtype:'preffield',
editable:false,
mode:'local',
triggerAction:'all'
},
{
name:'od_address1',
fieldLabel:'市区町村'
},
{
xtype:'displayfield',
value:'記入例：名古屋市千種区若水'
},
{
name:'od_address2',
fieldLabel:'番地、建物名'
},
{
xtype:'displayfield',
value:'記入例：3-28-11 ケイビルディング101号'
},
{
name:'od_phone',
anchor:false,
width:180,
fieldLabel:'電話番号',
vtype:'phone'
},
{
xtype:'displayfield',
value:'記入例：052-979-4950（半角数字）'
},
{
name:'od_email',
vtype:'email',
fieldLabel:'メールアドレス'
},
{
fieldLabel:'年齢',
name:'age_select',
hiddenName:'od_age',
xtype:'combo',
store:new Ext.data.JsonStore({
data:[
{name:'30歳以下'},
{name:'31～40歳'},
{name:'41～50歳'},
{name:'51～60歳'},
{name:'61～70歳'},
{name:'71～80歳'},
{name:'81歳以上'}
],
fields:['name']
}),
displayField:'name',
valueField:'name',
mode:'local',
triggerAction:'all',
editable:false
},
{
xtype:'displayfield',
value:'記入例：contact@forabee.jp（半角英数字）'
},
{
name:'od_message',
xtype:'textarea',
height:100,
allowBlank:true,
fieldLabel:'備考'
},
{
xtype:'displayfield'
},
{
name:'st_check',
value:false,
allowBlank:true,
xtype:'checkbox',
fieldLabel:'発送先',
boxLabel:'別の住所に発送する。',
listeners:{
scope:this,
check:function(checkbox,state){
if (state) {
this.getComponent('primary_form').columnWidth = 0.5;
var formItems = this.getForm().items.items;
for (var i in formItems){
if (!formItems.hasOwnProperty(i)) {continue;}
formItems[i].enable();
}
this.getComponent('sendto_form').enable();
this.getComponent('sendto_form').show();
var targetId = this.secondaryform.getId();
Ext.get(targetId).show();
this.doLayout();
}else{
var formItems = this.getForm().items.items;
for (var i in formItems){
if (!formItems.hasOwnProperty(i)) {continue;}
if (/^od_st_check/.test(formItems[i].getName())){
continue;
}else if (/^od_st_/.test(formItems[i].getName())) {
formItems[i].reset();
formItems[i].disable();
}
}
this.getComponent('sendto_form').disable();
this.getComponent('sendto_form').hide();
this.getComponent('primary_form').columnWidth = 1;
this.doLayout();
}
}
}
},
{
xtype:'displayfield',
value:'お客様情報とは別の住所への発送をご希望の場合は、チェックしてください。'
},
{
name:'od_ml_check',
xtype:'checkbox',
value:true,
allowBlank:true,
fieldLabel:'forabeeからのお得な情報',
boxLabel:'希望する'
},
{
xtype:'displayfield',
value:'ご注文頂いたメールアドレスにforabeeからのお得な情報をお送りしてもよろしいですか？希望しない場合はチェックを外してください。'
}
]
},
{
title:'発送先情報',
hidden:true,
collapsible:true,
autoShow:true,
disabled:true,
itemId:'sendto_form',
ref:'secondaryform',
defaults:{
xtype:'textfield',
disabled:true,
allowBlank:false,
anchor:'95%',
msgTarget:'under'
},
items:[
{
xtype:'displayfield',
hideLabel:true,
cls:'address-header',
value:'お届け先情報
'
},
{
name:'od_st_name',
fieldLabel:'お名前'
},
{
name:'od_st_postal',
vtype:'postal',
xtype:'postalfield',
fieldLabel:'郵便番号',
parentFormType:'app-address-form',
address1:'od_st_address1',
address2:'od_st_address2',
pref:'od_st_pref'
},
{
xtype:'displayfield',
value:'記入例：464-0071(半角英数字)'
},
{
name:'od_st_pref',
itemId:'st_pref',
xtype:'preffield',
editable:false,
mode:'local',
triggerAction:'all'
},
{
name:'od_st_address1',
fieldLabel:'市区町村'
},
{
xtype:'displayfield',
value:'記入例：名古屋市千種区若水'
},
{
name:'od_st_address2',
fieldLabel:'番地、建物名'
},
{
xtype:'displayfield',
value:'記入例：3-28-11 ケイビルディング101号'
},
{
name:'od_st_phone',
fieldLabel:'電話番号',
vtype:'phone'
},
{
xtype:'displayfield',
value:'記入例：052-979-4950（半角数字）'
}
]
}
]
});
Ext.app.AddressForm.superclass.initComponent.call(this);
},
initData:function(data)
{
this.userData = data;
},
setData:function(data)
{
if(!data) {
data = this.userData;
}
var newData = {};
Ext.iterate(data,function(key,value,data){
var k = key.replace('u_','od_');
newData[k] = value;
},this);
newData.od_postal = newData.od_postalcode;
this.getForm().setValues(newData);
}
});
Ext.reg('app-address-form',Ext.app.AddressForm);