代码之家 › 专栏 › 技术社区 › Prem P.

节点。js复选框迭代

pug checkbox node.js mysql

Prem P. · 技术社区 · 7 年前

如何遍历选中的复选框,而无需硬编码和逐个选中复选框。有点像这个链接,但有节点。js而非JavaScript Iterate all checkbox in JavaScript :

所以我试图显示数据库的内容(使用MySQL),但我不想硬编码'req'。身体如果在表中添加了新列(复选框是给定表中的每一列),则每个复选框的“checkboxName”(复选框名称)。因此,我需要找到一种方法,将迭代通过网页中的每个复选框,看看它是否被选中。如果是,那么我们将把它们添加到一个字符串中,并查询这些列。我下面的代码是针对节点的。js POST方法(选中复选框后点击submit),另一个是我的Pug/Jade代码(我使用的JavaScript模板引擎,抱歉它不是纯html)。

如果您不清楚帕格/杰德文件最初是如何运行的,另一个GET方法会使用列名渲染该帕格/杰德文件;在“//需要帮助”行之前,GET方法基本上是下面的POST方法

节点。js公司

app.post('/GetTables', function(req, res){
    var columnsRequest =  'DESCRIBE ' + tableName;
    var columnsList = [];
    connection.query(columnsRequest, function(err, results, fields) {
        if(err){
             throw err;
        }
        for (var index in results) {
            console.log(results[index].Field);
            columnsList.push(results[index].Field);
        }
    });


    //Need help, the next 5 or so lines are non-working ~psuedocode
    var checkedList = '';    
    req.body.CHECKBOXES.each(function(index, element){
        if(CHECKBOX.ischecked(){
            checkedList += CHECKBOX.name() + ', '
        }
    });


    var mysqlRequest =  'SELECT ' + checkedList + ' FROM ' + tableName;
    connection.query(mysqlRequest, function(err, results, fields) {
        if(err){
            throw err;
        }
        res.render('webPage', {'columnstodisplay': results});
    });

});

哈巴狗/翡翠

form(method = 'POST', action = '/GetTables', id = 'tableform')
    fieldset
        each item in columns
            //this loop sets up the checkboxes for each of the columns
            p
                input(type="checkbox", name=item, value=item)
                span #{item}
                br
        input(type ='submit', value ='Submit')

提前感谢!

1 回复 | 直到 7 年前

Prem P. 7 年前

很抱歉等了一个月才回答我自己的问题。下面是我的代码。基本上,我所做的是当单击submit按钮时,它调用了一个JavaScript函数,查看选中了哪些复选框,并创建了两个隐藏元素;一个复选框数组和要放置在MySQL查询中的字符串(查询要求选中的列/复选框)。

app.post('/GetTables', function(req, res){
    var columnsRequest =  'DESCRIBE ' + tableName;
    var columnsList = [];
    connection.query(columnsRequest, function(err, results, fields) {
        if(err){
             throw err;
        }
        for (var index in results) {
            console.log(results[index].Field);
            columnsList.push(results[index].Field);
        }
    });     
    //changed the line below****
    var mysqlRequest =  'SELECT ' + req.body.checkboxNames + ' FROM ' + tableName;
    connection.query(mysqlRequest, function(err, results, fields) {
        if(err){
            throw err;
        }
        //changed the line below********
        res.render('webPageName', {'columns': columnsList, 'rows': results, 'fields': fields, 'recheckboxes':req.body.checkboxArray});
    });

});

哈巴狗/翡翠

form(method = 'POST', action = '/GetTables', id = 'tableform')
    fieldset
        each item in columns
            //this loop sets up the checkboxes for each of the columns
            p
                input(type="checkbox", name=item, value=item)
                span #{item}
                br
        input(type ='submit', value ='Submit', onclick="sendCBs(document.thisForm, '/gettables')")

        script.
            function sendCBs(form, path, method) {
                var cbNames = '';
                var cbArray = [];
                var count = 0;
                for (var i = 0; i < form.elements.length; i++) {
                    if (form.elements[i].type == 'checkbox') {
                            if (form.elements[i].checked == true) {
                                cbNames += form.elements[i].value + ', ';
                                cbArray.push(form.elements[i].value);
                                count++;
                            }
                        }
                    }
                    if(count > 0){
                        cbNames = cbNames.replace(/,\s*$/, ""); //remove the last comma if 1 or more checkboxes selected
                    }
                    else{
                        return;
                    }

                    method = method || "POST";  //if not specified, method will be post
                    var inputform = document.createElement("form");
                    inputform.setAttribute("method", method);
                    inputform.setAttribute("action", path);

                    var hiddenField1 = createHiddenInput("checkboxNames", cbNames);
                    var hiddenField2 = createHiddenInput("checkboxArray", cbArray);

                    inputform.appendChild(hiddenField1);
                    inputform.appendChild(hiddenField2);

                    document.body.appendChild(inputform);
                    inputform.submit();
                }