CODEWITHSUNDEEP
jqueryjquery-uijquery-jtable
Paulo
Paulo

Reputation: 31

Dynamic DeleteAction with jTable-JQuery

I am developing on and using asp.Net "JTable - JQuery (jtable.org)". I would like to show the actions "updateAction" and "DeleteAction" only when the value of the field "Source" is equal to "M".

<script type="text/javascript">
$(document).ready(function () {
    // Define Tooltip temático para a página
    $(document).tooltip();

    // Configura Jtable Itens 1 com retorno Json através de Page Methods de toda a hierarquia, com 'Lazy Loading':
    $('#ItensContainer').jtable({
        title: 'Itens',
        actions: {
            createAction: 'ConItens.aspx/CreateItem',
            listAction: 'ConItens.aspx/ListItens',
            updateAction: 'ConItens.aspx/EditItem',  // if (data.record.Source.toString() == "M")
            deleteAction: 'ConItens.aspx/DeleteItem' // if (data.record.Source.toString() == "M")
        },
        fields: {
            CodeItem: {
                title: 'Item',
                width: '9%',
                edit: false,
            },
            Source: {
                title: 'Source',
                width: '10%',
                create: false,
                edit: false
            },
            LinkDetails: {
                title: '',
                width: '3%',
                display: function (dados) {
                    var $link = '<a href="ConDetailsItem.aspx?CodeItem=' + dados.record.CodigoItem.toString() + '"><img class="Botoes-lupa-detalhes" src="Content/Images/ico_lupa.gif" border=0 title="Detalhe do item"></a>';
                    return $link;
                },
                create: false,
                edit: false
            }
        }
    });
});         // End - Document.ready

Upvotes: 3

Views: 1373

Answers (1)

Nicolas R
Nicolas R

Reputation: 14619

Use the 'rowInserted' event and check your data record (after your fields definition for example):

rowInserted: function (event, data) { 
    //After child row loads. Check if your info and remove the edit/delete buttons if needed
    if (data.record.Source != 'M') { 
        data.row.find('.jtable-edit-command-button').hide(); 
        data.row.find('.jtable-delete-command-button').hide();
    }
}

Its the workaround provided by the creator of jTable: https://github.com/hikalkan/jtable/issues/893

Upvotes: 2

Related Questions