Editor - show field on condition

Gotcha007

Hi guys, I would like to know if it's possible to show a field on condition.
consider the code below:

$(document).ready(function() {
        editor = new $.fn.dataTable.Editor( {
            ajax: "./CtrlData/CtrlData-Onboarding.php",
            table: "#example",
            fields: [ {
                    label: "ComitId:",
                    name: "db_ob_Main.ComitID"
                }, {
                    label: "Name:",
                    name: "db_ob_Main.UserName"
                }, {
                    label: "Seat:",
                    name: "db_ob_Main.Seat"
                },{
                    label: "Workstation type:",
                    name: "db_ob_Main.Wks",
                    type: "select",
                    options: [
                        { label: "Desktop", value: 1 },
                        { label: "Blade", value: 2 },
                        { label: "Laptop", value: 3 },
                        { label: "MacBook", value: 4 },
                        { label: "Surface", value: 5 }
                    ]
                },{
                    label: "Workstation Installed:",
                    name: "db_ob_Main.WksInst",
                    type: "select",
                    options: [
                        { label: "No", value: 1 },
                        { label: "Yes", value: 2 }
                    ]
                }
            ]
        } );

Is it possible to only show

{
                    label: "Workstation Installed:",
                    name: "db_ob_Main.WksInst",
                    type: "select",
                    options: [
                        { label: "No", value: 1 },
                        { label: "Yes", value: 2 }
                    ]
}

when db_ob_Main.Wks != 2

allan

Absolutely! This is a perfect use case for dependent(). See this example.

Allan

Gotcha007

Works great! Thanks a lot!
I still have one slight issue. As I'm using inline editing and Bubble, when I click it still shows the bubble (without the drop down list)
Is there a way to also prevent the bubble to show up only for that field with that dependent option?

        $('#example').on( 'click', 'tbody td:not(:first-child)', function (e) {
            editor.bubble( this );
        } );

allan

A multiple field dependency isn't really suited for use with inline editing since it can only show a single field at a time. You'd need to use a bubble editor, editing both fields.

Allan

Gotcha007

Sorry, I probably explained myself wrong.
When db_ob_Main.Wks is set to 2, the dependent option will not show the db_ob_Main.WksInst field. The only issue is that when I click on that field (not using the edit button), it still shows up the bubble but empty. So it works as it prevent you to update but I would also to prevent the bubble to show up when that field is set to 2

allan

Ah I see - thanks for the clarification. You need to modify the event handler you are using to call the bubble() method. It should use row().data() to get the data for the row that was clicked up and check to see if the bubble editor should be shown at all.

Allan

Gotcha007

That's exactly what I needed! Thanks a lot for all your help.