MDBitz Development Resources

Today I was running some tests on my T-SQL Procedures and noticed that for some reason my Select statement was performing in seconds compared to my Procedure which would take minutes to complete. After a few hours I stumbled upon my mistake I had used the date datatype in the procedure parameters when my database table was of type datetime, by switching the variable to a varchar(30) datatype the procedures performance had increased and functioned with the same IO count and time as the select statement.

Incorrect Procedure Statement

CREATE PROCEDURE P_RULE_MULTI_LOCATION
@startDate DATE,
@endDate DATE
AS
BEGIN
 
SELECT * FROM ACTIVITY_LOG WHERE ACTION_TS >= @startDate AND ACTION_TS < @endDate
 
END

Correct Procedure Statement

CREATE PROCEDURE P_RULE_MULTI_LOCATION
@startDate VARCHAR(30),
@endDate VARCHAR(30)
AS
BEGIN
 
SELECT * FROM ACTIVITY_LOG WHERE ACTION_TS >= @startDate AND ACTION_TS < @endDate
 
END

The simple above change enhances the queries performance where it can use both an index and its position when performing the select statement. While the date to datetime comparison does not allow for the index position to be used due to the conversion. It may not make the most sense but if you find your procedure functioning slower than your direct sql query you may want to check your datatypes to make sure that they are the same.

Most if not all PHP developers are aware of the getdate function and how it returns an associated array of the current time and date.

$current_time= getdate();
print_r( $current_time );

Output Format:

Array
(
    [seconds] => 40
    [minutes] => 58
    [hours]   => 21
    [mday]    => 17
    [wday]    => 2
    [mon]     => 6
    [year]    => 2003
    [yday]    => 167
    [weekday] => Tuesday
    [month]   => June
    [0]       => 1055901520
)

However this function is not very useful when you want perform Date Comparisons and Manipulations. Instead you will want to use the DateTime object of PHP.

The DateTime Class

The DateTime Object by default gets instantiated to the current time when being constructed. If however you want to instantiate it at a different date you can pass in a string representation of the date.

$date = new DateTime( ); // same as new DateTime( "now" );
$date2 = new DateTime( '2010-01-01');

It is important to remember that you can use any string in the DateTime constuctor that you would use in the strtotime function. This means you could instantiate the date and time of last Monday, next Friday and etc.

$date = new DateTime( "last Monday" );
$date2 = new DateTime( "next Friday" );

Manipulating Dates

To modify your DateTime objects you can use the add and sub methods that utilize DateInterval objects for representing amounts or you can use the modify method which takes a string as a parameter. I personally find the modify method easier to utilize.

$date = new DateTime();
$date->add( new DateInterval( "P5D" ) );
$date->modify( "+5 days" );

Comparing Date Objects

Comparing Dates is now easy as the DateTime object supports basic equality and comparison functions (==, <, >, etc ). So if you want to check if a date is before another you would simply:

$date = new DateTime( "2003-12-17" );
$date2 = new DateTime( "2005-6-19" );
if( $date < $date2 ) {
  // additional logic
}

Resources

• PHP Manual – The DateTime Object
• PHP Manual – The strtotime Function

In addition to new tag elements in HTML5 the input element has been extended with new types and attributes. Although these changes are not fully supported across all browsers they can still be added if desired to your existing websites.

New input attributes

Placeholder Text

It is common practice to include placeholder or default text in form input fields. In most cases they simply describe what data should be entered and once a user clicks or focuses on the field the value is displayed. HTML5 specifications has added the placeholder attribute to input elements so that browsers will perform this function instead of having it performed by JavaScript. However until it is supported by all browsers you will still need to use JavaScript.

<form>
    <input name="query" placeholder="Search" />
</form>

Auto Focus

You may in your websites be using a piece of JavaScript to focus a form field after a page has loaded. To make this task easier the autofocus attribute has been added.

<form>
    <input name="name" autofocus />
</form>

New input types

The greatest thing about the input element is that if it doesn’t recognize the type (e.g. the browser doesn’t support the type) then it will default back to a text input field. That means that if you want to use any of the new input types like search and email then you can do so without worrying about missing form fields.

Search Input

In HTML5 it was decided to add a search type input. As you all know in your web pages you typically use a normal text type input for your search forms. However it was decided that the new search type should be added so browsers could add additional functionality to them to match the browsers search functionality. What this means is that each browser can do what they want with the field including changing the style to match the browser’s search so that it no longer is consistent with the rest of your web page.

<form>
    <input name="query" type="search" />
</form>

URL & EMAIL Input

Both URLs and emails are strings that conform to respective Internet Standards. To make validation consistent and easier for developers the url and email type input elements have been added. The purpose of these fields is to verify and restrict the inputted data so only valid information is sent back to the server. However this validation would be performed at the browser level and if you are verifying other fields you will end up having to manage multiple error messages to the user which could be confusing to them.

<form>
    <input name="email" type="email" />
    <input name="website" type="url" />
</form>

Sliders and Spinboxes

Ever wanted to have simple easy to use slidebars or spinboxes when a user is inputting number values. In HTML5 your wish has been granted with the number and range input types. These elements allow you to set a minimum and maximum value as well as a step value for how it should be incremented. Again allowing the browser to display their version of sliders and spinbox controls and you not having to implement a JavaScript library to get your desired elements.

<form>
    <input type="number" min="8" max="29" step="1" value="12" />
    <input type="range" min="0" max="10" step="2" value="6" />
</form>

Calendar and Color Pickers

Commonly you will find yourself requesting that a user input a date or time and to handle this you will most likely include a JavaScript calendar to get your desired date picker. Similarly to number inputs, HTML5 adds support for input of various date types including month, date and time. These elements if supported by the browser would present a calendar interface for selecting a valid value. Less common but also specified is the color picker element defined by type color, however at this time no current browser supports the element.

<form>
    <input type="color" />
    <input type="date" />
    <input type="time" />
</form>

HTML5 raises some developer complications and in my opinion is incomplete. The specifications outline the details on common elements currently created by JavaScript, however they do not specify how those objects are to be rendered. What this means is that it is up to the browser on how they are displayed and are no longer in the control of the designer/developer. In addition it introduces the concept of browser validation of input yet once again it doesn’t specify how the browser should handle the validation or how the designer/developer can tap into the validation. With complicated forms it is often the case that input is validated not only for standards but for required fields or custom data values, by including the new HTML5 elements you know have to worry about validation errors from your own scripts but also the browser and the multiple feedback could be confusing to your Users.

I understand that HTML5 is taking the first steps in expanding the common functionality of the web and it’s browser, however to make these new elements a viable choice for web developers/designers more specifications need to be detailed in how a browser is to behave. For example if you have a web form that is styled to match your site and the browser displays search input that doesn’t match your site then it won’t be used, same with calendars and color pickers. A good start definitely but don’t expect to see these elements commonly used for a while to come.

Resources

• W3C – HTML5 4.10 Forms
• Dive into HTML5

Java Calendar

The Calendar class is a java utility for obtaining and modifying the current date and time. It contains all the functionality necessary to get the current time in any time zone as well as methods for manipulating the Date.

import java.util.Calendar;

Java SimpleDateFormat

The SimpleDateFormat is another utility that is used to format a Date object into a String based on the supplied format. The SimpleDateFormat object can be used to return the full date and time, date only, the month, or any such combination.

import java.text.SimpleDateFormat

How to use the Calendar utility

The Calendar object is instantiated by using the getInstance method.

Calendar calendar = Calendar.getInstance();

Once you have an instance of the calendar you can obtain the Date by use of the getTime method

calendar.getTime()

It is a common practice of having to modify the Date object to a different time in our applications. This is done by the set and add methods. The add method is used to manipulate a parameter of the Date while the set method is used to set a parameter to a certain value.

For example if we wanted to get yesterdays date we would use the add method and modify the Date by -1.

calendar.add( Calendar.DATE, -1 );

We could also modify the month the same way.

calendar.add( Calendar.MONTH, 1 );

However if we wanted to change the Date to the first of the month we would use the set method

calendar.set( Calendar.DAY_OF_MONTH, 1 );

In addition to the constants above that represent the date, month, and day of month there are others for year, seconds, hours, and etc that can be used to modify the date in any many necessary for your application.

Using the SimpleDateFormat Object to return the Date in readable format.

To return a readable string representation of the Date obtained by the Calendar object the SimpleDateFormat format method is utilized. This method returns a string that represents the inputted date based on the format of the SimpleDateFormat object.

To instantiate the SimpleDateFormat object you call its constructor passing the textual format of the desired output of the date.  The format object understands the standard date and time representations of dd, mm, MM, YYYY, yy, and etc.  The example below shows how to display the time format as Date/Month/Year.

SimpleDateFormat dateFormat = new SimpleDateFormat( "dd/MM/yy" );
String date = dateFormat.format( calendar.getTime() );

Conclusion

Utilizing the Calendar and SimpleDateFormat objects allows you as a developer to easily obtain and modify the Date without doing custom arithmetic. They can be especially helpful in generating SQL queries for obtaining data for the past month, year, or a range of times.

Resources

• Calendar JavaDoc
• SimpleDateFormat JavaDoc
• Date JavaDoc