I've been using the clockpick plugin (it's awesome) and I load the
form which uses the plugin via an ajax call.
The plugin works perfectly in FF and Safari, but in ie 6&7, it only
shows a grey box at the bottom of the page.
I've look through other comments here in the jquery groups, but the
other resolutions don't apply to this instance.
If I attach clockpick to an input box in the main page, it works no
problem, so this only affects input boxes on a form retrieved through
ajax in ie.
I have included an alert so I know when the function is triggered.
strangely, the alert triggers in FF but not in IE
The things i've tried that didn't work are
a) move the content of templateShifts function into the success:
function
b) put the clockpick.js and css into the ajax add.php form (this
called all sorts of strange jquery errors in ie)
c) putting just the clockpick css into the ajax add.php
the code which calls the clockpick is
[code]
function getClicks(){$(".add").click(function(event) {
var id = this.id;
var posTop = event.pageY-100;
var posLeft = event.pageX-200;
var formID = "#addForm";
$.ajax({
type: "POST",
url: "add.php",
data: id,
success: function(response){
$(formID).css({ position: 'absolute',
top: posTop, left:
posLeft });
$(formID).fadeIn("slow").html(response);
cancelForm(formID);
templateShifts();
}
});
});
};
function templateShifts(){
alert('templateShifts')
$("#startTime").clockpick(function(event){
var posTop = event.pageY+340;
var posLeft = event.pageX;
$("#CP_hourcont").css({ position: 'absolute',
top: posTop, left:
posLeft });
});
$("#endTime").clockpick();
$(".templateShift").click(function(){
var id=this.id;
var times_array=id.split("-");
$("#startTime").val(times_array[0]);
$("#endTime").val(times_array[1]);
});
};
[/code]
the code of the ajax(ed) from is
[code]
<html>
<head>
<title>add form</title>
</head>
<body>
<script type="text/javascript">
var uid = "79";
var cid = "";
var sid = "3";
var date = "2008-02-04";
var swapuid = "";
</script>add a new 2008-02-04<br />
<fieldset>
<legend> on 2008-02-04</legend> Start
Time: <input
name="inputStartTime" type="text" id="startTime"
>
End Time: <input name="inputEndTime"
type="text" id="endTime">
<input type="hidden" name="sid" value="3" />
<input type="hidden" name="uid" value="79" />
<input type="hidden" name="date"
value="2008-02-04" />
<input type="hidden" name="f" value="n" />
</fieldset>
Add Note (optional)<br />
<textarea name="note" rows="4" cols="20" />
<input type="submit" value="submit" /></body>
</html>
[/code]
