Ext.namespace('Ext.ux'); Ext.ux.ImageButton = function(cfg) { Ext.ux.ImageButton.superclass.constructor.call(this, cfg); }; Ext.extend(Ext.ux.ImageButton, Ext.Button, { onRender : function(ct, position) { this.disabledImgPath = this.disabledImgPath || this.imgPath; var tplHTML = '
{tooltip} {imgText:htmlEncode}

'; var tpl = new Ext.Template(tplHTML); var btn, targs = { imgPath : this.disabled ? this.disabledImgPath : this.imgPath, imgWidth : this.imgWidth || "", imgHeight : this.imgHeight || "", imgText : this.text || "", cursor : this.disabled ? "default" : "pointer", tooltip : this.tooltip || "" }; btn = tpl.append(ct, targs, true); btn.on("click", this.onClick, this); if (this.cls) { btn.addClass(this.cls); } this.el = btn; if (this.hidden) { this.hide(); } }, disable : function(newImgPath) { var replaceImgPath = newImgPath || this.disabledImgPath; if (replaceImgPath) this.el.dom.firstChild.src = replaceImgPath; this.disabled = true; }, enable : function(newImgPath) { var replaceImgPath = newImgPath || this.imgPath; if (replaceImgPath) this.el.dom.firstChild.src = replaceImgPath; this.disabled = false; } }); Ext.reg('imagebutton', Ext.ux.ImageButton); function createEmailForm() { Ext.QuickTips.init(); // turn on validation errors beside the field globally Ext.form.Field.prototype.msgTarget = 'side'; var fs = new Ext.FormPanel({ labelAlign: 'right', frame:false, monitorValid:true, bodyStyle:'background-color:transparent', hideBorders :true, border :false, width: 640, waitMsgTarget: true, items: [ { layout:'column', hideBorders :true, frame:false, bodyStyle:'background-color:transparent', hideBorders :true, border :false, items:[{ columnWidth:.6, layout: 'form', frame:false, bodyStyle:'background-color:transparent', hideBorders :true, border :false, items: [{ xtype:'textfield', name:'first', fieldLabel:'Naam bedrijf', allowBlank:false, validateOnBlur :true, anchor:'100%' }] },{ columnWidth:.3, layout: 'form', frame:false, bodyStyle:'background-color:transparent', hideBorders :true, border :false, items: [{ xtype:'label', text : '*', style :'margin-left:20px;color:red', anchor:'100%' }] }] }, { layout:'column', hideBorders :true, frame:false, bodyStyle:'background-color:transparent', hideBorders :true, border :false, items:[{ columnWidth:.6, bodyStyle:'background-color:transparent', layout: 'form', items: [{ xtype:'textfield', name:'last', fieldLabel: 'Naam afzender', allowBlank:false, validateOnBlur :true, anchor:'100%' }] },{ columnWidth:.4, layout: 'form', frame:false, bodyStyle:'background-color:transparent', hideBorders :true, border :false, items: [{ xtype:'label', text : '*', style :'margin-left:20px;color:red', anchor:'100%' }] }] }, { xtype:'textfield', name:'street', fieldLabel:'Straatnaam', anchor:'60%' }, { layout:'column', hideBorders :true, frame:false, bodyStyle:'background-color:transparent', hideBorders :true, border :false, items:[{ columnWidth:.3, layout: 'form', frame:false, bodyStyle:'background-color:transparent', hideBorders :true, border :false, items: [{ xtype:'textfield', fieldLabel: 'Huisnr', name: 'huisnr', anchor:'100%' }] },{ columnWidth:.3, layout: 'form', frame:false, bodyStyle:'background-color:transparent', hideBorders :true, border :false, items: [{ xtype:'textfield', fieldLabel: 'Postcode', name: 'postcode', anchor:'100%' }] }] }, { xtype:'textfield', name:'plaats', fieldLabel:'Plaats', anchor:'60%' },{ xtype:'combo', anchor:'60%', fieldLabel: 'Land', name: 'land', disabled : false, width: 180, displayField:'land', valueField : 'land', triggerAction : 'all', mode : 'local', store : new Ext.data.SimpleStore({ fields :['land'], data : [ ['Afghanistan'], ['Albania'], ['Algeria'], ['Andorra'], ['Angola'], ['Antigua & Deps'], ['Argentina'], ['Armenia'], ['Australia'], ['Austria'], ['Azerbaijan'], ['Bahamas'], ['Bahrain'], ['Bangladesh'], ['Barbados'], ['Belarus'], ['Belgium'], ['Belize'], ['Benin'], ['Bhutan'], ['Bolivia'], ['Bosnia Herzegovina'], ['Botswana'], ['Brazil'], ['Brunei'], ['Bulgaria'], ['Burkina'], ['Burundi'], ['Cambodia'], ['Cameroon'], ['Canada'], ['Cape Verde'], ['Central African Rep'], ['Chad'], ['Chile'], ['China'], ['Colombia'], ['Comoros'], ['Congo'], ['Congo {Democratic Rep}'], ['Costa Rica'], ['Croatia'], ['Cuba'], ['Cyprus'], ['Czech Republic'], ['Denmark'], ['Djibouti'], ['Dominica'], ['Dominican Republic'], ['East Timor'], ['Ecuador'], ['Egypt'], ['El Salvador'], ['Equatorial Guinea'], ['Eritrea'], ['Estonia'], ['Ethiopia'], ['Fiji'], ['Finland'], ['France'], ['Gabon'], ['Gambia'], ['Georgia'], ['Germany'], ['Ghana'], ['Greece'], ['Grenada'], ['Guatemala'], ['Guinea'], ['Guinea-Bissau'], ['Guyana'], ['Haiti'], ['Honduras'], ['Hungary'], ['Iceland'], ['India'], ['Indonesia'], ['Iran'], ['Iraq'], ['Ireland {Republic}'], ['Israel'], ['Italy'], ['Ivory Coast'], ['Jamaica'], ['Japan'], ['Jordan'], ['Kazakhstan'], ['Kenya'], ['Kiribati'], ['Korea North'], ['Korea South'], ['Kosovo'], ['Kuwait'], ['Kyrgyzstan'], ['Laos'], ['Latvia'], ['Lebanon'], ['Lesotho'], ['Liberia'], ['Libya'], ['Liechtenstein'], ['Lithuania'], ['Luxembourg'], ['Macedonia'], ['Madagascar'], ['Malawi'], ['Malaysia'], ['Maldives'], ['Mali'], ['Malta'], ['Marshall Islands'], ['Mauritania'], ['Mauritius'], ['Mexico'], ['Micronesia'], ['Moldova'], ['Monaco'], ['Mongolia'], ['Montenegro'], ['Morocco'], ['Mozambique'], ['Myanmar, {Burma}'], ['Namibia'], ['Nauru'], ['Nepal'], ['Netherlands'], ['New Zealand'], ['Nicaragua'], ['Niger'], ['Nigeria'], ['Norway'], ['Oman'], ['Pakistan'], ['Palau'], ['Panama'], ['Papua New Guinea'], ['Paraguay'], ['Peru'], ['Philippines'], ['Poland'], ['Portugal'], ['Qatar'], ['Romania'], ['Russian Federation'], ['Rwanda'], ['St Kitts & Nevis'], ['St Lucia'], ['Saint Vincent & the Grenadines'], ['Samoa'], ['San Marino'], ['Sao Tome & Principe'], ['Saudi Arabia'], ['Senegal'], ['Serbia'], ['Seychelles'], ['Sierra Leone'], ['Singapore'], ['Slovakia'], ['Slovenia'], ['Solomon Islands'], ['Somalia'], ['South Africa'], ['Spain'], ['Sri Lanka'], ['Sudan'], ['Suriname'], ['Swaziland'], ['Sweden'], ['Switzerland'], ['Syria'], ['Taiwan'], ['Tajikistan'], ['Tanzania'], ['Thailand'], ['Togo'], ['Tonga'], ['Trinidad & Tobago'], ['Tunisia'], ['Turkey'], ['Turkmenistan'], ['Tuvalu'], ['Uganda'], ['Ukraine'], ['United Arab Emirates'], ['United Kingdom'], ['United States'], ['Uruguay'], ['Uzbekistan'], ['Vanuatu'], ['Vatican City'], ['Venezuela'], ['Vietnam'], ['Yemen'], ['Zambia'], ['Zimbabwe'] ] }) },{ layout: 'column', hideBorders: true, frame: false, bodyStyle: 'background-color:transparent', hideBorders: true, border: false, items: [{columnWidth: .6, layout: 'form', frame: false, bodyStyle: 'background-color:transparent', hideBorders: true, border: false, items: [{ xtype: 'textfield', name: 'tel', fieldLabel: 'Tel.nr', allowBlank: true, validateOnBlur: true, anchor: '75%'}] }, { columnWidth: .3, layout: 'form', frame: false, bodyStyle: 'background-color:transparent', hideBorders: true, border: false, items: [{ xtype: 'label', text: '', style: 'margin-left:20px;color:red', anchor: '100%'}] }] }, { xtype:'textfield', name:'fax', fieldLabel:'Fax nr', anchor:'45%' }, { xtype:'textfield', name:'email', fieldLabel:'E-mail', vtype:'email', anchor:'60%' },{ xtype:'textarea', name:'comments', fieldLabel:'Opmerking', height:200, anchor:'98%' },{ layout:'column', hideBorders :true, frame:false, bodyStyle:'background-color:transparent', hideBorders :true, border :false, items:[{ columnWidth:.5, layout: 'form', frame:false, bodyStyle:'background-color:transparent', hideBorders :true, border :false, items: [ new Ext.ux.ImageButton({ imgPath : '/Assets/Images/MBTM-new_13.gif', imgWidth : 87, imgHeight : 18, formBind:true, style:'margin-left:150px', tooltip : 'submit', handler: function(){ fs.getForm().submit({ url:'/MBTM_CONTACT_SENDMAIL.aspx', waitMsg:'Sending Data...', success:function(){ Ext.Msg.alert('Status', 'Uw bericht is verzonden ..', function(btn, text){ if (btn == 'ok'){ //var redirect = 'test.asp'; //window.location = redirect; } }); }, failure:function(form, action){ if(action.failureType == 'server'){ obj = Ext.util.JSON.decode(action.response.responseText); Ext.Msg.alert('Failed!', obj.errors.reason); }else{ Ext.Msg.alert('Warning!', 'Please check the form again ' ); } } })} }) ] },{ columnWidth:.3, layout: 'form', frame:false, bodyStyle:'background-color:transparent', hideBorders :true, border :false, items: [ new Ext.ux.ImageButton({ imgPath : '/Assets/Images/MBTM-contact_11.gif', imgWidth : 87, imgHeight : 18, style:'margin-left:30px;', tooltip : 'clear', handler: function(){ fs.getForm().reset(); } }) ] }] }] }); fs.render('form-ct'); } function createEmailForm2() { Ext.QuickTips.init(); // turn on validation errors beside the field globally Ext.form.Field.prototype.msgTarget = 'side'; var fs2 = new Ext.FormPanel({ labelAlign: 'right', frame:false, monitorValid:true, bodyStyle:'background-color:transparent', hideBorders :true, border :false, width: 640, labelWidth : 200, waitMsgTarget: true, items: [ { layout:'column', hideBorders :true, frame:false, bodyStyle:'background-color:transparent', hideBorders :true, border :false, items:[{ columnWidth:.8, layout: 'form', frame:false, bodyStyle:'background-color:transparent', hideBorders :true, border :false, items: [{ xtype:'textfield', name:'first', fieldLabel:'Naam bedrijf', allowBlank:false, validateOnBlur :true, anchor:'94%' }] },{ columnWidth:.2, layout: 'form', frame:false, bodyStyle:'background-color:transparent', hideBorders :true, border :false, items: [{ xtype:'label', text : '*', style :'margin-left:20px;color:red', anchor:'30%' }] }] }, { layout:'column', hideBorders :true, frame:false, bodyStyle:'background-color:transparent', hideBorders :true, border :false, items:[{ columnWidth:.8, bodyStyle:'background-color:transparent', layout: 'form', items: [{ xtype:'textfield', name:'last', fieldLabel: 'Naam afzender', allowBlank:false, validateOnBlur :true, anchor:'94%' }] },{ columnWidth:.2, layout: 'form', frame:false, bodyStyle:'background-color:transparent', hideBorders :true, border :false, items: [{ xtype:'label', text : '*', style :'margin-left:20px;color:red', anchor:'20%' }] }] }, { xtype:'textfield', name:'street', fieldLabel:'Straatnaam', anchor:'75%' }, { layout:'column', hideBorders :true, frame:false, bodyStyle:'background-color:transparent', hideBorders :true, border :false, items:[{ columnWidth:.5, layout: 'form', frame:false, bodyStyle:'background-color:transparent', hideBorders :true, border :false, items: [{ xtype:'textfield', fieldLabel: 'Huisnr', name: 'huisnr', anchor:'95%' }] },{ columnWidth:.5, layout: 'form', frame:false, bodyStyle:'background-color:transparent', hideBorders :true, border :false, labelWidth : 50, items: [{ xtype:'textfield', fieldLabel: 'Postcode', name: 'postcode', anchor:'50%' }] }] }, { xtype:'textfield', name:'plaats', fieldLabel:'Plaats', anchor:'75%' },{ xtype:'combo', anchor:'75%', fieldLabel: 'Land', name: 'land', disabled : false, width: 180, displayField:'land', valueField : 'land', triggerAction : 'all', mode : 'local', store : new Ext.data.SimpleStore({ fields :['land'], data : [ ['Afghanistan'], ['Albania'], ['Algeria'], ['Andorra'], ['Angola'], ['Antigua & Deps'], ['Argentina'], ['Armenia'], ['Australia'], ['Austria'], ['Azerbaijan'], ['Bahamas'], ['Bahrain'], ['Bangladesh'], ['Barbados'], ['Belarus'], ['Belgium'], ['Belize'], ['Benin'], ['Bhutan'], ['Bolivia'], ['Bosnia Herzegovina'], ['Botswana'], ['Brazil'], ['Brunei'], ['Bulgaria'], ['Burkina'], ['Burundi'], ['Cambodia'], ['Cameroon'], ['Canada'], ['Cape Verde'], ['Central African Rep'], ['Chad'], ['Chile'], ['China'], ['Colombia'], ['Comoros'], ['Congo'], ['Congo {Democratic Rep}'], ['Costa Rica'], ['Croatia'], ['Cuba'], ['Cyprus'], ['Czech Republic'], ['Denmark'], ['Djibouti'], ['Dominica'], ['Dominican Republic'], ['East Timor'], ['Ecuador'], ['Egypt'], ['El Salvador'], ['Equatorial Guinea'], ['Eritrea'], ['Estonia'], ['Ethiopia'], ['Fiji'], ['Finland'], ['France'], ['Gabon'], ['Gambia'], ['Georgia'], ['Germany'], ['Ghana'], ['Greece'], ['Grenada'], ['Guatemala'], ['Guinea'], ['Guinea-Bissau'], ['Guyana'], ['Haiti'], ['Honduras'], ['Hungary'], ['Iceland'], ['India'], ['Indonesia'], ['Iran'], ['Iraq'], ['Ireland {Republic}'], ['Israel'], ['Italy'], ['Ivory Coast'], ['Jamaica'], ['Japan'], ['Jordan'], ['Kazakhstan'], ['Kenya'], ['Kiribati'], ['Korea North'], ['Korea South'], ['Kosovo'], ['Kuwait'], ['Kyrgyzstan'], ['Laos'], ['Latvia'], ['Lebanon'], ['Lesotho'], ['Liberia'], ['Libya'], ['Liechtenstein'], ['Lithuania'], ['Luxembourg'], ['Macedonia'], ['Madagascar'], ['Malawi'], ['Malaysia'], ['Maldives'], ['Mali'], ['Malta'], ['Marshall Islands'], ['Mauritania'], ['Mauritius'], ['Mexico'], ['Micronesia'], ['Moldova'], ['Monaco'], ['Mongolia'], ['Montenegro'], ['Morocco'], ['Mozambique'], ['Myanmar, {Burma}'], ['Namibia'], ['Nauru'], ['Nepal'], ['Netherlands'], ['New Zealand'], ['Nicaragua'], ['Niger'], ['Nigeria'], ['Norway'], ['Oman'], ['Pakistan'], ['Palau'], ['Panama'], ['Papua New Guinea'], ['Paraguay'], ['Peru'], ['Philippines'], ['Poland'], ['Portugal'], ['Qatar'], ['Romania'], ['Russian Federation'], ['Rwanda'], ['St Kitts & Nevis'], ['St Lucia'], ['Saint Vincent & the Grenadines'], ['Samoa'], ['San Marino'], ['Sao Tome & Principe'], ['Saudi Arabia'], ['Senegal'], ['Serbia'], ['Seychelles'], ['Sierra Leone'], ['Singapore'], ['Slovakia'], ['Slovenia'], ['Solomon Islands'], ['Somalia'], ['South Africa'], ['Spain'], ['Sri Lanka'], ['Sudan'], ['Suriname'], ['Swaziland'], ['Sweden'], ['Switzerland'], ['Syria'], ['Taiwan'], ['Tajikistan'], ['Tanzania'], ['Thailand'], ['Togo'], ['Tonga'], ['Trinidad & Tobago'], ['Tunisia'], ['Turkey'], ['Turkmenistan'], ['Tuvalu'], ['Uganda'], ['Ukraine'], ['United Arab Emirates'], ['United Kingdom'], ['United States'], ['Uruguay'], ['Uzbekistan'], ['Vanuatu'], ['Vatican City'], ['Venezuela'], ['Vietnam'], ['Yemen'], ['Zambia'], ['Zimbabwe'] ] }) },{ // xtype:'textfield', // name:'tel', // fieldLabel:'Tel.nr', // anchor:'45%' layout: 'column', hideBorders: true, frame: false, bodyStyle: 'background-color:transparent', hideBorders: true, border: false, items: [{columnWidth: .6, layout: 'form', frame: false, bodyStyle: 'background-color:transparent', hideBorders: true, border: false, items: [{ xtype: 'textfield', name: 'tel', fieldLabel: 'Tel.nr', allowBlank: false, validateOnBlur: true, anchor: '100%'}] }, { columnWidth: .3, layout: 'form', frame: false, bodyStyle: 'background-color:transparent', hideBorders: true, border: false, items: [{ xtype: 'label', text: '*', style: 'margin-left:20px;color:red', anchor: '100%'}] }] }, { xtype:'textfield', name:'fax', fieldLabel:'Fax nr', anchor:'45%' }, { xtype:'textfield', name:'email', fieldLabel:'E-mail', vtype:'email', anchor:'75%' },{ xtype:'textfield', name:'interest', fieldLabel:'Interesse in', anchor:'75%' },{ xtype:'datefield' , name:'date', fieldLabel:'Datum', format:'d/m/Y', anchor:'75%' },{ xtype:'textfield', name:'tijd', fieldLabel:'Tijd', anchor:'75%' },{ xtype:'textfield', name:'duur', fieldLabel:'Duur', anchor:'75%' },{ xtype:'textfield', name:'aantal', fieldLabel:'Aantal deelnemers', anchor:'75%' },{ xtype:'textfield', name:'locatie', fieldLabel:'Locatie', anchor:'75%' },{ xtype:'textfield', name:'ovp', fieldLabel:'Onderdeel van programma', anchor:'75%' },{ xtype:'textfield', name:'tgv', fieldLabel:'Ter gelegenheid van ', anchor:'75%' },{ xtype:'textfield', name:'tvdd', fieldLabel:'Thema van de dag', anchor:'75%' },{ xtype:'textfield', name:'budget', fieldLabel:'Budget', anchor:'75%' },{ xtype:'combo', anchor:'75%', fieldLabel: 'Moreballs.com gevonden via', name: 'mgv', disabled : false, width: 180, displayField:'mgv', valueField : 'mgv', triggerAction : 'all', mode : 'local', store : new Ext.data.SimpleStore({ fields :['mgv'], data : [ ['google.nl'], ['via een andere zoekmachine'], ['via een link op een andere site'], ['via een collega'], ['via kennissen, vrienden of familie'], ['via een advertentie'], ['ik heb jullie ergens zien optreden'], ['al surfend'], ['anders'] ] }) }, { xtype:'textarea', name:'comments', fieldLabel:'Opmerking', width: 400, height:200, anchor:'100%' },{ layout:'column', hideBorders :true, frame:false, bodyStyle:'background-color:transparent', hideBorders :true, border :false, items:[{ columnWidth:.7, layout: 'form', frame:false, bodyStyle:'background-color:transparent', hideBorders :true, border :false, items: [ new Ext.ux.ImageButton({ imgPath : '/Assets/Images/MBTM-new_13.gif', imgWidth : 87, imgHeight : 18, formBind:true, style:'margin-left:250px', tooltip : 'submit', handler: function(){ fs2.getForm().submit({ url:'/MBTM_CONTACT_SENDMAIL.aspx', params :{isLong:true}, waitMsg:'Sending Data...', success:function(){ Ext.Msg.alert('Status', 'Uw bericht is verzonden ..', function(btn, text){ if (btn == 'ok'){ //var redirect = 'test.asp'; //window.location = redirect; } }); }, failure:function(form, action){ if(action.failureType == 'server'){ obj = Ext.util.JSON.decode(action.response.responseText); Ext.Msg.alert('Failed!', obj.errors.reason); }else{ Ext.Msg.alert('Warning!', 'Please check the form again ' ); } } })} }) ] },{ columnWidth:.3, layout: 'form', frame:false, bodyStyle:'background-color:transparent', hideBorders :true, border :false, items: [ new Ext.ux.ImageButton({ imgPath : '/Assets/Images/MBTM-contact_11.gif', imgWidth : 87, imgHeight : 18, style:'margin-left:30px;', tooltip : 'clear', handler: function(){ fs2.getForm().reset(); } }) ] }] }] }); fs2.render('contactform'); } function extjsContactInit(){ initializeGMap(); if(document.getElementById('form-ct'))createEmailForm(); if(document.getElementById('contactform'))createEmailForm2(); }