मैं गिजगो ग्रिड का उपयोग कर रहा हूं और मैंने सेलडाटाबाउंड ईवेंट का उपयोग करके ग्रिड पंक्तियों में एक बटन जोड़ा है लेकिन मुझे बटन क्लिक ईवेंट को आग में नहीं मिल सकता है। क्या किसी को पता है कि मुद्दा क्या हो सकता है?

CompanyUsersGrid.on('cellDataBound', function (e, $displayEl, id, column, record) {
if ('Subscribed' === column.field) {
       if (record.Subscribed === '1') {
           $displayEl.html('<Span style="color: green;">Subscribed</Span>');
       }
       else if (record.Subscribed === '0') {
           $displayEl.html('<button type="button" id="btnCompanyUserSubscribed" style="width: 92px;" class="btn btn-danger">Renew</button>');
       }
   }
});


 $('#btnCompanyUserSubscribed').on('click', function (e) {
     alert('Button has been clicked')
 })
0
Grey Walker 3 अप्रैल 2018, 23:11

4 जवाब

सबसे बढ़िया उत्तर

मुझे लगता है कि यह सबसे अच्छा होगा यदि आप इसके बारे में column.renderer का उपयोग करते हैं। तत्व के निर्माण के ठीक बाद आपको क्लिक ईवेंट असाइन करना चाहिए।

 <table id="grid"></table>
 <script>
     var subscribeRenderer = function (value, record, $cell, $displayEl) {
         var $btn = $('<button type="button" class="btn btn-danger">Renew</button>').on('click', function () {
            alert('clicky');
         });
         $displayEl.empty().append($btn);
     };
     $('#grid').grid({
         dataSource: '/Players/Get',
         columns: [
             { field: 'ID', width: 56 },
             { field: 'Name' },
             { field: 'subscribe', renderer: subscribeRenderer  }
         ]
     });
 </script>

उपरोक्त कोड सेलडाटाबाउंड ईवेंट के साथ भी उपयोगी होना चाहिए।

2
Atanas Atanasov 11 अक्टूबर 2018, 10:55

आप अपना बटन इस तरह बना सकते हैं:

$(document).ready(function () {
    function Edit(e, type) {  
        alert("Button was clicked for row: " + e.data.record.recid)
    }
    grid = $("#myGrid").grid({    
        dataKey: "recid",
        uiLibrary: "bootstrap",
        dataSource: //SomeURL,
        columns: [
                { field: 'recid', title: 'RecordID', width: 20, resizable: true, align: 'center' },
                { title: 'Edit', field: 'Edit', width: 15, type: 'icon', icon: 'glyphicon-pencil', tooltip: 'Edit', events: { 'click': Edit }, align: 'center' }
            ]
        });    
});

सबसे महत्वपूर्ण हिस्सा आपके संपादन फ़ंक्शन को यहां कॉल कर रहा है:

events: { 'click': Edit }
0
Kenan Begić 21 नवम्बर 2019, 10:02

इसे एक फ़ंक्शन बनाएं और इसे इस तरह करें:

$(document).ready(function () {
    CompanyUsersGrid.on('cellDataBound', function (e, $displayEl, id, column, record) {
    if ('Subscribed' === column.field) {
           if (record.Subscribed === '1') {
               $displayEl.html('<Span style="color: green;">Subscribed</Span>');
           }
           else if (record.Subscribed === '0') {
               $displayEl.html('<button type="button" id="btnCompanyUserSubscribed" style="width: 92px;" class="btn btn-danger">Renew</button>');
               $('#btnCompanyUserSubscribed').on('click', CompanyUserSubscribed);
           }
       }
    });
});


function CompanyUserSubscribed() {
     alert('Button has been clicked');
}
0
MB34 4 अप्रैल 2018, 19:42

कॉलम के अंदर ईवेंट क्लिक फ़ंक्शन दें और सेलडेटाबाउंड का उपयोग करें। इस तरह

 reportGrid = $('#eventReportData').grid({
        primaryKey: 'UserPrivilegeRequestsID',
        autoLoad: false,
        responsive: true,
        bodyRowHeight: 'fixed',
dataSource: '/Admin/GetDiscrepencyReport',
        columns: [
            {
                field: 'UserName', title: 'Trainer', sortable: true,
                events: {
                    'click': function (e) {
                        var userName = e.data.record.UserName;
                        popupGrid(userName);
                    }
                }
            },
            { field: 'Organization', title: 'Organization', sortable: true },
            { field: 'Country', title: 'Country', sortable: true },
            { field: 'Action', width: 170, renderer: editManager }
        ],
        params: { sortBy: 'UserName', direction: 'desc' },
        pager: { limit: 10, sizes: [5, 10, 15, 20] },
    });

    reportGrid.on('cellDataBound', function (e, $displayEl, id, column, record) {
        if ('UserName' === column.field) {
            $displayEl.html("<div  data-toggle='modal' data-target='#myModal2' >" + record.UserName + "</div>");

        }
    });
function popupGrid(userName) {
alert(userName);
}
2
Kumaran 23 मई 2019, 06:48