jeudi 17 août 2017

How to check and uncheck a checkbox and then create a column in the last column of the table

Night all. I have a question here. I have a table that created by javascript function I made. In that table contain a checkbox in each row and the thead has the checkbox too. I have separate the id's of the checkbox for the each row use id mycheckbox and for the thead use id mycheckbox1.

OK now to the problem. I have to try to make all of my checkbox can be checked with the checkbox in the thead with id mycheckbox1. I have try many code that I have found. But no one working. And I try make a fiddle with a table that I manually created with HTML and I can check all the texboxt and it work fine like this fiddle http://ift.tt/2wTvVrL

But when I try to use that in my page it can't work this is the code for the table that I have created

$(document).ready(function(){
        
    $('#submit-file').on("click",function(e){
                if ($('#files').val()== "")
                {
                        alert("Anda Harus Memasukkan File Terlebih Dahulu");
                }
                else{
                e.preventDefault();
                $('#files').parse({
                        config: {
                                delimiter: "",
                                skipEmptyLines: false,
                                complete: displayHTMLTable,
                        },
                        before: function(file, inputElem)
                        {
                                //console.log("Parsing file...", file);
                        },
                        error: function(err, file)
                        {
                                //console.log("ERROR:", err, file);
                        },
                        complete: function()
                        {
                                //console.log("Done with all files");
                        }
                });
                }
    });
        
        function displayHTMLTable(results) {
    var table = "<table class='table table-bordered' width='90%'>";
    var data = results.data;
    var size = -1;
        var check = 7;
    var header = "<thead><tr>";
    header+= "<th width='120'>Kode Material</th>";
    header+= "<th width='140'>Storage Location</th>";
    header+= "<th width='130'>Movement Type</th>";
    header+= "<th width='130'>Id Indentifier</th>";
    header+= "<th width='120'>Date Input</th>";
    header+= "<th width='80'>Netto</th>";
    header+= "<th width='50'>Unit</th>"; 
        header+= "<th width='80'>Payroll</th>"; 
    header+= "<th><input type='checkbox' id='mycheckbox1' name='mycheckbox1' ></th>";
    header+= "</tr></thead>";
    table += header;
    table+="<tbody>";
    for (i = 1; i < data.length; i++) {
        table += "<tr>";
        var row = data[i];
        var cells = row.join(",").split(",");
        if (cells.length < size) continue;
        else if (cells.length > size) size = cells.length;
                if (cells.length > check){
                        alert('Data Yang Anda Masukkan Salah');
                }
                else{
        for (j = 0; j < cells.length; j++) {
                var a = 1.000;
        var b = 10.000;
        var c = 20.000;
        var d = 45.000;

        var callback1 = '10.000';
        var callback2 = '20.000';
        var callback3 = '37.500';
        var callback4 = '45.000';
        table += "<td>";
        table += cells[j];
        table += "</td>";
                }
                if (cells[5]> a && cells[5] <b){
                        table += "<td>"+ callback1 +"</td>"
                }
                else if (cells[5]> b && cells[5] <c){
                        table += "<td>"+ callback2 +"</td>"
                }
                else if (cells[5]> c && cells[5] <d){
                        table += "<td>"+ callback3 +"</td>"
                }
                table += "<td><input type='checkbox' id='mycheckbox' name='mycheckbox'></td>"
        table += "</tr>";  
                }
    }
    table+="</tbody>";
    table += "</table>";
    $("#parsed_csv_list").html(table);
        
}   

});
        
<script src="http://ift.tt/1oMJErh"></script>

After I can checked my checkbox I want to make a new th column in the last row of the thead and in the last row of the each tbody. The value of the column is Tilting when it checked and Borongan when unchecked.




Aucun commentaire:

Enregistrer un commentaire