javascript - 音位间隙中的 Jquery

标签 javascript jquery cordova

这是我的整个代码

<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/

相关文章:

javascript - 配置 Karma 以使用 requirejs 加载 pegjs

javascript - 无限滚动不起作用

javascript - jQuery 不取消选中复选框

javascript - Angular Js 弹出菜单

jQuery 切换 slider

javascript - 使用 iframe 阻止按键的默认操作

android - getUserMedia Android Webview Ionic

jquery - TinyMCE 未在 jquery ui 模式对话框上初始化

javascript - iOS 键盘使用 Phonegap 调整屏幕大小

cordova - 在 iPhone 应用程序中购买实体产品