Some cold fusion cfqueryparam / extjs form field tips for xtype numberfield

If you code in cold fusion you should be using cfqueryparam when you are inputting data into your back end database, that’s a given as it is pretty effective against sql injection hacks, but when you do this you run the risk of throwing errors that you never worried about previously. The two most common problems are maxlength violations, and null value errors in numeric fields, to handle these two issues in your Extjs project I suggest the following approach:

Client Side Considerations:

Always use the xtype:numberfield, or the Ext.form.field.Number input control.

Make sure that you set a valid minValue, or it will default to negative infinity, and you may also need to set a maxValue if you do not want the user to enter a number greater than the ceiling on the data type.

Remember that decimals are allowed by default, so if you want to store the input in an integer field make sure you set allowDecimals to false.
Decide if this is a required field, if so set allowBlank to false to make sure that the user enters a number before submitting the field.

Server Side Considerations:

When you always want a value in the database field (for example a price or quantity field) — Always use cold fusion’s val() function around your input variables as it will convert the numeric characters at the beginning of a string to a number, but, will replace the value with a zero if there are leading characters, meaning the end result is you will always get a valid number in your number field. See the code below.

UPDATE  some_table
SET 
some_currency_value  = <cfqueryparam cfsqltype="cf_sql_float"		value="#val(some_user_input_data)#"	/>

In the example above if some_user_input_data was set to XYZ6563 then the code above would set the value zero. If the numbers were in front of the letters then the letters would be removed and the value entered into database would be 6563 and XYZ would be left off.

When you may actually want a null in the database field – If you do not want to use the val() function but still want to prevent invalid data input from causing cold fusion errors on the back end of your application you can use the IsValid() function coupled with the null attribute in cfqueryparam and ensure that your invalid values insert a null into the field.

Here’s how and why.

UPDATE  some_table
SET 
some_int_value  = <cfqueryparam cfsqltype="cf_sql_integer" 	
value="# some_user_input_data #"
 null="#not IsValid('integer', some_user_input_data)#"  />

The null attribute is looking for a yes or a no, a 1 or a 0 to tell it to ignore the value in the value field and just put the NULL into the database using not in front will reverse the 1 or zero that the Isvalid function returns thus telling cold fusion to place a NULL in the database when the value passed was not a valid integer. You can take a look at more features of the IsValid function here.

There you have it, some tips on keeping your number field values in place and ensuring that the integrity of your back end data stays sound.

Wow, Mythbusters banned from talking about RFID chip by credit card companies

Wow, take a look at this, if you didn’t know credit cards have embedded RFID tags, but just how secure is the data embedded in these tags? Take a look below;

How CAPTCHA changed the world, what will next?

This is a really great video that highlights how you can leverage a solution to one problem for others with a little creativity, and also demonstrates the amount of work that can be accomplished if you pool resources and time across the web. Think about it, what problems have you solved lately, and could there be multiple applications for the solution?

Adding a tooltip on startup to your extjs application

OK, so I have put some buttons on the screen and I want the user to notice them on startup, but what I do not want to do is call a lot of attention to something by popping up a box and making them close it, or hindering their ability to just get started with the app. The solution it seems is to create a quick tip and show it next to the control on startup. In this instance it’s the help button, which often gets overlooked on Ext grids if you use the built in ‘tools’ like those in the image below.

Fisrt, make sure quick tips is initialized by placing the following code at the start of the application:

Ext.tip.QuickTipManager.init();

Second you have to create your tooltip. The code below will create the exact tip pictured above. I place this code at the very bottom of my app so it is created last, you will notice that in target I have placed the id of the tool item from my grid (that’s the little question mark icon above, in plain English), you could, however, choose any item in your application just placing it’s ID in the target value to get your tip to show up there.

var tip = Ext.create('Ext.tip.QuickTip', {
		id:'ttp_t_hlp',
		target: 'help_toolip',
		bubbleEvents:['add','remove','show','hide'],
		html: 'Did you know? If you ever need help these buttons are located on every grid!',
		width: 200,
		height: 125,
		closable:true,
		bodyStyle: {
			    background: '#00cc00',
				'font-size':'16px',
				color:'#FFF',
    			padding: '10px'
			},
		anchor:'bottom',
		dismissDelay: 15000 // Hide after 10 seconds hover
	});
	
	tip.show();

Finally, I will want to show the tip, and then create a delayed task that will hide the tooltip after about 8 seconds so the user does not have to stop and click the x in the corner, so I add the following code that contains the show event and a delayed task containing a hide event.

	tip.show();

	var tip_hide_task = new Ext.util.DelayedTask(function(){
    		tip.hide();
	});
	tip_hide_task.delay(8000);

How about hiding the number selector on the new extjs 4 numberfield?

You probably started coding in Extjs 4 by now, and one of the things that you should have noticed is that the number field control now has a trigger built in that increases or decreases the value in the field when you press it. Every customer that I have worked with since the introduction of extjs4 has requested that this new feature be removed, so here is the config for the job.

	// add this in the numberfield config
	hideTrigger:true