这是我的整个代码
<html>
<title>Enable or Disable Agents</title>
<head>
<link href="css/metro-bootstrap.css" rel="stylesheet">
<link href="css/metro-bootstrap-responsive.css" rel="stylesheet">
<link href="css/iconFont.css" rel="stylesheet">
<link href="css/docs.css" rel="stylesheet">
<link href="css/prettify.css" rel="stylesheet">
<!-- Load JavaScript Libraries -->
<script src="js/jquery.min.js"></script>
<script src="js/jquery.widget.min.js"></script>
<script src="js/jquery.mousewheel.js"></script>
<script src="js/jquery.dataTables.js"></script>
<script src="js/prettify.js"></script>
</head>
<body class= "metro">
<script type="text/javascript"
src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script
src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"></script>
<script type=text/javascript>
var cellData;
$(document).on("pageinit", function() {
getTable();
});
function getTable() {
$.ajax({
type : 'GET',
url : "http://192.168.1.8:8080/SurveyApp3/getAgents",
dataType : 'html',
success : function(data) {
var i;
var row;
var jsonData = JSON.parse(data);
createTable(jsonData);
},
error : function(xhr, status, errorThrown) {
console.log(xhr);
console.log(status);
console.log(errorThrown);
}
});
}
function createTable(json) {
var element = "";
var i;
console.log(json.length);
for (i = 0; i < json.length; i++) {
element = element
+ '<tr><td><input type= "checkbox"'+ ( json[i].enabled== "TRUE" ? ' checked' : '' )+ '/></td><td>'
+ json[i].a_id + '</td><td>' + json[i].name + '</td><td>';
}
element = element + '</tbody>';
$('#dataTable > tbody').remove();
$("#dataTable").append(element);
}
function checkAll(ele) {
var checkboxes = document.getElementsByTagName('input');
if (ele.checked) {
for (var i = 0; i < checkboxes.length; i++) {
if (checkboxes[i].type == 'checkbox') {
checkboxes[i].checked = true;
}
}
} else {
for (var i = 0; i < checkboxes.length; i++) {
console.log(i)
if (checkboxes[i].type == 'checkbox') {
checkboxes[i].checked = false;
}
}
}
}
function getCheckedRow() {
var chkbox;
var table = document.getElementById("dataTable");
var rowCount = table.rows.length;
console.log(rowCount);
for (var i = 1; i < rowCount; i++) {
console.log("inside");
var row = table.rows[i];
chkbox= row.cells[0].childNodes[0];
cellData = row.cells[1].childNodes[0].data;
console.log(cellData);
console.log(chkbox.checked);
if (chkbox.checked== true) {
console.log("inside2");
enableDisableInDatabase("true");
}
else
{
console.log("inside3");
enableDisableInDatabase("false");
}
}
return false;
}
function enableDisableInDatabase(enabled) {
var arr= {a_id: cellData, enable: enabled};
$.ajax({
type : 'POST',
url : "http://192.168.1.8:8080/SurveyApp3/enableDisableAgent",
data: JSON.stringify(arr),
dataType : 'html',
async : false,
contentType : 'application/json; charset=utf-8',
success : function(data) {
if (data === "Successful")
document.getElementById("invalid").innerHTML= "Updated Successfully";
else {
console.log("Failed");
document.getElementById("invalid").innerHTML = "Invalid agent id";
}
},
error : function(xhr, status, errorThrown) {
console.log(xhr);
console.log(status);
console.log(errorThrown);
}
});
}
</script>
<h2>ENABLE/DISABLE AGENT(s)</h2>
<br>
<p>Checked boxes will enable agents</p>
<TABLE class="table striped hovered dataTable" id="dataTable">
<thead>
<tr>
<th class="text-left"><INPUT type="checkbox"
onchange="checkAll(this);" name="chk[]" /></th>
<th class="text-left">Agent Id</th>
<th class="text-left">Agent Name</th>
</tr>
</thead>
<tbody></tbody>
</TABLE>
<button onClick= "return getCheckedRow();">Update</button>
<p id="invalid"></p>
我遇到的问题是,第一次执行时,一切正常。但更新一次后,如果我尝试选中/取消选中该函数内的复选框,chkbox= row.cells[0].childNodes[0];
,function getCheckedRow()
code> 代码返回 undefined 而不是 true 或 false。我必须再次按后退按钮,然后重新进入此页面才能正常工作。
我哪里出错了? 谢谢!
最佳答案
所以我真的不知道在phonegap应用程序的上下文中你的代码到底发生了什么,但我认为简化JS将帮助你理解正在发生的事情,并可能揭示任何潜在的问题。
首先,我将向您创建的输入添加一个类和 rel,因此它们看起来像这样:
<input class="agent-checkbox" rel="123456" type="checkbox" checked />
这将使您能够大大简化确定代理已启用和未启用的操作。
我会将您的 getCheckedRow() 函数更新为以下内容...
function getCheckedRow() {
//loop through all elements with agent-checkout class
$('.agent-checkbox').each(function(){
//call the function passing the id via the rel and a boolean if checked or not
enableDisableInDatabase( $(this).attr('rel'), ( $(this).is(':checked') ) );
});
}
最后,我会对函数enableDisableInDatabase() 进行一个小修改,以接受来自getCheckedRow() 函数的a_id,如下所示:
function enableDisableInDatabase(a_id, enabled) {}
下面是我创建的要点链接,旨在向您展示如何将其协同工作的示例。
https://gist.github.com/anonymous/6f36b242e9d7ebee3b56
祝你好运。我希望这有帮助并且有意义。
关于javascript - 音位间隙中的 Jquery,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25451795/