locked
Data in text box from table RRS feed

  • Question

  • User639567535 posted

    I am creating a table through jQuery and in this table I concatenate 3 columns in 1 column:

    Before concatenate:

    if (re.length > 0) {
        $("#services_schdulue").append
         $('#services_schdulue thead').append("<tr><th>Service ID</th><th>Service Type</th><th>frequency</th><th>Freq_Du</th><th>Freq_Mil</th></tr>");
    
        for (var i = 0; i < re.length; i++) {
            if (re[i] !== null) {
                $('#services_schdulue tbody').append('<tr><td>' + re[i][0] +
                    '</td><td>' + re[i][1] +
                    '</td><td>' + re[i][2] +
                    '</td><td>' + re[i][3]
                    '</td><td>' + re[i][4] +
                    '</td></tr>');
            }
        }
    }

    After concatenate:

    if (re.length > 0) {
        $("#services_schdulue").append
        $('#services_schdulue thead').append("<tr><th>Service ID</th><th>Service Type</th><th>S freq</th></tr>");
    
        for (var i = 0; i < re.length; i++) {
            if (re[i] !== null) {
                $('#services_schdulue tbody').append('<tr><td>' + re[i][0] +
                    '</td><td>' + re[i][1] +
                    '</td><td>' + re[i][2] + '' + re[i][3] + '' + re[i][4] +
                    '</td></tr>');       
            }
        }
    }
    
    var myTable = $('#services_schdulue').DataTable({
        "columnDefs": [{ 
            "visible": false, 
            "targets": [3,4,5] 
        }]               
    });

    Saturday, October 15, 2016 6:43 AM

All replies

  • User-6180675 posted

    use the below code while fetching data in textbox

    $(function () {
                debugger;
    // Add a variable to store datatable reference
    var $dTable = $('#services_schdulue').DataTable(); $('#services_schdulue').on('click', 'tr', function () { $("#myModal").modal("show"); var row = $(this); var serv = row.find('td')[1].firstChild.data; $("#txt_serv").val(serv);
    //No need to show this value it's basically a combo of 3 cell values //var repeat = row.find('td')[2].firstChild.data; // $("#txt_repeat").val(repeat);
    // var dura_values = row.find('td')[3].firstChild.data; // $("#dura_values").val(dura_values) //Instead Show the values from 3 hidden cell

    var repeat = $dTable.row($(this)).data()[3]; // 3rd column for frequency
    $("#txt_repeat").val(repeat);

    var dura_values = $dTable.row($(this)).data()[4]; // 4th column for Duration
    $("#dura_values").val(dura_values)
    var mil = $dTable.row($(this)).data()[5]; //5th column for Mil $("#mil").val(mil); }); });

    Hope that helps

    Check the below link for example

    https://datatables.net/examples/basic_init/hidden_columns.html

    I have used the below command to fetch value from a hidden column in that page using Firebug javascript console

    $("#example ").DataTable().row($("#example tbody tr")).data()[2]

    Sunday, October 16, 2016 11:40 AM
  • User639567535 posted

    CHECK UPDATE

    Monday, October 17, 2016 5:30 AM
  • User-6180675 posted

    var myTable = $('#services_schdulue').DataTable({
        "columnDefs": [{ 
            "visible": false, 
            "targets": [3,4,5] 
        }]               
    });

    Please note that the columns have 0 based index in datatable and you are hiding the the columns having 3,4,5 index which actually contains the data which you want to display

    Now I try to display this columns value in text box

    1. Service Type
    2. frequency
    3. Freq_Duration
    4. Freq_Mileage

    As you mentioned above, I assume your original table which was used to initialize datatable have 6 columns ranging from index 0 to 5. I would prefer using console.log() to log the actual values which are returned from the rows like below

    var rowDate = myTable.row(this).data(); // returns the entire data for the current row
    
    console.log(rowDate[3]); // print the value of Frequency 
    
     $("#txt_repeat").val(rowDate[3]);
    
     var drop = myTable.row(this).data();
    
     console.log(drop[4]); // print the value of Duration
    
     $("#dura_values").val(drop[4]);
    
     var mil = myTable.row(this).data();

    console.log(mil[5]); // print the value of Mil
    $("#text_mil").val(mil[5]);

    I have changed the column indexes to 3,4,5 respectively. Let me know if that works, also check the values in javascript console

    Monday, October 17, 2016 8:02 PM
  • User639567535 posted

    this show me not correct data .. 

    Tuesday, October 18, 2016 6:04 AM