Get hidden column value and omit click on first column

Get hidden column value and omit click on first column

drakula1234drakula1234 Posts: 58Questions: 1Answers: 0
edited May 2012 in General
Please ignore my novice knowledge, I have two things to accomplish,
1. Omit click on the first column because I have a checkbox
2. I have a column at the end of the table which is hidden from display, I tried to use fnGetPosition and fnGetData but doesn't work with my row click event I have selected.

If I remove the td:gt(0), the whole row is clickable and I can get all the values in the json object with simple
[quote]var aData = Table.fnGetData(this); [/quote]and extract my required values but in my case I wanted to restrict the click on the first column as I have checkbox.

[code]
"aoColumnDefs": [{"bVisible": false, "aTargets": [7]},
{"bSortable": false, "aTargets": [0]}]
[/code]

[code]
$('#Table tbody tr td:gt(0))').on("click",function(){
var aPos Table.fnGetPosition(this);
var aData = Table.fnGetData( aPos[6] );
//aData = $(this).parent().parent().html();
xyz = $(this).parent().parent().find("td").eq(1).html();
yzx= $(this).parent().parent().find("td").eq(7).html();
zxy= $(this).parent().parent().find("td").eq(2).html();
alert(aPos);

});
[/code]
Can someone help me with this.
Thanks in advance

Replies

  • allanallan Posts: 63,542Questions: 1Answers: 10,476 Site admin
    You can probably do the click option with jQuery selectors, but here is a slightly different option:

    [code]
    $('#Table tbody').on( 'click', 'td', function () {
    // Ignore clicks on the first TD in a TR
    if ( $(this).index() === 0 ) {
    return;
    }

    var rowData = Table.fnGetData( this );
    alert( 'Last (hidden) column: '+ rowData[ rowData.length-1 ] );
    } );
    [/code]

    Allan
  • drakula1234drakula1234 Posts: 58Questions: 1Answers: 0
    edited May 2012
    Thanks for the reply very much. I tried your approach but it was spitting out the clicked columns value rather than a hidden value. I tried something different. That did the trick for me.

    [code]
    $('#Tabletbody tr').find('td:gt(0)').on("click",function(e){
    e.preventDefault();
    e.stopPropagation();
    var aPos = Table.fnGetPosition(this);
    var aData =Table.fnGetData( aPos[0]);
    serialNumber = $(this).parent().parent().find("td").eq(1).html();
    xyz = $(this).parent().parent().find("td").eq(1).html();
    yzx= aData[7];
    zxy= aData[8];

    });

    [/code]

    I am facing another challenge, after the checkbox is selected I have a button that I have created as a feature plugin on click should read those hidden columns and does an ajax call. Somehow the fnGetPosition and fnGetData doesn't work in that scenario as its spitting out null, not sure what I am missing. I can check more than one checkbox, I am not quite sure of handling all the checked rows in one ajax call or it must do multiple ajax calls.

    [code]
    submitButton.on("click", function() {
    $("Table :checked").each(function(e) {
    var aPos = Table.fnGetPosition(this);
    var aData =Table.fnGetData( aPos[0]);
    alert(aPos);
    Table.fnDraw();

    });
    });

    [/code]
    Thanks in advance!
  • allanallan Posts: 63,542Questions: 1Answers: 10,476 Site admin
    Oops - sorry - I should have had:

    [code]
    var rowData = Table.fnGetData( this.parentNode );
    [/code]

    to get the data for the TR rather than the TD.

    Allan
  • drakula1234drakula1234 Posts: 58Questions: 1Answers: 0
    Thanks Allan for the reply, I changing rowData to this.parentNode is alerting undefined.
    And can you give some input on the other question. I have instead used Table.fnGetData(this.parentNode) in the latter situation and it is showing me instead I would need a value at 7th position. where checkbox is the first element in the array
    [quote]Table.fnGetData(this.node) [/quote] gives me the whole json object with all the values, I need to select the 7th element. Any input on how to get to that.

    sample json object
    [quote]
    ,XYZ,ZSY,ABCS,123,-,0,100,,......

    [/quote]
    I need to get the value 100 into the rowData field

    Thanks!
  • allanallan Posts: 63,542Questions: 1Answers: 10,476 Site admin
    this.parentNode is undefined when 'this' is the TD element? Can you link me to an example of that please?

    > I need to select the 7th element. Any input on how to get to that.

    Use fnGetNodes - not fnGetData. fnGetData gets the internal _string_ representation of the data that DataTables knows about for the rows - not the elements. If you want to interact with the DOM you need to use fnGetNodes (or the $ API method).

    Allan
  • drakula1234drakula1234 Posts: 58Questions: 1Answers: 0
    edited May 2012
    Thanks Allan for the reply, I am on development comp and can't give you an example of it. I have tried fnGetNodes() I am not sure what is restricting from displaying the data. I can give you a link to the debug.
    http://debug.datatables.net/izudum
  • allanallan Posts: 63,542Questions: 1Answers: 10,476 Site admin
    Ah yes sorry - fnGetNodes will only give you the visible TD nodes. If you want all of them you need to use this plug-in: http://datatables.net/plug-ins/api#fnGetTds .

    A bit inconvenient that - I'll be looking at improving that in future.

    Allan
  • drakula1234drakula1234 Posts: 58Questions: 1Answers: 0
    edited May 2012
    Thanks, I have found a workaround to the hidden column though.
    [code]
    submitButton.on("click", function() {
    $("Table :checked").each(function(e) {
    var checkName=Table.fnGetData( this.node);
    var checkIndex = this.name.replace("check_", "");
    xyz = checkName[checkIndex][7];
    alert(aPos);
    Table.fnDraw();

    });
    });
    [/code]
This discussion has been closed.