editor fields: how to add "select2" to a field if another field value has a certain value?

editor fields: how to add "select2" to a field if another field value has a certain value?

sharpBCDsharpBCD Posts: 12Questions: 3Answers: 0

Is it possible to conditionally change the input form type in editor?
I have a table with a list of transports associated to an order. Loading and unloading destination can be any string but if the transport type is a ship then only pre-loaded list of ports should me allowed.
That is required for statistics purpose where a misspelling of the port name can ruin the results.

Code is like bellow:

$(document).ready(function() {
    var editor = new $.fn.dataTable.Editor( {
        ajax: 'php/pageOrderTabTransport.php?id_order=' + id_order ,
        table: '#tabel_transport',
        fields: [
            {
                label: "Type:",
                name: "otc_transport.id_tip",
                type: "radio",
                ipOpts: [
                    {label: '<i class="fa fa-ship fa-2x color-1 space-bottom-1"></i> Ship', value: '1'},
                    {label: '<i class="fa fa-plane fa-2x color-2 space-bottom-1"></i> Plane', value: '2'},
                    {label: '<i class="fa fa-truck fa-2x color-3 space-bottom-1"></i> Truck', value: '3'},
                    {label: '<i class="fa fa-train fa-2x space-bottom-1"></i> Train', value: '4'},
                    {label: '<i class="fa fa-cogs fa-2x color-4 space-bottom-1 "></i> Custom', value: '5'}
                ],
                default: "1"
            },
       {
        label: "Loading from:",
        name: "otc_transport.loading_city"

/////   if Type is 1 (ship) then instead of regular string to be entered, user must select2 from a list of enlisted ports.
////    so I need to add something like:
                type: "select2",
                options: ListOfPortsLoad()

            },
// more code...

This question has an accepted answers - jump to answer

Answers

  • allanallan Posts: 63,839Questions: 1Answers: 10,518 Site admin
    Answer ✓

    Is it possible to conditionally change the input form type in editor?

    No sorry. You would need to use clear() to remove the field and then add() to create a new field with the new field type.

    Another option might be to have two fields for the loading city, one which is shown when the transport type is ship and the other when it isn't. You could then use a formatter at the server-side, or a server-side event to pull in the correct value when writing to the database.

    Allan

  • sharpBCDsharpBCD Posts: 12Questions: 3Answers: 0
    edited January 2017

    Thank you Allan for reply.
    Second version could do it better. I could use without problems 2 versions: one with string, the other with the id_port.

    I found the documentation for this field().hide() but no example.

    Can you point me toward an example how this is implemented? All I could found is with legacy.

    P.S. You really need to do something about the legacy. At this point it's just useless imho.

  • allanallan Posts: 63,839Questions: 1Answers: 10,518 Site admin

    There are a couple of code examples at the bottom of the page you linked to. basically you just need to use the Editor instance and call that method to hide the field you want:

    editor.field( 'myField' ).hide();
    

    You would probably want to listen for the change event from the parent field (which you can do using field().input().

    P.S. You really need to do something about the legacy. At this point it's just useless imho.

    There shouldn't be any legacy information about Editor. Its client-side API is fully backwards compatible with the 1.0 release of Editor.

    Do you mean the DataTables Hungarian notation stuff? That does need to be demoted somewhat, but given that it is still valid and supported in 1.10 it is still relevant and many questions can be answered from the old threads.

    Allan

This discussion has been closed.