Against All Odds - Javascript

To replace javascript alert with CFMessagebox

Thu, 07 Jun 2012 19:27:00 -0700

Before my development, I've already used native javascript alert for client side validation message. Some people might complaint why I used native javascript alert instead of jQuery dialogbox, it's because of I don't want to include so many script tags and CSS tags for jQuery mobile. Today, I've got an idea to replace native javascript alert with cfmessagebox. This function will support to display cfmessagebox instead of javascript alert whenever we have put javascript alert in our coding. [More]

Get Javascript value from Coldfusion in same page

Fri, 10 Feb 2012 07:05:00 -0700

Today, I've found funny resolution to get javascript value from Coldfusion in same page without reloading. I'm not sure whether it might be useful or not, but for me it's kinda useful. Usage



	


#JSvalue#

get Table height with javascript

Thu, 19 Jan 2012 18:29:00 -0700

Normally, it's hard to get table height with javascript because javascript cannot read or retrieve table as follow



	
		Height

[More]

Iframe location for firefox

Tue, 29 Nov 2011 02:40:00 -0700

I oddly know how to use iframe location in firefox. Honestly, most of our projects are based on Internet Explorer. It's because of ActiveX controls. Why I know how to use iframe location in firefox is because of my junior asked me how to do like that.



window.frames[iframeName].location = url;


document.getElementById(iframeId).src = url;

Credit : http://www.dyn-web.com/tutorials/iframes

Using parseFloat function in Javascript

Thu, 28 Jul 2011 21:49:00 -0700

Today, I found one of weird problem in my project about using parseFloat() function of Javascript. The usage of parseFloat() function parses a string and returns a floating point number. example usage of parseFloat()


document.write(parseFloat("10.33"));


document.write(parseFloat("I AM PPSHEIN"));

[More]

Download Facebook Video Part 2

Mon, 11 Jul 2011 05:55:00 -0700

I wrote how to download Facebook video Download Facebook video without installing addons in my old post. At that time, Facebook using "embed" tag as displaying their video and it's easy to get original mp4 video from Facebook. Yesterday, one commenter wrote that he cannot download Facebook video regarding the instruction of my previous post. I was confused and cannot understand why he cannot download at all. That's why I've open Facebook video page and reviewed source code of it. Oddly, Facebook don't use "embed" tag as displaying their video anymore and changed their coding for using javascript as displaying. That's why I need to find out how to download original mp4 file of this movie from Facebook again. [More]

Decimal format in Javascript

Tue, 28 Jun 2011 05:12:00 -0700

It's odd that I've recently known how to do decimal format in javascript. Because, in the new change requests of our projects, I need to do on-the-fly calculation total amount once users change quantity. It seems so simple to use the built-in function of javascript but value parsing via javascript it a bit touch. Here is the example.

It's the wrong using of fetching decimal value in JS.


var getPrice = parseInt(document.myForm.txtPrice.value);

[More]

Change jQueryMobile Select Box active style color in iPad safari

Thu, 19 May 2011 22:41:00 -0700

Today, I'm very happy that I can change jQueryMobile select Box active style color in iPad safari. Because, current active style ".ui-btn-active" is 100% working for other inputs like text, radio and checkbox but for select box, it doesn't completely work in iPad safari. My boss told me that I need to change all of active input color to "dark blue" instead of default color. That's why I need to change and already played in existing jQueryMobile stylesheet file. But it doesn't work at all. That's why I think I need to hack jQueryMobile existing javascript. After 30 minutes, I found that there are three places I need to change in jQueryMobile existing stylesheet. The first part is I need to add new class name for active select box in stylesheet.


.ui-select-active {color:#0000a0; text-shadow: 0 -1px 1px #ffffff;}

[More]

Display image when completely loaded with Javascript

Thu, 28 Apr 2011 00:56:00 -0700

Today, I need to test some simple javascript coding to detect image manipulation. As we all know, we cannot detect Image width and height with javascript or jQuery before which isn't completely loaded. Now what I want to do is just put loading text and don't show image while it's not completely loaded. It's quite simple and I feel what I want to do might be useful for my future projects. Because I feel displaying image while loading is annoying and shouldn't be good for our clients. That's why I have an idea to do like that.





/* Below part is Javascript Coding */
document.onreadystatechange=function()
{
	/* 
		if page/dom/image is completely loaded, 
		show image and remove loading text.
	*/
	if (document.readyState == "complete")
		{
			document.getElementById("imageid").style.display = "inline";
			document.getElementById("loadText").innerHTML = "";
		}
}
/* hide image and display loading while loading */
document.getElementById("imageid").style.display = "none";
document.getElementById("loadText").innerHTML = "Loading...";

To save data into localStorage when Offline

Sun, 13 Mar 2011 19:40:00 -0700

Today I've found how to save the information of your data when offline (when your internet connection is disconnect). That's same as when Google email work. It's very useful to use because our submitted data is sometimes lost when our connection is disconnect or offline. Using this feature in HTML5 can prevent these bad situation. The important part is we need to check whether our browser can support "localStorage" or not. If not support, cannot develop anymore. If support, let's go. First of all, we need to create manifest file for "localStorage". It's the main part to let browser know our application will be using "localStorage". So, we need to add all of files name we will be using into this manifest file as follow. Current my simple application, I've used 2 files called index.html and lc.js. So, I need to add as follow


CACHE MANIFEST
index.html
lc.js

Now I need to let our clients know he/she is now online or office with following javascript.


navigator.onLine ? "online" :"offline"

After that, I need to create index.html file. As HTML5 standard, I need to follow the rule of HTML5.

[More]

Change default submit action with Javascript

Wed, 29 Dec 2010 17:15:00 -0700

We have one issue to solve the bugs come back by clients yesterday. The problem is when our client change quantity in input box of the item and press enter, this item is oddly disappeared from the main screen. So, I need to troubleshoot this issue and read through this code again. Obviously, I found that there are two submit buttons in this found. If there are two submit buttons in a form, do you know which submit button will work when we press enter?

[More]

cfcontinue is same as continue of javascript

Wed, 20 Oct 2010 21:42:00 -0700

Today, I found that cfcontinue is same as continue of javascript. I'm not sure whether it would be useful or not even you're trying to use looping. I'm not sure why Adobe add cfcontinue as new tag in Coldfusion 9. I think, it would be useful for somewhere else. But for me, it's so far to use. Usage of cfcontinue is just like continue in javascript. If action happen in condition, Coldfusion will skip this action and will continue the rest of looping.



	  
		    
			Gosh..!! I've been caught in #x# 
			  
		 
		current count : #x#

[More]

Different between setTimeout and setInterval

Mon, 18 Oct 2010 19:07:00 -0700

In these days, I'm so far to learn for my javascript enhancement. In my last project, I need to write about auto-refresh timer for ChChRart. In these coding, I was supposed to use setTimeOut. Unfortunately, it can't support my Chart to refresh always. Actually, it can refresh only one time once the page has been rendered. That's why I tried to use setInterval. setTimeOut : action will be run (only one time) defined milliseconds are timeout. setInterval: action will be run always whenever defined milliseconds are timeout. [More]

Load Content like Facebook and Twitter

Thu, 14 Oct 2010 19:22:00 -0700

Today, I found one of the new features of Twitter's new face is loading content while scrolling like Facebook. I feel it's cool and the advantage of using is don't need to fetch all records from database at once and don't need to use annoying pagination feature (I didn't say all pagination are annoying). Here is how they work with jQuery.


/* Load jQuery from Google API */
$(document).ready(function(){
    
    /* Alert the height of content */
    alert("Current Document Height is : " + $(document).height() + "px");
    
    function AnotherContent() 
    {     
        /* get current Height of content */
        var currentHeight = $(document).height();
        
        /* increase Height of content */
        var IncreaseHeight = currentHeight +  200;        
        $('#myHeight').height(IncreaseHeight);
                
        /* Alert the new current height of content */
        alert("Current Document Height is : " + IncreaseHeight + "px");    
        
        /* 
            if you wanna load another page, use this script. 
            $("#myHeight").load("index.cfm");
        */
        
    };  
    
    $(window).scroll(function(){
        /* Load AnotherContent() function when scroll down to the bottom of page. */
        if  ($(window).scrollTop() == $(document).height() - $(window).height()){
           AnotherContent();
        }
    }); 
    
});



    
    
        What?

Continue and Break of Javascript

Sun, 03 Oct 2010 17:18:00 -0700

Currently, I know continue and break is very useful for looping when action happen in condition. Usage of these two commands are just like return for javascript UDF. Continue : if action happen in condition, javascript will skip this action and will continue the rest of looping Break : if action happen in condition, javascript will stop execution the whole looping. Usage of continue


    var msg = "";
    for (var x = 0; x <=5; x++)
       {
       if (x == 3)
          {
              /* skipped it once x is equal to 3 */                  
              continue;
          }
       msg = msg + x + "\n";
       }
    document.write(msg)

[More]