lundi 26 novembre 2012

JavaScript: validate an URL

I've already posted an article on how to validate forms with Regular Expression. But, have you ever needed to valid an URL?
We can do it quite easily using Regular Expressions and JavaScript. Specifically we are going to use the .test method.

The code
The first thing we need to do is set two variables: one is the URL to be validated, the second is the Regular Expression.

<script type="text/javascript">
var url = "http://www.google.com/";
var urlCheck = /^http:\/\/(www\.)?[a-zA-Z0-9-]{3,}\.[a-zA-Z]{2,}(\/)?$/;

Now we can check the url using a snippet like:
if (urlCheck.test(url) == false)
{
  alert("URL is not correct!");
}
else
{
  alert("URL correct!");
}
</script>
According to the URL specified in the url variable, we will receive an alert message: if the url is correct or not.
Now, remember that the above is just an example to show the .test method. Depending on the if clause, we can create different results. For example in a form we can be sure that the submitted url is a valid one and not a fake one. Or anything else.

Nice and easy.

Enjoy yourself, and take care.

Oh! By the way, don't you think it's time to drop a line? So, just use the comments section below!

lundi 26 novembre 2012 by Berland · 0

mercredi 21 novembre 2012

JavaScript: document.lastModified with a trick

Again another JavaScript article...
This post in fact might be interesting for some of you. We are talking about those fancy lines we sometimes find at the end of a web page where we are informed about the document last modification date. Something like:


How do we do it automatically? And... that is not an European date, is it? If so, how can we manipulate it in order to make it European?

The code
The code is once more very simple:

<script language="javascript">
  document.write("<i>Last updated "+document.lastModified+"<i>");
</script>
As you can see the output will be:
Last updated 11/17/2012 ... ....
The date is in the format: month/day/year.
We can actually manipulate the output and give it different form by using the following function:
function Agg()
{
   this.length = Agg.arguments.length;
   for (var i=0; i>this.length; i++)
   {
     this[i + 1] = Agg.arguments[i];
   }
}
var gg = new Agg();
 gg[0] = "Sunday";
 gg[1] = "Monday";
 gg[2] = "Tuesday";
 gg[3] = "Wednesday";
 gg[4] = "Thursday";
 gg[5] = "Friday";
 gg[6] = "Saturday";
var mm = new Agg();
 mm[0] = "January";
 mm[1] = "February";
 mm[2] = "March";
 mm[3] = "April";
 mm[4] = "May";
 mm[5] = "June";
 mm[6] = "July";
 mm[7] = "August";
 mm[8] = "September";
 mm[9] = "October";
 mm[10] = "November";
 mm[11] = "December";
var dd = new Date(document.lastModified);
 with (document)
 {
  write("Page last update on ");
  write(gg[(dd.getDay())], " ");
  write(dd.getDate(), " ");
  write(mm[(dd.getMonth())], " ");
  write(" ", dd.getFullYear());
  write(" ");
  write(dd.getHours(), ":");
  write((dd.getMinutes()<10?'0':'') + dd.getMinutes(), ":");
  write((dd.getSeconds()<10?'0':'') + dd.getSeconds());
}
And the result will be:

mercredi 21 novembre 2012 by Berland · 0

lundi 19 novembre 2012

JavaScript: check the mime type and charset

I always underestimated JavaScript. I know it has been a problem for me, because I've really missed lots of interesting things until I decided to explore the programming language.
In the following article I will show one of the useful things we can do with JavaScript: discover the charset and mime type of a web page.
You might wonder what's the use of it. Well... as usual try to broaden your view and consider the fact that every visitor is visiting your beloved web site from somewhere in the wide world, sitting on a different kind of chair (if not standing or lying), with a different piece of technology or device, and finally (but I could go on forever) with a specific browser ... ... type and version (the mixture of the two is a deadly issue for any web developer).
Ok, said that, don't you think that knowing the mime type and charset of a page might be useful?
Let's see how to do the magic.

The code
The code is quite simple: we are going to use two properties for the document object: mimeType and defaultCharset.

<script type="text/javascript">
var mT = document.mimeType;
var cS = document.defaultCharset;
with (document) {
write("Mime Type = " + mT);
write("<br>");
write("Charset = " + cS);
}
</script>
Just put the above in your document and see what comes out.
Now that you know how to get those values, you might image what you can do. For example we can send the user an alert when the two properties are not met by the target browser.

Ok folks... see ya next time!

lundi 19 novembre 2012 by Berland · 0

mercredi 14 novembre 2012

jQuery: cookies!

I've already talked about cookies. We explored the way to use them with ASP, but have you ever wondered how to manage them with jQuery?

This is a very short article because I don't want re-write an already made guide...
We are talking about a jQuery plug-in called jquery-cookie which allows us to manage everything about cookies with jQuery.
We will be able to read, create and delete cookie sessions. The plug-in can manage session expiration and it can be configured in order to define a valid path for cookies.

Just go to the above page and see for yourself...

mercredi 14 novembre 2012 by Berland · 0

lundi 12 novembre 2012

SQL Server: import a MS Access database

As I wrote in a past article, MS Access can be used to manage databases for a dynamic web site. However, some times, it is not enough and its features can be not enough. In those cases we really need to move to a more performing software like SQL Server.
Especially in situations were large quantities of information are managed by a dynamic web site, SQL Server can be a great solution.
If you are a reader of the web thought, you know how much I am a fan of SQL Server. so in this short post I will explain how to import an Access database to SQL Server... a few steps and we will ready to go.

First things first
There are two different ways of converting an Access database into a SQL Server database. One is from the MS Access point of view: upsizing a database (export). The other way consists in importing an Access database into SQL Server.
In this article we are going to see the second way, which in my opinion is much more secure and easy to execute.

Import
We are going to use the import feature in SQL Server Management Studio. To do so we need to select our database, right click and then select "Tasks/Import Data...".
Doing so, the import wizard will open.
First, select as data source "Microsoft Access". After that, we need to select the Ms Access file name, by pressing browse.
After clicking on the next button, we need to decide where we want to  import the database. Destination will be "SQL Server". Select the SQL server name and the database. Now, be careful when completing the dialog box section about user authentication: decide if you want to use Windows or SQL Server authentication.
The next import procedure step is about the way to import data. We can copy data from one or more table or views, or we can write a query to specify the data to transfer. We assume we are going to import data from a table, so we select the first option.
In the next step, we can select the sources by ticking next to the table/s we would like to import.
After clicking on the next button, and after just a moment (or maybe more than a moment depending on the size of the imported table/s), we will find the MS Access tables just inside the Tables section of our SQL Server database.

Fast and easy.

A few more tips
After importing the tables, we need to check if everything went the way we wanted. There are some basic differences between SQL Server and Access that we should be taking into account. The import wizard is a great tool and it should take care of most of the dirty work. A good look at what is now inside SQL Server, before using the database, is advisable in any case.

Ok folks... that's all for today.

lundi 12 novembre 2012 by Berland · 0

mercredi 7 novembre 2012

jQuery and JavaScript: generate and read a QR Code

Hello everybody!
today we are going to see something really interesting that someone in the past asked me via email.
We are going to generate a QR code using a jQuery plug in and then we are going to use a JavaScript library to read the very same QR code.
What do you think, is it interesting enough?

Generate the QR code
In order to generate the QR code we just need to use a small jQuery plug in called jquery.qrcode.js which is a "jQuery plugin for a pure browser qrcode generation".
As explained in the plug in page, the creation of a QR code is pretty straightforward:
1) include the plugin:

<script type="text/javascript" src="jquery.qrcode.min.js"></script>
2) Insert the target container:
<div id="qrcode"></div>
3) Generate the QR code:
jquery('#qrcode').qrcode("the web thought");
The plug in can render the QR code in canvas or in table.

Read a QR code
Reading a QR code is different stuff: we can use jsqrcode.js. The idea here is similar to the creation.
We need to include the libraries as explained in the above Github page (see Readme file).
To decode a QR code, we can use the following two lines of code:
qrcode.callback = function(data) { alert(data); };
qrcode.decode("qrcodeTest.png");
where the qrcodeTest.png is our QR code image that stays in the same folder as the web page containing the above decoding snippet.
The callback function gets from the data parameter the value resulting from the QR code decode process.
Just to make things more clear, have a look at the following code:
<script src="jquery.js"></script>
<script type="text/javascript" src=" QRCode.js"></script>
<script type="text/javascript">
$(document).ready( function() {
    qrcode.callback = showInfo;
    $("#btnDecode").click(qrCodeDecoder);
  })
 
  function qrCodeDecoder() {
    qrcode.decode("qrcodeTest.png")
  }
 
  function showInfo(data) {
    alert(data);
  }
</script>
</head>
<body>
<div>
<img id="qrcode" src="qrcodeTest.png"/>
</div>
<button id="btnDecode>Decode the QR Code</button>
After including the jQuery and the jsqrcode libraries, we use a button to trigger the call back and the decode of the png file (qrcodeTest.png).

Ok, guys and gals. That's enough for today.
As usual if you need more info, just drop a line in the comment section below.

mercredi 7 novembre 2012 by Berland · 0

lundi 5 novembre 2012

JavaScript: dashboards with Drinks Toolkit

Web applications are evolving rapidly. While only a few years ago we just needed to manage basic operation for - as an example - a company's  intranet, today, we are asked to create effective and attractive pages together with complex functionalities.
In order to create efficient dashboards, Drinks Toolkit is a really valuable helping tool.
DrinksIt is a "Web-Based widgets to easily develop control panels and dashboards" and it includes a series of widgets each corresponding to a specific tag.

Drinks is HTML5 powered, using canvas and not needing any Flash.
It uses AJAX to gather data and it is cross browser, as long as the target browser is HTML5 compliant. In terms of simplicity, Drinks is really very easy to use, because in order to insert a widget, we just need to insert the related tag (each widget a tag e.g. <knob>).
Finally it's basically open source, thus free. In fact there are three possible options: the Open Pack which is a "pay what you want (even nothing)" option, the Business Pack for professionals and the Custom Pack (Choose what you need).
Ok, that's all for today. Go to Drinks web page and have a look for yourselves.
See you on thursday!

lundi 5 novembre 2012 by Berland · 0

All Rights Reserved Blogging Tips | Blogger Template by Bloggermint