Add Class/ID to Lightbox Editor

dataman123

Link to test case:

var employeesEditor = new $.fn.dataTable.Editor( {
    ajax: "api/employees",
    table: "#employeesTable",
    fields: [ {
            label: "Name",
            name: "fname"
        }
    ]
} );

var detailsEditor = new $.fn.dataTable.Editor( {
    ajax: "api/employees",
    table: "#employeesTable",
    fields: [  {
          label: "Street Address",
          name: "address"
        }, {
          label: "City",
          name: "city"
        }, {
          label: "State (2 letters)", 
          name: "state"
        }, {
          label: "ZIP",
          name: "zip"
        }, {
          label: "Phone",
          name: "phone1"
        }, {
          label: "Mobile",
          name: "phone2"
        }, {
          label: "Email",
          name: "email"
        }, {
          label: "Social Security",
          name: "ssn"
        }, {
          label: "Active",
          name: "active",
          type: "hidden",
          def: 0
        }
    ]
} );

Description of problem:
I have two editors on the same page and I want the second one to have two columns, like in this example: Multi-column layout.
Can I add an ID or class to the details editor somewhere in the code above, or should I add an event listener for the open event and put it in like this:

detailsEditor.on('open', function(e){
...
})?

colin

Yep, that's the way to go, as there isn't a method to add classes to the form during the initialisation. You could do something like this, which is adding a class in that event:

  editor.on('open', function() {
    $('div.DTE_Body').addClass('twoColumns')
  })

Colin

dataman123

Thanks a lot!