Today was a reminder of how much I can forget. I have been working on a quick little report to help a group of people here at work. Nothing special, but I was adding some nice functionality to make updating things easier.

Basically each result row had 2 check boxes. Where they could check or uncheck either of them and it would update a table in the background. No biggie I thought, of course I had been developing it in Firefox and Chrome and occasionally in IE 8, and everything previous to the check boxes worked fine in all the browsers.

Then I ignored IE and developed the check boxes in Firefox and it was downright awesome.

Then I tested it in IE and it failed miserably.

You can in this picture my goal.

So you can see here that there are 2 checkboxes and a updated date. So if you check or uncheck either other them it updates the date (and saves it all to a database).

$("input[type='checkbox']").click(function() {

            //console.log($(this));
            var attrib = $(this).attr("id");
            var tmpEMP = attrib.split("-",2);
            var fName = tmpEMP[1];
            var empID = tmpEMP[0];
            var val;
            if ($(this).is(":checked")) {
               val = 1;

            } else {
               val = 0;
            }
            updateEMPTable(empID,fName,val);
        });

This code binds the click function to any of the check boxes, and I can pass the value of the checkbox (0/1) to the function that will update the database. Seems simple enough, but in IE nothing was updating. Everything would fire, but nothing was sticking to the database. Even their lacking development tools wasn’t telling me anything, and normally it would tell when I have an error at least, but nothing.

Then it dawned on me that a long time ago, I ran into a similar problem with IE, where I had an ajax call that would get fired every few seconds and return a new dataset but it kept returning the same dataset, even though my query was returning a different set. The fix for that was to tack on a unix timestamp to the ajax call so that IE was forced to treat it as if it was a new call. So I went in and added a timestamp to my call.

Note: I believe this is only a problem with GET requests, but according to Yahoo, POST requests a double vs GET requests – so I tend to use GETs more often then POSTs with ajax calls.

var ts = Math.round(new Date().getTime() / 1000);
        $.ajax({
            async: true,
                type: "get",
                data: ({fName:fName,empID:empID,val:val,sec:ts}),
                dataType: "json",

Now it sees the call as a different url everytime and will force it to update accordingly. While their are probably other ways to handle this, this was a fast and simple way to handle it.