Month: March 2008

how to create html element dynamically in javascript

var itemManCnt=2;
function addMoreHomeImage()
{
if(itemManCnt==6)
{
alert(“You can upload only 5 files”);
return false;

}
var parentObj=document.getElementById(‘FileElementItem’);
var divClrBoth = document.createElement(“div”);
divClrBoth.setAttribute(“class”,”ClrBoth”);
divClrBoth.setAttribute(“id”,itemManCnt);

var divClrSelect = document.createElement(“div”);
divClrSelect.setAttribute(“class”,”Select”);

var file= document.createElement(“input”);
file.setAttribute(“type”,”file”);
file.setAttribute(“id”,”InsuranceHomeImage”+itemManCnt);
file.setAttribute(“name”,”InsuranceHomeImage”+itemManCnt);
divClrSelect.appendChild(file);

var divRemove= document.createElement(“div”);
divRemove.setAttribute(“class”,”AddNew”);

var divRemoveLink = document.createElement(“a”);
divRemoveLink.setAttribute(‘onclick’,’deleteHomeImage(‘+itemManCnt+’)’);itemManCnt++;
divRemoveLink.innerHTML=’Remove’;
divRemove.appendChild(divRemoveLink);

divClrBoth.appendChild(divClrSelect);
divClrBoth.appendChild(divRemove);

parentObj.appendChild(divClrBoth);
}
function deleteHomeImage(iEle)
{
var parentObj=document.getElementById(‘FileElementItem’);
var olddiv = document.getElementById(iEle);
–itemManCnt;
parentObj.removeChild(olddiv);
}

Implementation example

<div id=”FileElementItem” class=”FileElement”>
<div class=”ClrBoth”>
<div class=”Select”>
<input type=”file” name=”InsuranceHomeImage1″ id=”InsuranceHomeImage1″>
</div>
<div class=”AddNew”>
<a onclick=”addMoreHomeImage()”>Add New</a>
</div>
</div>
</div>

file type validation in javascript

function isValidfile(filename)
{

file_value = filename;
var checkfile = file_value.toLowerCase();
if (!checkfile.match(/(\.doc|\.DOC|\.pdf|\.PDF)$/))
{
return false;
}
else
{
return true;
}
}

image validation in javascript

function isValidImage(imagename)
{

imagefile_value = imagename;
var checkimg = imagefile_value.toLowerCase();
if (!checkimg.match(/(\.jpg|\.gif|\.png|\.JPG|\.GIF|\.PNG|\.jpeg|\.JPEG)$/))
{
return false;
}
else
{
return true;
}
}

To calculate date difference between two given dates

function timeDifference(startDate,endDate)
{

date1 = startDate;
date2 = endDate;

laterdate = date1.split(“-“);
laterY=laterdate[0];
laterM=laterdate[1];
laterD=laterdate[2];

earlierdate = date2.split(“-“);
earlierY=earlierdate[0];
earlierM=earlierdate[1];
earlierD=earlierdate[2];

var laterdate = new Date(laterY,laterM,laterD);
var earlierdate = new Date(earlierY,earlierM,earlierD);

var difference = laterdate.getTime() – earlierdate.getTime();

var daysDifference = Math.floor(difference/1000/60/60/24);
difference -= daysDifference*1000*60*60*24
var hoursDifference = Math.floor(difference/1000/60/60);
difference -= hoursDifference*1000*60*60
var minutesDifference = Math.floor(difference/1000/60);
difference -= minutesDifference*1000*60
var secondsDifference = Math.floor(difference/1000);

return daysDifference;

}

To check leap year

function IsLeapYear(year)
{
if ((year%4)==0)
{
if ((year%100==0) && (year%400)!=0)
{
return false;
}
else
{
return true;
}
}
else
{
return false;
}
}