Posted At : December 3, 2008 11:42 PM | Posted By : todd sharp
Related Categories:
ColdFusion,
Ajax,
Ext
I received what seemed like a pretty simple question today given my background with ColdFusion 8 Ajax:
I've been looking for a way to simply eliminate the shadow on a cfwindow. The closest thing I could find so far is in your example of using ext to fade the window in/out, but is there a way I could do it with just css since I don't need the fade effect?
[More]
Posted At : April 7, 2008 5:29 PM | Posted By : todd sharp
Related Categories:
Ext,
ColdFusion,
Ajax
A few weeks ago Dan Vega blogged about creating a comboxbox (drop down) cell editor for the editable <cfgrid> before he realized that cfgrid supports in cell drop downs. I commented that I'd like to see something like a date picker cell editor and after using Dan's orginal code as inspiration and some hints from this post by Scott Bennett I finally got the thing working. Yes, I do realize that sometimes it'd just be easier to roll your own Ajax widget from scratch, but sometimes hacking it is more fun.
I'll leave it to Dan and Scott's original posts to explain the details, but here is what you'll end up with:
And here's the code:
<cfsetting showdebugoutput="false">
<cfajaximport tags="cfinput-datefield" />
<html>
<head>
<title>Edit Artist Grid</title>
<link href="/CFIDE/scripts/ajax/ext/resources/css/ytheme-aero.css" rel="stylesheet" type="text/css">
<style>
.x-menu-list{
margin: 0px; padding: 0px;
}
</style>
<script type="text/javascript" src="/CFIDE/scripts/ajax/ext/ext-all.js"></script>
<script type="text/javascript">
function init(){
//grid object
grid = ColdFusion.Grid.getGridObject("ArtistGrid");
//column model
cm = grid.getColumnModel();
//we need to know the column id
stIndex = cm.findColumnIndex("LASTMODIFIED");
var df = new Ext.grid.GridEditor(
new Ext.form.DateField(
{
format: 'm/d/Y',
minValue: '04/01/08',
}
)
);
cm.setEditor(stIndex, df);
cm.setRenderer(stIndex, Ext.util.Format.dateRenderer('m/d/Y'));
grid.reconfigure(grid.getDataSource(),cm);
}
</script>
</head>
<body>
<cfquery name="getArtists" datasource="cfartgallery">
SELECT artistId, firstname, lastname, address, city, state,
postalcode, email, '04/01/2008' as lastModified
FROM Artists
</cfquery>
<cfset args = structNew()>
<cfset args.name = "ArtistGrid">
<cfset args.format = "html">
<cfset args.query = "getArtists">
<cfset args.stripeRows = true>
<cfset args.selectColor = "##D9E8FB">
<cfset args.selectmode = "edit">
<cfset args.onchange = "cfc:artists.editArtist({cfgridaction},{cfgridrow},{cfgridchanged})">
<cfform>
<cfgrid attributeCollection="#args#">
<cfgridcolumn name="artistid" display="false">
<cfgridcolumn name="firstname" header="First Name">
<cfgridcolumn name="lastname" header="Last Name">
<cfgridcolumn name="address" header="Address">
<cfgridcolumn name="city" header="City">
<cfgridcolumn name="state" header="State">
<cfgridcolumn name="postalcode" header="Zip">
<cfgridcolumn name="lastModified" header="Last Modified">
</cfgrid>
</cfform>
<cfset ajaxOnLoad("init")>
</body>
</html>
Posted At : February 13, 2008 1:54 PM | Posted By : todd sharp
Related Categories:
Ext,
ColdFusion,
Ajax
Here's a quick example of how to add a functional minimize button to your CFWindow.
<script>
createWin = function(){
ColdFusion.Window.create('Window1', 'This is a CF window','win.cfm',{x:100,y:100,height:300,width:400,modal:false,closable:true,collapsible:true,draggable:true,resizable:true,center:true,initshow:true})
//get the Ext window object
var w = ColdFusion.Window.getWindowObject('Window1');
//add the class for the collapse button
w.collapseBtn = w.toolbox.createChild({cls:"x-dlg-collapse"});
//add a listener for the collapse click
w.collapseBtn.on("click", w.collapseClick, w);
//add the class to swap the image on mouse over
w.collapseBtn.addClassOnOver("x-dlg-collapse-over");
}
</script>
<cfset ajaxOnLoad('createWin') />
Demo
A reader (ironically named Todd) commented on my post yesterday:
I'd also like to see some discussion about Ext vs. Spry.
Dreamweaver CS3 seems to have settled on Spry while CF8 has settled on Ext (1.0). Apparently, Adobe divisions do not talk to each other.
I can't decide between them. I find Ext (at least teh 1.0 version used in CF) to be difficult and frustrating to use. Prototype.js was easy. I haven't yet tried Spry.
[More]
Posted At : September 3, 2007 8:08 AM | Posted By : todd sharp
Related Categories:
Ext,
Ajax
I was just browsing the Ext Extensions labs and I have to say I'm quite impressed. Some of these things are not quite ready for prime time, but will be very useful when they are finally released. Of particular interest to me are the FileTree Widget (check out that right click (context) menu!) and the Upload Form.
Posted At : September 2, 2007 12:07 PM | Posted By : todd sharp
Related Categories:
ColdFusion,
Ajax,
Ext
Almost a month ago I blogged about using Spry effects on a cfwindow. While it was a cool proof of concept, it left a bit to be desired in my opinion. First off there was no fade out effect - just a fade in. Secondly the thing really didn't work quite as expected in IE - go figure. I've been trying to get some time here and there to revisit the topic and finally have a solution that I'm pretty happy with.
[More]
