Responsive and Selected Columns only

Responsive and Selected Columns only Posts: 12Questions: 3Answers: 0
edited February 20 in Editor

As seen here, and here, we can have inline editing of columns that have been hidden in the responsive UI. The issue is we can't get it to only allow editing on the editable columns only.


  • colincolin Posts: 4,694Questions: 0Answers: 823

    Hi ,

    This example here is based on those links you created, and it's behaving as expected - only the editable fields in the responsive area are editable. Would you be able to change that example please to demonstrate your problem,



  • Posts: 12Questions: 3Answers: 0

    I'll try. What I am looking for is to click on the circled area of editable fields only. Let's say Defective Qty was not editable. The issue is in the ul, the fields do not have editable class.

    Notice how the child row does not contain editable class anywhere.

  • Posts: 12Questions: 3Answers: 0
    edited February 23

    Basically trying to do this

     // Activate an inline edit on click of a table cell
                         $('#tblCylinders').on('click', 'tbody td:not(.child), tbody span.dtr-data', function (e) {
                              // Ignore the Responsive control and checkbox columns
                              if ($(this).hasClass('control') || $(this).hasClass('select-checkbox')) {
                              if ($(this).hasClass('editable'))
  • allanallan Posts: 49,501Questions: 1Answers: 7,286 Site admin

    Something like this should do it: .

    You can use the li from the child row as a cell selector (since it represents a cell in the table, it has that ability built into Responsive) which will let you lookup the original cell and check its class.


  • Posts: 12Questions: 3Answers: 0

    Perfect. That solves the problem. Thanks.

Sign In or Register to comment.