...

View Full Version : Create calendar textfields onclick problem in Firefox



olidenia
08-31-2011, 11:30 AM
Hi, I have the script below working fine in IE but not FF, can any one help me??

The script creates new fields with calendar in a form, if new information is added to a field and then a new field is created the information is lost in FF

Live demo: http://hotelendenia.com/sandbox/


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Calendar Text Input</title>
<script language="javascript" type="text/javascript" src="datetimepicker.js"></script>

<script type="text/javascript">
function extend(m, e){
var e = e || this;
for (var x in m) e[x] = m[x];
return e;
};

function create(type, opt, parent){
var el = document.createElement(type);

if (opt.style){
extend(opt.style,el.style);
}

delete opt.style;

extend(opt,el);

if (parent){
parent.appendChild(el);
}

return el;
}

fields = 0;
function add_input(){
document.getElementById('input_container').innerHTML += ""+ fields +"<input id=\"cal"+ fields +"\" type=\"text\" size=\"25\"><a href=\"javascript:NewCal('cal"+ fields +"','ddmmyyyy')\"><img src=\"cal.gif\" width=\"16\" height=\"16\" border=\"0\" alt=\"Pick a date\"></a> <input type=\"text\" name=\"\" value=\"\"><br>";
fields += 1;
}

</script>

</head>
<body>

<div>
<form>
<div id="input_container">
</div>
<br /><input type="submit" value="submit">
</form>
<a href="#" onclick="add_input()">add input</a>
</div>

</body>
</html>

olidenia
08-31-2011, 12:02 PM
Sorted:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title></title>

<script language="javascript" type="text/javascript" src="datetimepicker.js"></script>
<script type="text/javascript">
var counter = 0;
var limit = 12;
function addInput(divName){
if (counter == limit) {
alert("You have reached the limit of adding " + counter + " inputs");
}
else {
var newdiv = document.createElement('div');
newdiv.innerHTML = ""+ counter +"<input id=\"cal"+ counter +"\" type=\"text\" size=\"25\"><a href=\"javascript:NewCal('cal"+ counter +"','ddmmyyyy')\"><img src=\"cal.gif\" width=\"16\" height=\"16\" border=\"0\" alt=\"Pick a date\"></a> <input type=\"text\" name=\"\" value=\"\"><br>";
document.getElementById(divName).appendChild(newdiv);
counter++;
}
}
</script>

</head>
<body>

<form method="POST">
<div id="dynamicInput"></div>
<input type="button" value="Add another text input" onClick="addInput('dynamicInput');">
</form>
</body>
</html>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum