dans.blog


The miscellaneous ramblings and thoughts of Dan G. Switzer, II

After DOM manipulation, form fields won't post...

This is an issue I first ran into several years ago, but I've recently helped two different people who had the same problem and thought it was worthy of blogging.

If you run into a situation where form fields are not getting posted to the server after the DOM has been manipulated, check to make sure the <form/> element is in a valid location. If the <form/> tag resides as a direct child of either a <table/> or <tr/> element, then you will encounter problems posting the form once a child element of the <form/> element has been dynamically modified.

While this behavior does not occur in IE, it does happen in other modern browsers—such as Firefox and some WebKit-based browsers.

Any of the following will break your form post submission:

<table><form><tr> .... </tr></form></table>

<table><tr><form> .... </form></tr></table>

<table><tbody><form> ... </form></tbody></table>

To correct the problem, just place the <form/> tag outside of the <table/> tag:

<form><table><tr> ... </tr></table></form>

This type of markup usually appears on older sites, where I believe the intent of putting the <form/> tag inside the <table/> was to prevent any visual margins from being seen. Obviously, it's easy to remove the margins using CSS and this type of invalid markup can only come back to haunt you.

NOTE: You can do <table><tr><td><form> .... </form></td></tr></table>. That's perfectly valid HTML. You just need to make sure the <form/> tag is placed somewhere were visible text is allowed.


Refreshing Eclipse Workspace using ANT

I was looking for a way to programmatically refresh some specific folders in my workspace anytime I ran my ANT script. Eclipse provides several ant tasks that you can use for various purposes, once of which is the <eclipse.refreshLocal /> tag:

<eclipse.refreshLocal resource="MyProject/MyFolder" depth="infinite"/>
  • resource is a resource path relative to the workspace 
  • depth can be one of the following: zero, one or infinite

However, when I first tried adding this task to my ANT script, I was getting an error that looked like:

BUILD FAILED
c:\path\folder\build.xml:85: Problem: failed to create task or type eclipse.refreshLocal
Cause: The name is undefined.
Action: Check the spelling.

Needless to say, I was pretty confused. So after some brief research, it turns out I accidentally running ANT outside of the Eclipse JRE. To fix this, go open up the External Tools Dialog (Run > External Tools > Open External Tools Dialog...) and make sure the JRE tab is set to "Run in the same JRE as workspace."

image

I'm not sure how that setting got changed, but I'm glad I found the fix. This also has sped up the first time execution of my ANT scripts.


Akeem Havens, 14 year old quadriplegic, gets signed as a Steeler

Here's a video segment about Akeem Havens, a 14 year old quadriplegic who got his wish to play video games with Ben Roethlisberger. The Steelers FO office signed Akeem to a 1 day contract and he even got to practice with the Steelers team.


mcDropdown v1.2 released...

Addressing some more behavior issues being brought up (and adding a few new features,) Giva just released a new version of the mcDropdown plug-in:

  • Added focus() method
  • Fixed autocomplete list from showing dropdown when go back levels in FF3
  • Fixed autocomplete list corruption in when go back levels after using mouse
  • Added tabindex="-1" to the dropdown arrow (so it shouldn't recieve focus on tabbing)
  • Fixed tabbing behavior so hitting [TAB] should go to the next element in the tabindex
  • Autocomplete no longer shows (by default) if the input is empty and recieves focus (use the setting.showACOnEmptyFocus to control this behavior)
  • Added setting.showACOnEmptyFocus (used for controlling whether the autocomplete list shows on focus if list is empty; default = false)
  • Fixed noConflict() bug (where $ wasn't being properly scoped)


jQuery mcDropdown Plug-in updated to v1.1a

Just a quick note that over the weekend I updated the code to the jQuery mcDropdown Plug-in to v1.1a. The update contains:

  • Fixed Safari keyboard support
  • Added mouse support for keyboard autocomplete box
  • Menu mouseout behavior should be functioning better


Do not trust Google's link: operator

I've noticed this behavior for a while, but was just asked about this by a co-worker. The Google link: operator does not really work as most people expect and certainly not the way I originally expected it to work. Google has this to say about the link: operator:

The query [link:] will list webpages that have links to the specified webpage. For instance, [link:www.google.com] will list webpages that have links pointing to the Google homepage. Note there can be no space between the "link:" and the web page url.

Notice they don't explicitly say anything about the accuracy or volume that will be returned, just that it will return pages that have links. Well, that's not even really true. Sometimes it will return empty results (even when there are legitimate external links to a page (could be even thousands of links.)

If you're really trying to find external links to your site, the best method Google provides is via their Google Webmaster Tools (see How can I see links to my site?.) Even this method apparently won't reveal all external links, but it's much more accurate.

If you have any great tips for listing external links, make sure to share them in the comments.


Running Firefox 2 and Firefox 3 simultaneously

I've been running my different versions of Firefox under different profiles, that way I can keep each instance unique. This works great, but I still couldn't figure out how to open both Firefox 2 & 3 at the same time. Turns out I was missing the -no-remote command line parameter in my Firefox 3 shortcut.

Here's a great write up on how to run Firefox 2 and Firefox 3 simultaneously—which provides you with full instructions on setting your shortcuts up so you can run Firefox 2 & 3 at the same time.


Multicolumn Dropdown jQuery Plug-in Released!

Back in April, I posted a preview of a multicolumn dropdown plug-in I was developing for a project at work. Well today we finally officially released the mcDropdown plug-in. I was hoping to release the plug-in sooner, but other projects took precedence and releasing it just got delayed.

I'm really proud of the plug-in and think it provides a really unique form control.

Here's a list of the features:

  • Creates a multi-column hierarchical select UI component
  • Binds a text input field or div element to a list element (included nested lists)
  • Menus are automatically split into columns as needed
  • Menus are positioned to always stay on the screen
  • Autocomplete keyboard entry (only valid options are allowed)
  • Menu automatically scrolls into viewport when opened

You can view a live example over at the plug-in page.

mcDropdown jQuery Plug-in

If you like what you see, make sure to digg it.


Firefox 2 & 3 custom icons...

Now that Firefox 3 has been released, I really wanted a couple of icons that I could easily identify as either v2 or v3 for my Windows Quick Launch bar. Since I couldn't find any icons out there, I threw together 2 icons which just add the version as an overlay to the original Firefox icon.

I'm not a designer or artist, so I'm sure I could have selected better colors of green, but the contrast works well for what I needed. I can now clearly see which version of Firefox I'm getting ready to load up.

image

Hopefully someone else will find the icons useful.

Download Firefox 2 & 3 icons for Windows (.ico)


Firefox 3 finally released...

It looks like Firefox 3 is officially released. The servers are a bit overwhelmed at the moment, so you need to use a little perseverance to get the download pages to come up. I think there may be some delays in propagation of the actual Firefox 3 download page as well.


An unobtrusive way to say IE6 sucks...

Massimiliano Balestrieri posted a neat little script today in honor of Firefox 3 Download Day 2008. The concept is simple, change the appearance of the page in IE6 slightly by making it show up in black and white. So if you really want to protest IE6, this is a comical way to do it on your blog. I just find the effect hysterical.

/* * * Black'n'White plugin 1.0 * $Date: 2008-06-17 15:38:15 +0200 (mar, 17 giu 2008) $ * $Rev: 177 $ * @requires jQuery v1.2.6 * * Copyright (c) 2008 Massimiliano Balestrieri * Examples and docs at: http://maxb.net/blog/ * Licensed GPL licenses: * http://www.gnu.org/licenses/gpl.html * */ if(!window.BlacknWhite) var BlacknWhite = {}; BlacknWhite = { init : function(options) { options = jQuery.extend({minor : 7}, options); if(jQuery.browser.msie && jQuery.browser.version < options.minor) jQuery("html").css("filter","gray"); } }; jQuery(document).ready(function(){ BlacknWhite.init(); //BlacknWhite.init({minor : 8}); });

You'll need jQuery on your page to use this script (at least as-is) but it would be simple to adapt to either plain JS or another JS framework. The only thing really going on is it's setting a filter on the <html/> tag to show the whole page in gray.

I've added this script to this blog entry so you can easily view the effect.

more…


Pagination in MSSQL 2005

Paginating data is one of those commonly required tasks. In previous version of MS SQL Server it's been tricky to handle, but made easy via the use of stored procedures that handle the pagination logic for you. However, if you're using SQL Server 2005 there's a much easier way to handle pagination and that's to use a Common Expression Table (CTE.)

Microsoft created the CTE syntax to make solving complicated tasks easier (such as returning a query of hierarchical tree data.) When you create a CTE, you're essentially creating a virtual table you can query against. CTEs generally perform very well and can often replace the need for creating temp tables.

Let's look at an example of query out records 11-20 from a Employee database:

-- create the Common Table Expression, which is a table called "pagination" with pagination as ( -- your normal query goes here, but you put your ORDER BY clause in the rowNo declaration select row_number() over (order by department, employee) as rowNo, -- a list of the column you want to retrieve employeeId, employee, department from Employee where disabled = 0 ) -- we now query the CTE table select -- add an additional column which contains the total number of records in the query *, (select count(*) from pagination) as totalResults from pagination where RowNo between 11 and 20 order by rowNo

The first part of the query creates the table expression we'll actually query against when we grab the actual results from the database. In the CTE you're going to write the SQL you'd normally write to grab all the records with one exception—you use the row_number() function to generate a virtual column that orders your result rows for you. The actual "order by" clause you want to use will actually go in the row_number() declaration—this makes SQL Server assign the correct row number for each record.

It's important to remember that a CTE can be as complex as you need it to be. You can do joins, pivots, etc—whatever you need.

The next step is to actually query against the CTE you created. This query will virtually be the same for all pagination queries you write. You are simply grabbing all of the columns and then limiting the returned data to just the rows you want to display (in this case rows 11 - 20.)

In this example, I added an additional column that contains the total results that were returned from the CTE. This is not needed, but it's handy if you need to do something like "Results 11 - 20 of 4,567 records." There are many ways you could generate the total records, this is just one method.

If you've upgraded to SQL Server 2005 and haven't started using CTEs yet, you really need to start getting familiar with them as they really simplify many tasks in SQL Server that previously were very difficult to solve.


How to build a Diet Coke booby trap...

This idea is pretty clever, but is probably best done with a 2 liter (since I think anyone would get suspicious of an smaller 20oz bottle that was already open.)


How To Build A Mentos And Diet Coke Booby Trap