Thứ Ba, 27 tháng 11, 2012

How to show/hide Grid columns on the fly?

The solution is simple, but quite elaborate to make it work. Here's the complete example using JQuery. You can customize your own way.

First, reference JQuery and create the dynamic list of column names. Then design a checkbox accordingly and hook up onclick event for each:
   <script type="text/javascript" src="JS/jquery-1.3.js"></script>  
   <script type="text/javascript" language="javascript">
    $(document).ready(function() {
        $("#tblExample th").each(function() {
            var iIndex = $(this).closest("th").prevAll("th").length;
            var colName = $(this).html();
                         id:    iIndex
                        ,name:    iIndex
                        ,value:    colName
                        ,type:    'checkbox'
                    .click( function( event )
                        var cbox = $(this)[0];
                        ShowHideColumn(, !cbox.checked);
                    } )
                        'for':    iIndex
                    .text( colName )

        $("#tblExample th").click(function() {
           var iIndex = $(this).closest("th").prevAll("th").length;
           ShowHideColumn(iIndex, true);
        function ShowHideColumn(iIndex, isHide)
               var display = "table-cell";
               if(isHide == true) display = "none";
               $("#tblExample").find("tr").each(function() {
                  $(this).find("td:eq(" + iIndex + ")").css("display", display);
                  $(this).find("th:eq(" + iIndex + ")").css("display", display);
           catch(e) { alert(e);}
        $("#tblExample th").mouseover(function() {

And here is the implementation of HTML markups in body section:
        <div id="divColumns">
        Put a yes/no check on each column name below to show/hide column correspondingly:<br />
        <br />
        Or you can click on header to hide the column at once:<br />
        <table id="tblExample" cellpadding="0" cellspacing="0" border="1" style="border:solid 1px gray;">
                <tr style="background-color:Gray;">
                <tr><td>0002</td><td>Lucky Luke</td><td>33</td></tr>


 Try to uncheck the "Age" checkbox and see how it works. Here's the result:

Happy coding,

Thứ Tư, 21 tháng 11, 2012

6 Key Points for a good IT management job

I've been working with IT management jobs for more than 5 years. I wanna share with you 6 key points which will make your job more fruitful. That is: Job Description, Diversity, Inspiration/Motivation, Rational Schedule, End-to-end Approach and Pecking Order.

1)   Job Description: Clearly-defined Job Description is the key. Develop well-defined standards and clear evaluation criteria in the first place, or as early as possible so employees can gauge their success and we don’t have to remedy the situation at some point in the future.

2)    Diversity: Value diversity in the team. Someone might not smart but work hard, then it has compensations. Think about giving detailed tasks to people who are big-picture oriented or assigned jobs that required toughness to people who are essentially very harmonious in nature. Either way doesn't work. So build on strengths, and to compensate for weaknesses. It’s a trade-off in the team. Remember: “The whole is greater than the sum of its parts”.

3)    Inspiration/Motivation: Inspire team members to grow their skills and develop on the team. Annually, each team member is forced to learn something new and share with others (seminar, forum...). Lack of training kills productivity in the long run.

4)    Rational Schedule: Ensure appropriate schedule for different teams and persons. Tightening schedule kills the creativity and quality in the long run. But loosen schedule causes diminishing focus. Has a balanced development process; are not too gentle or too hasty in software making process. In short, keep in minds 2 important laws:
  • Parkinson's Law: Work expands so as to fill the time available for its completion. (Công việc lúc nào cũng phình ra để lấp đầy thời gian cho phép)
  • Pareto law 80 20 principle.
5)    End-to-end Approach: The work speed, productivity is pretty much same no matter it is just the right begining of project life cycle or going down to the wire (không có giới hạn khoảng cách giữa các điểm khác nhau. Tốc độ làm việc, hiệu quả đều giống nhau cho dù đó là thời điểm bắt đầu hay cuối dự án). The key thing in this approach is "Bring development processes closer to the customers". Have the customer actively participate in the design and offer feedback throughout the development process. This allows both the team and customer to better align their expectations and needs.

6)    Pecking Order: Exercising authority in the team is a indispensable measure to minimize negative conflict and make sure that “running scared” is a good thing to steer the team on the right track.

Thứ Năm, 1 tháng 11, 2012

What is the difference between decodeURIComponent and decodeURI?

Sometimes, we post the request (search for instance) with the value of parameter ("keyword" for instance) passing on the URI, like below:

var uri="ập trình C++&includecomment=true";
If keyword parameter contains the special characters like , / ? : @ & = + $ #..., the URI will be parsed incorrectly. So we have to encode the parameter.

alert(encodeURI('lập trình C++')); ==> Return: l%E1%BA%ADp%20tr%C3%ACnh%20C++

alert(encodeURIComponent('lập trình C++')); ==> Return:l%E1%BA%ADp%20tr%C3%ACnh%20C%2B%2B 

alert(encodeURI('ập trình C++&includecomment=true')); ==> Return:

alert(encodeURIComponent('ập trình C++&includecomment=true')); ==> Return:

From MSDN JScript Reference:
The encodeURI method returns an encoded URI. If you pass the result to decodeURI, the original string is returned. The encodeURI method does not encode the following characters: ":", "/", ";", and "?". Use encodeURIComponent to encode these characters.

, sometimes called fixBrokenURI or produces a "safe" URI by encoding invalid characters such as spaces and some other (e.g. nonprintable), and turns it into a real URI. It has a valid use in fixing up invalid URIs from user input, and it can also be used to turn an IRI (URI with bare Unicode characters in) into a plain URI (using %-escaped UTF-8 to encode the non-ASCII).

encodes the colon and slash and plus characters, and is meant to be used in query strings. The encoding of + and ? and & is of particular importance here, as these are special chars in query strings.

Now you know the real difference between EncodeURI() and EncodeURIComponent().
Converserly, DecodeURI() and DecodeURIComponent() is provided to be an inverse of EncodeURI and EncodeURIComponent.

And here the real Web example:

<input type="text" name="keyword" id="keyword" value="<%=Server.HtmlEncode(Request.QueryString["keyword"]) %>" onkeypress="if(event.keyCode==13) SearchPage()" />

Happy Coding,