Same table two actions.

bake09

Link to test case:

Hi,

I'm using a In my laravel(with Jquery) Project a table inside an Bootstrap Modal.
This Modal and the used table can be triggered in two states "show" and "edit".

I'm using some editor functions and option.

My Question:

How can i change the editors editable fields from 3 columns two 1 column,
and hide one custom Button "Auftrag".

In my Code i have a varibale which saves the action of the modal when opening.

How can i conditional use an if else statment for hide some editable columns and buttons?

Can someno please give me an instruction?

Thank you!

bake09

<table id="teileliste" class="table table-hover table-bordered table-striped" width="100%">
<thead>
<tr>
<th width="15%">Teilenummer</th>
<th width="15%">Bezeichnung</th>
<th width="5%">Menge</th>
<th width="5%">Geliefert</th>
<th width="10%">Lagerort</th>
<th width="15%">Status</th>
<th width="15%">Ext. Auftragsnr.</th>
<th width="5%">Code</th>
<th width="15%">Bemerkung</th>
</tr>
</thead>
</table>

<script>
/* OpenModal Action*/

var action = button.data('action');
var editor = new $.fn.dataTable.Editor({ table: "#teileliste", fields: [{ label: "Menge", name: "menge" }, { label: "Code", name: "code" }, { label: "Lieferdatum", name: "lieferdatum", type: 'datetime', def: function() { return new Date(); } }, { label: "Bemerkung", name: "bemerkung" }], i18n: {```

remove: {
title: "Löschen",
submit: "Löschen",
confirm: {
_: "Möchtest du die %d Positionen löschen?",
1: "Möchtest du die Position löschen?"
}
}
}
});

var table = $("#teileliste").DataTable({
"language": {
url: "{{ asset('js/dataTables.german.json') }}"
},
"dom": 'Bt',
"scrollY": "30vh",
"scrollCollapse": false,
"paging": false,
"info": false,
"autoWidth": false,
"orderable": true,
"bSort": true,
columns: [{
data: "teilenummer"
}, {
data: "bezeichnung"
}, {
data: "menge"
}, {
data: "ausgeliefert"
}, {
data: "warehouse"
}, {
data: "status"
}, {
data: "customer_ref"
}, {
data: "code"
}, {
data: "bemerkung"
}, {
data: "lieferdatum"
}, ],
select: {
style: 'os',
selector: 'td:first-child'
},
buttons: [{
text: 'Auftrag',
action: function(e, dt, node, config) {
$("#modal_auftragsdaten").modal('show');
}
}, {
extend: "remove",
text: 'Löschen',
editor: editor
}],
});
</script>

colin

You could add some logic into preOpen to do that - calling field().hide() to remove the field.

Colin

bake09

Hi Colin,

Tank you for this tipp...

Can you please give me an example snippet?

here is my if-statement:

if(action == "view"){

    editor.on( 'preOpen', function ( e )  {

      //How to disable/hide the editable-functionality 
      // of the 3rd Field "Menge" 

    }
}else if (action == "edit"){
    editor.on( 'preOpen', function ( e )  {

    // How to hide my custom button "Auftrag"

    }
}

Thank you!

colin

You can do something like this : http://live.datatables.net/darelazo/1/edit . It's making the 'Age' field read-only on the edit form, but writable on the create form.

Colin