Mark Mintoff My superpower is common sense

18Dec/102

Ajax Server Side Validation

There are times you would want to do some sort of server-side validation on a form. As an example, you might want to validate a user's login credentials. In my case, the reasons for developing this validation wrapper, were to ensure that an ID was populated on the server, before allowing my Wizard to proceed to the next step. My opinion of ASP.Net's CustomValidator is that it is, quite frankly; horse shit. So, as per usual, I set about making my own way. My requirements were as follows:
  • User clicks "Next" (or Submit) button
  • Server checks if ID is populated
  • Server returns this information
  • If ID is not populated, prevent moving to the next step
  • If ID is populated, allow moving to the next step
Clearly Ajax had to be used here, and I opted to use JQuery's $.ajax as I find it to be absolutely splendid. The secret to achieving the functionality we want, is to set the async property to false. The reason being that with the async property set to true, Ajax will behave as Ajax is supposed to behave. In our case we do not want Ajax to behave normally, as the form would submit while the Ajax call was being made. As is my style, I decided to create a wrapper functionality, making the whole thing rather generic and fun to use: The way this works is that it makes a call to the path which you give it, passes the data which you give it and depending on the server's response, will execute one of the functions (successEvent / failEvent) you passed to it. Meanwhile on C#'s back-end: This is pretty self explanatory, I won't insult your intelligence and explain what it does :) And to use this method on your page? Simple: If you're curious about the String.Format, please refer to here. And that's all there is to it! The process goes like this:
  • User clicks button
  • The click function we binded is fired
  • The ValidationEvent function is fired
  • Ajax call is made to server using our details
  • Depending on the response from the server, the success or fail events are executed
  • In my case, I only passed a failure function; TemplateValidationFailure
And that's all there is to it!
VN:F [1.9.22_1171]
Rating: 0.0/5 (0 votes cast)
17Dec/101

Combining JavaScript or CSS Files (PHP Version)

Please refer to my previous post which is done in ASP.Net. And now, may I present to you, the PHP version in all it's hastily coded atrocity: To reference this, simply type in something akin to the following into your <head> tag:
<script type="text/javascript" src="include.php?type=js"></script>
Also: If you get weird characters such as these beauties; ï»¿ please ensure that the files you are saving (the javascript and css files) are encoded without BOM (Byte Order Mark).
VN:F [1.9.22_1171]
Rating: 0.0/5 (0 votes cast)
16Dec/106

Combining JavaScript or CSS Files

I spent some time today, mulling over the evidently dismal state which lies in future Web Development. Already we see the horrors of script references upon script references as business-folk and neophyte developers alike, cram component after component after component into the same page. Buzz words like "Web 2.0", "SEO" and "value-added" being thrown around the room like the flaccid, empty whores that they are. Needless to say, I fell into a depression, realizing that there is no way to avoid these things. Forever shall pages be polluted by script references upon script references. Forever shall pages take forever to load and forever shall management complain (and rightly so) about the speed of a website. But should it remain that way? "No" says I; emphatically. Hence I decided that something needed to be done. I trust we all know about GZip and Minification. If not, please do go and educate yourself about these little things. They are quite useful. In addition to those two techniques, there is also the idea of cramming all your scripts and all your css into singular files. Why? Well clearly this is done in order to reduce the number of files requested from the server. What this achieves is that the page will load quicker. What this also achieves is further messy coding. All scripts in one single file? Really? That doesn't sit too well with me I'm afraid. I like having things organized. Folder structure and independent files are key to me maintaining the vestiges of my sanity in a world gone mad. But the results of such a technique are clear, evident, obvious. But I want the best of both worlds. And as an ASP.Net programmer, I figured out how to do this within the space of 10 minutes and decided to share it with you. I'm 100% sure this functionality may be replicated successfully in PHP and I will be making an effort to do so within the following couple of days. So, what is this technique I thought of? Imagine if you will, if the server were to read the files you wish to serve and append everything into a single file and serve that, instead of serving, say...10 JavaScript files. That's pretty much the principle of it all.
First things first. This is coded in ASP.Net and what I will be showing you is a hard-coded version. You should definitely make this data-driven. Why? Because it's god damn cool. And I love cool things. Start out by adding a Generic Handler (and ashx file) to your solution. I called mine "IncludeHandler.ashx". Next, code it up so that it looks something like this: Next, make sure you have all the files listed in the "files" generic List<string>. For my "test.js", I entered the following script: Include the following into the <head> tag of your page: Now, run it. Result: If you're using a hip browser like Google Chrome you can go take a look through the "View Source" and click on the link to "IncludeHandler.ashx?type=js". Otherwise, you can just type in the link yourself in the address bar. What you'll see is that all the code from your script files has been tossed into one response. Let's do a comparative benchmark test using Chrome's load speed graph. The first candidate for this test will be the standard way of doing it; ie: 3 script references, ie: The result: Now, if we do the same thing, except with the previous script reference, ie: 1 script reference, ie: The result: So. 1670 ms -vs- 569 ms. An entire 1.1 seconds shaved off. Not bad! The advantages here are evident. Not only did we manage to toss in all our scripts into a single file, but we maintained an organized file structure which won't make us tear out what little hair we have left. The same advantages apply to StyleSheets. Don't believe me? Try it! I do believe it's worth your time. NOTE: Before nose-diving into this, read the following: here.
VN:F [1.9.22_1171]
Rating: 0.0/5 (0 votes cast)