Table Editor Plugin, Disable Fields From Being Edited


Topic: Table Editor Plugin, Disable Fields From Being Edited

mhoskins asked 5 years ago

Expected behavior

While using the plugin I need the ability to disable fields in a table from being edited. I will use Ajax to update the data in the table but I since some of the data is generated with methods I cannot allow that data to be changed with the editor.

Actual behavior

There are no options allowing this change here: https://mdbootstrap.com/plugins/jquery/table-editor/#options

How do I do this?

Resources (screenshots, code snippets etc.)


Piotr Glejzer staff commented 5 years ago

Hello,

I think it's not possible to do it now. If you want to do this you probably have to edited source code and add disabled=true to each table row/table data while the selected row was edit.

Best,Piotr


mhoskins answered 5 years ago

While looking at the source there was an easy fix.

First pass in an additional option which is a string list of the column titles you want excluded.

 $('#export').mdbEditor({
            contentEditor: true,
            disregard_list: ['Type', 'Phone', 'Options'],
        });

Then change this method around to short circuit based on the titles you choose to pass through option.disregard_list

clickOnTd = function (ev) {
                 const focusInput = e => $(e).focus(),
                 $this = $(this),
                 $eTarget = $(ev.target),
                 $dtHeadTitle = $($wrapperEditor.find('thead th')[$DataTable.cell($this).index().column]).text().replace(/\s/g, '').toLowerCase();
               // if title found in disregard list don't do a thing
              if (jQuery.inArray($dtHeadTitle, options.disregard_list) !== -1) {
                        return
              }
            ...
              if (!$this.children().hasClass('mdb-content-dynamic-input')) {
                      $this.html(`${$this.text()} <input type='text' class='form-control mdb-content-dynamic-input' value='${$this.text()}'/> <span class='d-none dynamic-span'>${$this.text()}</span>`);
                        focusInput('.mdb-content-dynamic-input');
                    }

            ...

Piotr Glejzer staff commented 5 years ago

Thanks. I added this to the jQuery team list to implement in a package. Have a nice day.


numentec commented 5 years ago

I'll wait for it...


Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue
  • User: Free
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: 4.8.11
  • Device: No
  • Browser: Chrome
  • OS: Linux
  • Provided sample code: No
  • Provided link: Yes