<?php
?>
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
jTimesheetid = "";
jTimesheetweekending = "";
jPersonnelNo = "";
jLastInsertID = "";
jWorkCodes = "";
tabletdetails = "";
$(document).ready(function() {
$.ajax({
type: "POST",
url: "php.scripts/timesheet.getsession.php",
data: { },
async: false
}).done(function( msg ) {
obj = JSON.parse(msg);
jTimesheetid = obj.timesheetid;
jTimesheetweekending = obj.timesheetweekending;
jPersonnelNo = obj.personnelno;
});
$.ajax({
type: "POST",
url: "php.scripts/buildselect.jobs.php",
data: { },
async: false
}).done(function( msg ) {
jQuery("#daddtablet").append(msg);
jQuery("#daddtablet select").css('margin','1px');
jQuery("#daddtablet select").css('width','200px');
jQuery("#daddtablet select").css('height','20px');
});
$("#baddtablet").click(function() {
$.ajax({
type: "POST",
url: "php.scripts/tablet.add.php",
data: { jobno: jQuery("#daddtablet select").val() },
async: false
}).done(function( msg ) {
alert( msg );
window.location.reload();
});
});
$.ajax({
type: "POST",
url: "php.scripts/timesheet.getall.php",
data: { },
async: false
}).done(function( msg ) {
//alert( msg );
jTablets = JSON.parse(msg);
for (var i = 0; i < jTablets.length; i++) {
(function(i) {
//jQuery("body").append("x");
jQuery("body").append("<br>");
jQuery("body").append("<div class=\"wrapperouter\" id=\"tablet"+jTablets[i].idtablets+"\"></div>");
jQuery("#tablet"+jTablets[i].idtablets).append("<div class=\"jobno\" id=\"jobno_tablet"+jTablets[i].idtablets+"\">"+jTablets[i].jobno+"</div>");
jQuery("#tablet"+jTablets[i].idtablets).append("<div class=\"jobname\" id=\"jobname_tablet"+jTablets[i].idtablets+"\"><span>JobName:</span>"+jTablets[i].nname+"</div>");
jQuery("#tablet"+jTablets[i].idtablets).append("<div class=\"jobclient\" id=\"jobclient_tablet"+jTablets[i].idtablets+"\"><span>JobClient:</span>"+jTablets[i].companyname+"</div>");
jQuery("#tablet"+jTablets[i].idtablets).append("<div class=\"weekending\" id=\"weekending_tablet"+jTablets[i].idtablets+"\"><span>WeekEnding:</span>"+jTimesheetweekending+"</div>");
jQuery("#tablet"+jTablets[i].idtablets).append("<div class=\"tablewrapper\" id=\"tablewrapper_tablet"+jTablets[i].idtablets+"\"></div>");
var jHTML = "<div class=\"headercolumn0\" id=\"headercolumn0_tablet"+jTablets[i].idtablets+"\"> <span>Dash</span> </div> <div class=\"headercolumn1\" id=\"headercolumn1_tablet"+jTablets[i].idtablets+"\"> <span>Description</span> </div> <div class=\"headercolumn2\" id=\"headercolumn2_tablet"+jTablets[i].idtablets+"\"> <span>Work Code</span> </div> <div class=\"headercolumn3\" id=\"headercolumn3_tablet"+jTablets[i].idtablets+"\"> <span>M</span> </div> <div class=\"headercolumn4\" id=\"headercolumn4_tablet"+jTablets[i].idtablets+"\"> <span>TU</span> </div> <div class=\"headercolumn5\" id=\"headercolumn5_tablet"+jTablets[i].idtablets+"\"> <span>W</span> </div> <div class=\"headercolumn6\" id=\"headercolumn6_tablet"+jTablets[i].idtablets+"\"> <span>T</span> </div> <div class=\"headercolumn7\" id=\"headercolumn7_tablet"+jTablets[i].idtablets+"\"> <span>F</span> </div> <div class=\"headercolumn8\" id=\"headercolumn8_tablet"+jTablets[i].idtablets+"\"> <span>SA</span> </div> <div class=\"headercolumn9\" id=\"headercolumn9_tablet"+jTablets[i].idtablets+"\"> <span>SU</span> </div> <div class=\"headercolumn10\" id=\"headercolumn10_tablet"+jTablets[i].idtablets+"\"> <span>T</span> </div> <div class=\"headercolumn11\" id=\"headercolumn11_tablet"+jTablets[i].idtablets+"\"> <span>DEL</span> </div>";
jQuery("#tablewrapper_tablet"+jTablets[i].idtablets).append(jHTML);
/*********************************************/
// cycle through the details
$.ajax({
type: "POST",
url: "php.scripts/tablet.getdetails.php",
data: { tabletid: jTablets[i].idtablets },
async: false
}).done(function( msgg ) {
objj = JSON.parse( msgg );
for (var cc = 0; cc < objj.length; cc++)
{
(function(cc) {
console.log(objj[cc].idtabletdetails);
var tIDTabletdetails = objj[cc].idtabletdetails;
jHTML = "<div class=\"column0\"><input type=\"text\" value=\""+objj[cc].dash+"\" /></div> \
<div class=\"column1\"><input type=\"text\" value=\""+objj[cc].description+"\" /></div> \
<div class=\"column2\"><input type=\"text\" value=\""+objj[cc].workcode+"\" /></div> \
<div class=\"column3\"><input type=\"number\" value=\""+objj[cc].m+"\" /></div> \
<div class=\"column4\"> <input type=\"number\" value=\""+objj[cc].tu+"\" /></div> \
<div class=\"column5\"> <input type=\"number\" value=\""+objj[cc].w+"\" /></div> \
<div class=\"column6\"><input type=\"number\" value=\""+objj[cc].t+"\" /></div> \
<div class=\"column7\"><input type=\"number\" value=\""+objj[cc].f+"\" /></div> \
<div class=\"column8\"><input type=\"number\" value=\""+objj[cc].sa+"\" /></div> \
<div class=\"column9\"> <input type=\"number\" value=\""+objj[cc].su+"\" /></div> \
<div class=\"column10\"> <input type=\"number\" value=\"\" /></div> \
<div id=\"tablet"+jTablets[i].idtablets+"row"+cc+"\" class=\"column11\"><span>x</span> </div>";
jQuery("#tablewrapper_tablet"+jTablets[i].idtablets).append(jHTML);
jQuery("#tablet"+jTablets[i].idtablets+"row"+cc).html(tIDTabletdetails);
jQuery("#tablet"+jTablets[i].idtablets+"row"+cc).on('click', function()
{
//console.log(jTablets[i].idtablets);
//console.log(objj[cc].idtabletdetails);
$.ajax({
type: "POST",
url: "php.scripts/tablets.deleterow.php",
data: {
idtablets: jTablets[i].idtablets,
idtabletdetails: tIDTabletdetails
},
async: false
}).done(function( msg ) {
alert( msg );
window.location.reload();
});
});
})(cc);
}
});
// end cycle through the details
/**********************************************/
jHTML = "<div style=\"clear: both;\"><input class=\"botbutton\" type=\"button\" id=\"addrowtablet"+jTablets[i].idtablets+"\" value=\">>\" /> \
<input class=\"botbutton\" type=\"button\" id=\"savetablet"+jTablets[i].idtablets+"\" value=\"save\" /> \
<input class=\"botbutton\" type=\"button\" id=\"deletetablet"+jTablets[i].idtablets+"\" value=\"delete\" /></div>";
jQuery("#tablet"+jTablets[i].idtablets).append(jHTML);
//add row to tablet
jQuery("#addrowtablet"+jTablets[i].idtablets).on('click', function()
{
$.ajax({
type: "POST",
url: "php.scripts/tablet.addrow.php",
data: { idtablets: jTablets[i].idtablets },
async: false
}).done(function( msg ) {
//alert( msg );
window.location.reload();
});
});
//save tablet
jQuery("#savetablet"+jTablets[i].idtablets).on('click', function()
{
alert("alertsepy2...");
});
//delete tablet
jQuery("#deletetablet"+jTablets[i].idtablets).on('click', function()
{
console.log("jTablets[i].jobno: "+jTablets[i].jobno);
console.log(jTablets[i].idtablets);
$.ajax({
type: "POST",
url: "php.scripts/tablet.delete.php",
data: { idtablets: jTablets[i].idtablets },
async: false
}).done(function( msg ) {
//alert( msg );
window.location.reload();
});
});
})(i);
}
});
});
</script>
</head>
<body>
<div id="addtablet" style="border: 1px solid black; overflow: hidden;">
<div id="daddtablet" style="float: left; padding: 0px;"></div><input type="button" id="baddtablet" value="add.tablet" style="margin: 0px; height: 22px; padding: 0px;" />
</div>
</body>
在我的代码中，我正在使用两个嵌套的匿名函数，例如：
(function(i) {
(function(cc) {
})(cc);
})(i);
我遇到了一些问题，似乎是程序中的错误，其中“ objj [cc] .idtabletdetails;”的值读取不正确，导致我在这一行将其拉出到变量中：
var tIDTabletdetails = objj[cc].idtabletdetails;
一旦将值提取到tIDTabletdetails，程序就可以正常运行。当我尝试在其中引用“ objj [cc] .idtabletdetails”时，发生了问题：
jQuery("#tablet"+jTablets[i].idtablets+"row"+cc).on('click', function()
{
//console.log(jTablets[i].idtablets);
//console.log(objj[cc].idtabletdetails);
$.ajax({
type: "POST",
url: "php.scripts/tablets.deleterow.php",
data: {
idtablets: jTablets[i].idtablets,
idtabletdetails: tIDTabletdetails
},
async: false
}).done(function( msg ) {
alert( msg );
window.location.reload();
});
});
我想知道是否有更好的方法可以保留“ i”和“ cc”的值，或者是否应该以不同的方式编码匿名函数。
提前致谢...
最佳答案
最好是捕获您感兴趣的值，而不是迭代器，所以...
for (var i=0...) {
(function() {
})(data[i])
}
...但是，在查看您的代码后，我强烈建议您使用像Backbone或Ember这样的MV *框架，如果您尚未将它们签出，那应该会大大简化您的生活！
http://backbonejs.org/
http://emberjs.com/