div height error on IE6

IE6 again, "height.html" is an example code of div height error on IE6.

This code running no problem on IE7 & Firefox, but when it reach IE6, the height change to 20px.

Same case as my previous post, I look for Mr Google again. This time I get some post said:
1) IE6 height will have some white space if image is smaller then 12px, we need to set line-height to 0px.
2) IE6 height will have some white space if image is smaller then 20px, we need to set line-height to 0px & set a smaller font-size.

So, my code end up like "height_ie6_fix.html".

Finally, it work perfectly on IE6, IE7 & Firefox browsers.

padding + height problem on Firefox

I though I was facing an error on Firefox browser when using padding & height attributes together in a CSS class. But I was error, in the end, it is still IE browser problem.

Let take an example "height_without_doctype.html"

When we run this code, it will display different output on Firefox & IE.

Firefox height = padding-top + height = 50px + 50px = 100px

IE height = height = 50px

After I find Mr Google, it point me to this url which is perfectly solve my above problem.

The solution is simple, just add in a DOC type, then IE will follow a common standard same as Firefox.

So, the code changed to "height_with_doctype.html"

Both browsers work the same now.

Javascript Menu Navigation

Recently I research on how to implement a javascript menu navigation. At the beginning, I was thinking of use library to make one. But there are so many different request coming in until I decided to develop my own javascript menu navigation.

Here is the sample code that I write (3 levels menu navigation):

During testing on this sample code, I find out that IE6 having some different behavior then IE7 & Firefox on onmouseout() function. If possible, avoid to use that function.

XML DOM

I really want to fuck off this thing, facing too much problem on it, finally fully understand it now.

Recently I alway need to read xml data, by using jsp, javascript, asp, ...... Element, Node, NodeList alway come out from XML DOM. I hate them very much.

Different browsers have different DOM parsing, when the code work on IE, it didn't mean it will work on Firefox. I need to test on both browsers for so many times only I can confirm the code is working fine.

The important thing to take note when using XML DOM:
"The best way to only process element nodes is to iterate through the child nodes and only process those with a node type of 1".

Encoding the Request Parameters

Recently I just faced some problem with Ajax implementation, here is an answer I found for the problem:

"When developing a traditional Web application you don't have to worry about encoding the form data because the Web browser performs this operation automatically when the user submits the data. In the case of an Ajax application, however, it's your job to encode the request parameters. JavaScript provides a very useful function named escape() that replaces any character that cannot be part of a URL with %HH where HH is the hexadecimal code. For example, any space character is replaced with %20."

The problem is very simple, when we make a http call to any url, we should encode the request parameters. I think I faced this similar problem when doing J2ME http call as well.

This code when make a http call, the result url will become:
http://www.abc.com/testing.asp?title=Title 1&content=Content body

Do you notice what problem with this url? Ya, the white space. From server side, the title & content text will received wrongly. (White space missing)
In order to correct it, we must add an encode function to replace the special text (white space) to "%20" or "+".
http://www.abc.com/testing.asp?title=Title+1&content=Content+body
http://www.abc.com/testing.asp?title=Title%201&content=Content%20body

Then only we can receive the correct text from the http call.

Another half day gone.

Here some special text that might be useful:
1) White space - %20
2) New line - %0D%0A (Windows), %0A (Unix), %0D (Macintosh)
3) "+" - %2B
4) "/" - %2F

Div Pop Up

Hehe, I finally find out how to pop up something without window frame.

Here are the examples of a normal window pop up & a div pop up which I want to implement soon.

Both example can be run when the code paste in a html extension file. This is what I called "Div Pop Up".

Small Trick on IE7 with Ajax

Below is a javascript I wrote for Ajax call few days ago. This code run smoothly in Firefox, IE7 first call success, second call onward all fail.

Do you see what wrong on the above code? This code took me half day to debug, I was thinking is it IE7 browser bug or what. But in fact, the main reason it fail on IE7 is because IE7 make Ajax call very fast from second call onward.

The code haven't reach the set loading part already finish set result. Mistake learned.

J2SE 5.0 Enhanced for Loop

Here an example of J2SE 5.0 Enhanced for Loop by one of my old colleague:

This code maybe will run faster.

Fiddler HTTP Debugger

Fiddler HTTP Debugger - A web debugging tool which commonly used by my colleague.

Today, I found a flash file (SWF extension) not loading a xml file correctly during my web development. So, I was thinking is it my false that putting the flash file in a wrong directory or there is some error on the flash file itself?

Suddenly, my colleague help me find out that it is the flash file problem, the xml file must put at a special path in order to make the flash work. It was Fiddler which help us trace which process calling which file at which path having problem.

Actually I had been teach by my colleague to use Fiddler before, but I just alway forgot to use it.

Anyway, here a Firefox Add-ons - Live HTTP Headers, something similar to Fiddler & it works well on Firefox browser.

Do remember to use it when you need it.

Eclipse + Netbeans

I start switching from Netbeans to Eclipse. Reason of switching: company requirement.

"Code in Eclipse, build & run in Netbeans.", this is what I did on my first day using Eclipse because I have no idea how to run in Eclipse.

Well, I has been trying to use Eclipse from the past few days, I feel that this IDE is special for professional user. There are a lot of setting & plug in can be add. It really need some time for a developer to familiar with this IDE.

For a newbie on both IDE, Netbeans might be easier for them to learn up. Netbeans screen interface is more user friendly.

Although Netbeans 6.0 had released recently, but the overall speed still slower then Eclipse. Eclipse is more powerful on the debugging & find bugs features.

Overall, I still haven't familiar with Eclipse. Now I have to run both IDE, using Eclipse as the default IDE, Netbeans as my backup IDE in case I don't know how to use Eclipse.

ASP.NET 2.0 Membership API

Today I was exploring on how to make a login form with ASP.NET & Ajax, then I come across few website that bring me to ASP.NET 2.0 Membership API.

Nowadays website require membership, user need to enter a username & password to login. Besides that, there are also roles for each user, something like admin user, super user or normal user. These two things are very hard to avoid, normally it is a requirement to implement.

All the above things can be done with ASP.NET 2.0 build in Membership API. It only require developer drag & drop few things, a simple website with login form done.

For this API, I do feel it is very useful, it save developer hundred of code to implement a login form with roles for each user. But when I start implement it, I feel very hard. The hard part is on their tag. Something like asking a developer who don't know HTML to make a website with Dreamweaver. I feel so uncontrollable on the login user detail:
1) How to login?
2) Login user detail stored where? Session? Cookie?
3) How to logout?

But in the end, I still choose to use this API, temporally able to login & logout. Maybe I need more time to read the tag documentation.