Gelmiş geçmiş en büyük porno sitemiz olan 2pe de her zaman en kaliteli pornoları sunmayı hedefledik. Diğer video sitemiz olan vuam da ise hd porno ağırlıklı çalışmalara başladık.

  1. #1
    Ext User
    Join Date
    Jun 2009
    Posts
    4
    Vote Rating
    0
    Monk_18 is on a distinguished road

      0  

    Default Combobox Renderers Not working on EditableGrid Store Reload

    Combobox Renderers Not working on EditableGrid Store Reload


    Hello All,
    I'm verry new to extjs and am trying to create a very simple editablegrid that has mostly static stores to comboboxes all related to a dynamic store of rows... Basically I am having an issue when I update, I clear the main dynamic store and requerry the results... however the issue comes when I reload the store the comboboxes renderer doesn't appear to fire and show the text vs. value for the grid cells (cm renderer)... this appears to only happen on the entry of a new row, edits to existing cells appear correct. If someone could please give me some direction it would be greatly appreciated...

    my code is mostly a compilation of examples and forum help so any help that leads to better understanding of extjs is appreciated...

    Please note the page is created with simple coldfusion and preloads a filter type form that creates a window (containing the editable grid)

    I will post the majority of the code bleow...

    Code:
    <script
    type='text/javascript'>
    Ext
    .onReady(function(){ <!--- fixes --->
    Ext
    .override(Ext.grid.GridView, { syncFocusEl : Ext.emptyFn }); var fields = [ {name:'key', type:'string'}, {name:'value', type:'string'} ]; var storerecord = Ext.data.Record.create(fields); var datetogo ='3/15/2009'; var byJobFilter = [["0","Filter By Job..."],<cfoutput><cfloopquery="getChargeFilter">["#chgCode#","#chgCode#"],</cfloop></cfoutput>["",""]]; var byLocFilter = [["0","Filter By Location..."],<cfoutput><cfloopquery="getLocFilter">["#locKey#","#locName#"],</cfloop></cfoutput>["",""]]; var byDeptFilter = [["0","Filter By Department..."],<cfoutput><cfloopquery="getDeptFilter">["#deptKey#","#department#"],</cfloop></cfoutput>["",""]]; var byTravelerFilter = [["0","Filter By Traveler..."],<cfoutput><cfloopquery="getTravelersFilter">["#empKey#","#empName#"],</cfloop></cfoutput>["",""]]; var byERStatFilter = [["-1","Filter By Expense Report Status..."],["0","No"],["1","Completed"]]; var bycarFilter = [["-1","Filter By Car Rental Status..."],["0","No"],["1","Yes"]]; var bybookedFilter = [["-1","Filter By Booking Status..."],["0","Company"],["1","Self"]]; var byJob =new Ext.data.SimpleStore({ fields: fields, data: [<cfoutput><cfloopquery="getChargeCodes">["#SELECTTEXT#",<cfif SELECTTEXT IS"0000">"Overhead"<cfelse>"#SELECTTEXT#"</cfif>],</cfloop>["",""]</cfoutput>] }); var byLoc =new Ext.data.SimpleStore({ fields: fields, data: [<cfoutput><cfloopquery="getLocations">["~#Key#~","#Value#"],</cfloop>["~0~",""]</cfoutput>] }); var byTraveler =new Ext.data.SimpleStore({ fields: fields, data: [<cfoutput><cfloopquery="getTravelers">["~#Key#~","#Value#"],</cfloop>["~0~",""]</cfoutput>] }); var byStates =new Ext.data.SimpleStore({ fields: fields, data: [<cfoutput><cfloopquery="getStates">["#SELECTTEXT#","#SELECTVALUE#"],</cfloop>["",""]</cfoutput>] }); var byCountries =new Ext.data.SimpleStore({ fields: fields, data: [<cfoutput><cfloopquery="getCountry">["#SELECTTEXT#","#SELECTVALUE#"],</cfloop>["",""]</cfoutput>] }); var byCar =new Ext.data.SimpleStore({ fields: fields, data: [["0","No"],["1","Yes"],["",""]] }); var byBooked =new Ext.data.SimpleStore({ fields: fields, data: [["0","Company"],["1","Self"],["",""]] }); var deleterow =new Ext.data.SimpleStore({ fields: fields, data: [["","No"],["X","Delete"]] }); Ext.QuickTips.init(); function formatDate(value){ return value ? value.dateFormat('m/d/y') :''; }; // shorthand alias
    var fm = Ext.form; // the column model has information about grid columns
    var cm =new Ext.grid.ColumnModel([{ id:'pkey', header:"Primary", dataIndex:'pkey', width:10, hidden:true
    },{ id
    :'name', header:"Traveler", dataIndex:'name', width:120, editor:new Ext.form.ComboBox({ typeAhead:true, store: byTraveler, mode:'local', displayField:'value', valueField:'key', triggerAction:'all', lazyRender:true, lazyInit:false, listClass:'x-combo-list-small', emptyText:'Select A Traveler...'
    }), renderer
    :function(value){ var index = byTraveler.find("key",value,0); if (index !=-1){ var typeName = byTraveler.getAt(index).get("value"); return typeName ? typeName :'Select A Traveler...';} else
    {
    if (value !="") return value; else
    return'Select A Traveler...';} } },{ id:'project', header:"ChargeCode", dataIndex:'project', width:100, editor:new Ext.form.ComboBox({ typeAhead:true, store: byJob, mode:'local', displayField:'value', valueField:'key', triggerAction:'all', lazyRender:true, lazyInit:false, listClass:'x-combo-list-small', emptyText:'Select A Job...'
    }), renderer
    :function(value){ if (value =="0000"|| value =="") return'OverHead'; else
    return value; } },{ id:'departdt', header:"Departure Date", dataIndex:'departdt', width:110, renderer: formatDate, editor:new fm.DateField({ format:'m/d/y', minValue:'01/01/05'
    }) },{ id
    :'returndt', header:"Return Date", dataIndex:'returndt', width:110, renderer: formatDate, editor:new fm.DateField({ format:'m/d/y', minValue:'01/01/05'
    }) },{ id
    :'location', header:"Destination", dataIndex:'location', width:120, editor:new Ext.form.ComboBox({ typeAhead:true, store: byLoc, mode:'local', displayField:'value', valueField:'key', triggerAction:'all', lazyRender:true, lazyInit:false, listClass:'x-combo-list-small', emptyText:'Select A Destination...'
    }), renderer
    :function(value){ var index = byLoc.find("key",value,0); if (index !=-1){ var typeName = byLoc.getAt(index).get("value"); return typeName ? typeName :'Select A Destination...';} else
    {
    if (value !="") return value; else
    return'Select A Destination...';} } },{ id:'car', header:"Car Rental", dataIndex:'car', width:65, editor:new Ext.form.ComboBox({ typeAhead:true, store: byCar, mode:'local', displayField:'value', valueField:'key', triggerAction:'all', lazyRender:true, lazyInit:false, listClass:'x-combo-list-small', emptyText:'Select A Car Rental Status...'
    }), renderer
    :function(value){ if (value ==""|| value ==0) return"No"; else
    return"Yes"; } },{ id:'booked', header:"Booked By", dataIndex:'booked', width:65, editor:new Ext.form.ComboBox({ typeAhead:true, store: byBooked, mode:'local', displayField:'value', valueField:'key', triggerAction:'all', lazyRender:true, lazyInit:false, listClass:'x-combo-list-small', emptyText:'Select A Booking Status...'
    }), renderer
    :function(value){ if (value ==""|| value ==0) return"Company"; else
    return"Self"; } },{ id:'note', header:"Note", dataIndex:'note', width:200, editor:new fm.TextField({ allowBlank:true
    }) },{ id
    :'deleter', header:"Delete?", dataIndex:'deleter', width:50, editor:new Ext.form.ComboBox({ typeAhead:true, store: deleterow, mode:'local', displayField:'value', valueField:'key', triggerAction:'all', lazyRender:true, lazyInit:false, listClass:'x-combo-list-small'
    }), renderer
    :function(value){ if (value =="X") return"Delete"; else
    return""; }, hidden:true
    } ]);
    // Form panel For Filters...
    var simple =new Ext.FormPanel({ labelAlign:'right', align:'center', frame:true, title:'Query Form', header:false, width:600, autoHeight:true, listeners: {activate:function(){disablegrid();}}, items: [{ layout:'column', title:'Please Select Date Ranges and Filters as Necessary, then Click Go...', items:[{ columnWidth:.5, layout:'form', align:'center', items: [{ xtype:'label', autoWidth:true, height:40, html: '<BR>Select Date Range For Report<BR>'
    },{ xtype
    :'datefield', labelWidth:'10%', fieldLabel:'Starts After', name:'dateFrom', id:'dateFrom', anchor:'90%', labelPad:0
    },{ xtype
    :'datefield', labelWidth:'10%', fieldLabel:'Ends Prior To', name:'dateTo', id:'dateTo', anchor:'90%', labelPad:0
    }] },{ columnWidth:
    .5, layout:'form', items: [{ xtype:'label', autoWidth:true, height:40, html: '<BR>Select Filters to Apply to the Report<BR>'
    },{ xtype
    :'combo', hideLabel:true, store: byJobFilter, typeAhead:true, mode:'local', triggerAction:'all', emptyText:'Filter By Job...', selectOnFocus:true, name:'jobFilter', id:'jobFilter', anchor:'90%'
    },{ xtype
    :'combo', hideLabel:true, store: byLocFilter, typeAhead:true, mode:'local', triggerAction:'all', emptyText:'Filter By Location...', selectOnFocus:true, name:'locFilter', id:'locFilter', anchor:'90%'
    },{ xtype
    :'combo', hideLabel:true, store: byDeptFilter, typeAhead:true, mode:'local', triggerAction:'all', emptyText:'Filter By Department...', selectOnFocus:true, name:'dptFilter', id:'dptFilter', anchor:'90%'
    },{ xtype
    :'combo', hideLabel:true, store: byTravelerFilter, typeAhead:true, mode:'local', triggerAction:'all', emptyText:'Filter By Traveler...', selectOnFocus:true, name:'empFilter', id:'empFilter', anchor:'90%'
    },{ xtype
    :'combo', hideLabel:true, store: byERStatFilter, typeAhead:true, mode:'local', triggerAction:'all', emptyText:'Filter By Expense Report Status...', selectOnFocus:true, name:'expRptFilter', id:'expRptFilter', anchor:'90%'
    },{ xtype
    :'combo', hideLabel:true, store: bycarFilter, typeAhead:true, mode:'local', triggerAction:'all', emptyText:'Filter By Car Rental Status...', selectOnFocus:true, name:'carFilter', id:'carFilter', anchor:'90%'
    },{ xtype
    :'combo', hideLabel:true, store: bybookedFilter, typeAhead:true, mode:'local', triggerAction:'all', emptyText:'Filter By Booking Status...', selectOnFocus:true, name:'bookingFilter', id:'bookingFilter', anchor:'90%'
    }] }] }], buttons
    :[{ text :'Go', id :'Go', handler :function(){ // remove the store...
    store
    .removeAll(); // run the store with passed parameters....
    if (Ext.getCmp("dateFrom").getValue() !='') var dtfr = Ext.getCmp("dateFrom").getValue().format("m/d/Y"); else
    var dtfr =''; if (Ext.getCmp("dateTo").getValue() !='') var dtto = Ext.getCmp("dateTo").getValue().format("m/d/Y"); else
    var dtto =''; store.reload({ params: { dateFrom: dtfr, dateTo: dtto, jobFilter: Ext.getCmp("jobFilter").getValue(), locFilter: Ext.getCmp("locFilter").getValue(), dptFilter: Ext.getCmp("dptFilter").getValue(), empFilter: Ext.getCmp("empFilter").getValue(), expRptFilter: Ext.getCmp("expRptFilter").getValue(), carFilter: Ext.getCmp("carFilter").getValue(), bookingFilter: Ext.getCmp("bookingFilter").getValue() } }); grid.doLayout(); grid.render(); win.show(); } },{ text :'Reset', handler :function(){ // remove the store...
    store
    .removeAll(); // clear all form fields...
    simple
    .form.reset(); } }] }); // create access to the form fields and set base values...
    Ext
    .getCmp("jobFilter").setValue(0); Ext.getCmp("locFilter").setValue(0); Ext.getCmp("dptFilter").setValue(0); Ext.getCmp("empFilter").setValue(0); Ext.getCmp("carFilter").setValue(-1); Ext.getCmp("bookingFilter").setValue(-1); Ext.getCmp("expRptFilter").setValue(-1); <cfoutput>
    <cfif SESSION.isAdmin>
    Ext
    .getCmp("dateFrom").setValue('#DateFormat(DateAdd('w',-2,Now()),'MM/DD/YYYY')#'); <cfelse>
    Ext
    .getCmp("dateFrom").setValue(''); </cfif>
    </cfoutput>
    Ext
    .getCmp("dateTo").setValue(''); // by default columns are sortable
    cm
    .defaultSortable =true; // tick record creation for
    // type so we can add records dynamically
    var ticket = Ext.data.Record.create([ {id:'pkey', name:'pkey', type:'int'}, {id:'name', name:'name', type:'string', sortType: cm.lookup.name.renderer, renderer: cm.lookup.name.renderer}, {id:'project', name:'project', type:'string', sortType: cm.lookup.project.renderer, renderer: cm.lookup.project.renderer}, {id:'departdt', name:'departdt', type:'date', dateFormat:'m/d/Y'}, {id:'returndt', name:'returndt', type:'date', dateFormat:'m/d/Y'}, {id:'location', name:'location', type:'string', sortType: cm.lookup.location.renderer, renderer: cm.lookup.location.renderer}, {id:'car', name:'car', type:'string', renderer: cm.lookup.car.renderer}, {id:'booked', name:'booked', type:'string', renderer: cm.lookup.booked.renderer}, {id:'note', name:'note', type:'string'}, {id:'deleter', name:'deleter', type:'string', renderer: cm.lookup.deleter.renderer} ]); // create the Data Store
    var store =new Ext.data.Store({ url:'travelspryproxy.cfm', baseParams: {dostep:5}, pruneModifiedRecords :true, // the return will be XML, so lets set up a reader
    reader
    :new Ext.data.XmlReader({ record:'traveler'
    }, ticket) });
    // create the editor grid
    var grid =new Ext.grid.EditorGridPanel({ region:'center', layout:'fit', store: store, deferRowRender:false, cm: cm, width:900, autoWidth:true, autoShow:false, height:300, frame:false, clicksToEdit:1, autoExpandColumn:'project'
    });
    //function to update the dirty grid fields...
    fireChanges
    =function(){ var data = []; Ext.each(grid.getStore().getModifiedRecords(), function(record){ data.push(record.data); }); store.removeAll(); Ext.Ajax.request({ url:'commonFunctions.cfc?method=updateTravelfromGrid', params: {data: Ext.encode(data)}, success:function(){ store.reload(); }, failure:function(){ store.reload(); } }); //grid.doLayout();
    grid
    .render(); } //define toolbar area..
    var tb = grid.getTopToolbar(); //grid listeners..
    grid
    .on('afteredit', function(e) { // make sure dirty turns that save button on... later
    });
    //the window...
    var win =new Ext.Window({ title :'Add/Edit Travelers Spanning the given Date', closable :true, closeAction:'hide', modal :true, width :950, height :450, plain :true, layout :'border', items : grid, buttons : [{ name:'AddBtn', id:'AddBtn', text:'Add A Travel Record', xtype:'button', handler :function(){ var tick =new ticket({ pkey:0, name:"", project:"", departdt:new Date(datetogo), returndt:new Date(datetogo), location:"", car:"", booked:"", note:"", deleter:""
    }); store
    .insert(store.getTotalCount(), tick); } },{ name:'SaveBtn', id:'SaveBtn', text:'Save Changes to Travel Records', xtype:'button', handler :function(){ fireChanges(); } },{ name:'LocBtn', id:'LocBtn', text:'Add a Location', xtype:'button', handler :function(){ locadd.show(); } }] }); // add window listeners...
    win
    .on('hide', function() { store.removeAll(); }); // window call to load store and show window for given date...
    fireAdd
    =function( dateval ) { datetogo = dateval; store.reload(); grid.doLayout(); grid.render(); win.setTitle('Add/Edit Travelers Spanning the Date: '+ dateval); win.show(); } //the window...
    var locadd =new Ext.Window({ title :'Add a New Location', closable :true, closeAction:'hide', modal :true, width :400, height :300, plain :true, items: [ new Ext.FormPanel({ frame:true, id:'locform', name:'locform', fileUpload:true, autoHeight:true, defaultType:'textfield', labelWidth :120, items: [{ fieldLabel:'Name', name:'name', width:190
    }, { fieldLabel
    :'Address', name:'address', width:190
    }, { fieldLabel
    :'Address (Contd.)', name:'address2', width:190
    }, { fieldLabel
    :'City', name:'city', //vtype:'city',
    width
    :190
    },
    new Ext.form.ComboBox({ fieldLabel:'State', hiddenName:'state', store: byStates, valueField:'value', displayField:'key', typeAhead:true, mode:'local', triggerAction:'all', emptyText:'Select a state...', selectOnFocus:true, width:190
    }), { fieldLabel
    :'Zip', name:'zip', width:190
    },
    new Ext.form.ComboBox({ fieldLabel:'Country', hiddenName:'Country', store: byCountries, valueField:'value', displayField:'key', typeAhead:true, mode:'local', triggerAction:'all', emptyText:'Select a County...', selectOnFocus:true, width:190
    }), { fieldLabel
    :'Contact name', name:'contact', width:190
    }, { fieldLabel
    :'Contact EMail', name:'contactmail', vtype:'email', width:190
    }, { fieldLabel
    :'Contact Phone', name:'contactphone', width:190
    } ] }) ], buttons
    : [{ text :'Submit', disabled :false, handler :function(){ fireLocation(); } },{ text :'Close', handler :function(){ locadd.hide(); } }] }); //function to update the dirty grid fields...
    fireLocation
    =function(){ // get the from values... if all blank skip...
    var formstuff = Ext.getCmp('locform'); var data = formstuff.form.getValues(); //alert(data);
    Ext
    .Ajax.request({ url:'commonFunctions.cfc?method=insertLocation', params: {data: Ext.encode(data)}, success:function(param1, param2){ //add to store....
    var jsonret = Ext.decode(param1.responseText); var thevalue = jsonret.VALUE; var thekey ='~'+ jsonret.KEY +'~'; byLoc.addSorted([new storerecord({key:thekey, value:thevalue})]); //close window....
    locadd
    .hide(); }, failure:function(){ //alert('failure');
    //close window....
    locadd
    .hide(); } }); } //final setup stuff
    //render the extjs to the page
    simple
    .render('TheQuery'); //if admin go ahead and fire the defaluts
    <cfoutput>
    <cfif SESSION.isAdmin>
    store
    .load({ params : { dateFrom:'#DateFormat(DateAdd('w',-2,Now()),'MM/DD/YYYY')#' } }); win.show(); </cfif>
    </cfoutput>
    });
    </script>

  2. #2
    Ext User
    Join Date
    Jun 2009
    Posts
    4
    Vote Rating
    0
    Monk_18 is on a distinguished road

      0  

    Default


    I may have found my issue... I will close the thread as soon as I verify,... My Ajax request that reloads the store was not completing proir to the grid.render()... the render needed to be inside the success and failure functions after the store reload...

  3. #3
    Ext User
    Join Date
    Jun 2009
    Posts
    4
    Vote Rating
    0
    Monk_18 is on a distinguished road

      0  

    Default


    I was incorrect... reloading the store after and update causes the ColumnModel Renerer to not run... Really not sure what to do here... any help is appreciated

  4. #4
    Ext User
    Join Date
    Jun 2009
    Posts
    4
    Vote Rating
    0
    Monk_18 is on a distinguished road

      0  

    Default


    Strange fix but I found it... ON Typeinselect on the Comboboxes the simplestores were being filtered on reload of the dynamic grid the renderers were running but only on the filtered simplestores... If I can figure out how... I will close this thread...