Simple required field validation using jQuery

Sometimes, you work within the constraints of an existing application, trying to change as little as possible. So when a client had a very simple (two field) form, that showed up as a Bootstrap modal, and I needed to make sure the user didn’t click the submit button until they filled out all the fields, I simply dropped in the following JavaScript.

$(document).on('change keyup', '[required]', function() {
		var targetForm = $($('[required]')[0].form);
		var requiredOk = targetForm.find('[required]').filter(function () { return $(this).val().length == 0; }).length == 0;
		targetForm.find(':submit').prop('disabled', !requiredOk);
});

I then marked up my form fields by adding required property to each field that was required to be true. A simplified example follows.

<form id="form1">
  <input type="text" id="input1" required /><br />
  <textarea id="textarea1" required></textarea><br />
  <button type="submit" disabled>
  Submit
  </button>
</form>

Now, your submit buttons will automatically disable/enable. It doesn’t work in more complex forms with other field types, but I did start off by saying this was a “simple” solution, after all.

JSFiddle here: https://jsfiddle.net/05wyu3az/

Specifying time zone in SQL DATETIME DEFAULTs

You’ve had your existing application running for years, relying on DEFAULT constraints to set DATETIME fields to the current date using GETDATE(). Everything was great until you migrated to Azure SQL Database – and realized that your SQL Server is now set to UTC, and you can’t change it.

Fortunately, you can change your DEFAULT GETDATE() constraint to save date in your time zone. Just specify the default as shown below, specifying your time zone of choice:

default convert(datetimeoffset, getdate()) at time zone 'Eastern Standard Time'

To prove this, run the following, and note the output will show the time in Eastern Standard Time as opposed to UTC.

create table #test (
     val nvarchar(max),
     dt datetime not null default convert(datetimeoffset, getdate()) at time zone 'Eastern Standard Time'
 )
 insert into #test ( val ) values ('yo')
 select * from #test

Voila! No more time zone issue.

OneDrive sync fails because filename starts with a space

Windows (and, it seems, Microsoft in general) does not like filenames that start with a space. You can’t even create them in Windows Explorer — go ahead and try! If you start the name of a file or folder with a space, Windows will remove the space for you — automatically. Frustrating, eh?

Regardless, there’s sufficient ways to wind off with a file that starts with a space, and inevitably, if you use OneDrive, you’ll get sync errors, because OneDrive (being Microsoft) does not like filenames that start with a space.

The logical step would be to rename the file in Windows Explorer and remove the leading space — but that doesn’t work; Windows will tell you that the filename already exists. (Apparently, those spaces are ignored in more places than one.)

So how do you solve this? Two ways.

  1. Rename the file to something entirely new without a leading space.
    OR
  2. Open a command prompt and type this:
    ren ” myfile.txt” “myfile.txt”

The command prompt lets you use spaces (provided they are in double quotes), and will (accurately) know that a file name with a leading space is not the same as the same file name without the leading space.

Best solution? Avoid the darn spaces altogether.

Force a direct download from a shared DropBox file

While working with DropBox today, I created shared links to a file, and the links looked like this:

https://www.dropbox.com/s/abcxyz123/filename.zip?dl=0

This link goes to a nice DropBox web page that provides a lot of information — information that would confuse a less-sophisticated user. Why can’t we just get them right to the download?

You can. In the DropBox shared file link, change the “dl=0” at the end of the URL to “dl-1”.

So the same URL above as a direct download would be:

https://www.dropbox.com/s/abcxyz123/filename.zip?dl=1

It’s always fun hacking URLs!

Forcing the min/max on HTML number inputs

HTML5 has fantastic new features — one of them is type="number" attribute for input tags, which (among other things) restricts the user to only entering numbers (and spawning the number keyboard on mobile phones) and giving a (not always useful) widget that lets you increase/decrease the number. Unfortunately, one piece is missing (at least from most browsers I’ve seen): restricting the input to numbers within the min/max range.

Fortunately, a little JavaScript (via jQuery) can fix that. Add the below to your site, and any input type="number" tags on your site will have their min/max values enforced.
Continue reading