Conditional Edit/Delete icons per row

[gbisheimer]

It would be nice to have conditional show of edit and delete option icons per row based on row data.

[gzbucki]

I may have misunderstood your question, but i think that your idea depends on data too much so i doubt that there is a chance to make it work in every situation.
ATM the only way to have this kind of option is to make your own extension or ask someone to do so.

[gbisheimer]

shadov155,

I've modified JTable code to make this work already. Just posted this here to include this comment as a Feature in future JTable versions (hopefully).

The idea was to hide edit/delete button on a row if certain conditions for the data on that row are met. For example, I have a system user table. System admins should be able to edit any user, but lower access level users may only edit users of lower access level than themselves.

[hikalkan]

That's very good idea. We can allow user to define a function that receives the record (and other needed data) as parameter and returns true/false. Thanks for your advice :)

[hikalkan]

Can you share your changes to see what you've done for that?

[gbisheimer]

I have just added a new global option to JTable

conditionalActions: {
    updateAction: function( record ){
        return record.type != 4;
    }
}

Then changed the code in function _addCellsToRowUsingRecord on EDIT Extension and DELETE Extension to make button conditionally visible. Code for edit button is:

_addCellsToRowUsingRecord: function ($row) {
    var self = this;
    base._addCellsToRowUsingRecord.apply(this, arguments);

    if (self.options.actions.updateAction != undefined) {
        var $cell = $('<td></td>')
        .addClass('jtable-command-column')
        .appendTo($row);

        if( ( self.options.conditionalActions == undefined || self.options.conditionalActions.updateAction == undefined || self.options.conditionalActions.updateAction( $row.data('record') ) )){
            var $span = $('<span></span>').html(self.options.messages.editRecord);
            var $button = $('<button title="' + self.options.messages.editRecord + '"></button>')
            .addClass('jtable-command-button jtable-edit-command-button')
            .append($span)
            .appendTo($cell)
            .click(function (e) {
                e.preventDefault();
                e.stopPropagation();
                self._showEditForm($row);
            });
        }
    }
},

For delete button is similar. Perhaps you should change the name for options for a better/more suitable name. Hope it helps.

[hikalkan]

Hi,

Thanks a lot for your solution, I checked it and good one.

But I may prefer another approach for that. Now, updateAction is like that:

$('#MyTableContainer').jtable({
     
    //...
    actions: {
        updateAction: '/Demo/UpdatePerson'
        //...
    },
    fields: {
        //Field definitions comes here
    }
});     

It can get only a URL string. I can add an option to get an object like that:

$('#MyTableContainer').jtable({
     
    //...
    actions: {
        updateAction: {
            url: '/Demo/UpdatePerson',
            enabled: function(data) {
                return data.record.type != 4;
            },
            //other options such as success, error callbacks, HTTP method (POST|GET...) can be added later.
        }
        //...
    },
    fields: {
        //Field definitions comes here
    }
});

This can be a more general solution without adding new conditionalActions part in the configuration. Also url can be a function to allow user change url and it's parameters according to record.

I'll think on that to find a more general solution.

[gbisheimer]

That's a better approach, but I tried to maintain compatibility with previous version of JTable, so users don't need to change their code every time a new JTable version comes out.
With this purpose in mind, I think you should check every time you use updateAction option in your code if it's a string or an object. If it's a string, just proceed as usual. Otherwise, use the new information provided in the object members maintaining compatibility.

I think you should do this for the option field mentioned in #73 also, as in may not always need to be a function of the data and can be a fixed option object, array or an URL.

[hikalkan]

Yes, backward compability is the most important thing for a library and I consider it always. In the #73, function is added a new way of defining options. You can still set url or object like before. Also, updateAction can be string or object anymore. That's acceptable according to the nature of javascript programming.
I appreciate for your advices and helps to developing jTable :)

[gbisheimer]

That's ok hikalkan :) I'm glad I can contribute to this great project.

About #73, i was just making sure you are using typeof checking in your code, because you haven't published the latest version yet. Looking forward to see the new release soon !!

Cheers!

[lnong]

Hi, I am needing the same functionality as well. I want to be able to show/hide (or enable/disable) the Edit and Delete icons based on some condition (record data or member role), The suggestion of making the updateAction to include a "Enabled" option which accepts a function would work perfectly.

When do you expect this feature to be available?

[hikalkan]

See #893 for a good workaround.

[saysiva]

I have a code like this.

           esxHostName: {
               title: 'ESX Host Name'

           },
           farmName: {
               title: 'Farm Name'

           },
           dataCenter: {
               title: 'Data Center',
               create: false,
               edit: false
           },
           noOfCluster : {
               title: 'No. of Cluster'
           },
           readyForMaintenance: {
               title: 'Ready for Maintenance',

           }

the last field "readyForMaintenance' is a boolean value. need to display different icons for True / False.
How to use the if condition in this case.

[nagarjuna143]

Hi sir

how to display success message on adding record in jtable like if we click save button it displays successfully added record.

[TVMD]

Many thanks from VN. @gbisheimer, you are real life saver :)