Filters are not working in row-template with merged cell

2 posts, 0 answers
  1. Neeraj
    Neeraj avatar
    139 posts
    Member since:
    May 2015

    Posted 23 Nov 2020 Link to this post

    I am working on Kendo MVVM Grid with row-template. i have applied merged cells (rowspan) inside the row-template.Everything is working fine but when i applied filters on column then that time Grid is not showing any result.

    i have tried Filtering without merged cells, its working fine

     

    <div data-role="grid"
                 id="ProessedReconciliationGrid"
                 style="height:250px;"
                 data-toolbar="[{'template': kendo.template($('\\#ProessedReconciliationGridTitle').html())}]"
                 data-animation="false"
                 data-filterable="true"
                 data-scrollable="true"
                 data-resizable="true"
                 data-bind="source: ProessedReconciliationData,visible:isProcessedDivVisible"
                 data-columns='[
                         { "field": "SupplierInvoiceReconciliationId", hidden:"true"},
                         { "field": "SI_DocumentNumber", "title": "Doc. No.",width: "80px",editable: function () { return false; }},
                         { "field": "DisplaySI_TransactionDate", "title":"Doc. Dt.","width":"100px",editable: function () { return false; }},
                         { "field": "SI_BookingReference","title":"Booking Ref.",editable: function () { return false; }},
                         { "field": "SI_PassengerName", "title": "Passenger",editable: function () { return false; }},
                         { "field": "SI_Amount", "title": "Amount",editable: function () { return false; },format:"{0:n2}",attributes:{style:"text-align:right;"}},
                         { "field": "SI_Amount", "title": "Amount Payable",editable: function () { return false; },format:"{0:n2}",attributes:{style:"text-align:right;"}},
                         { "field": "DOC_DocumentNo", "title": "Doc. No.",width: "80px",editable: function () { return false; }},
                         { "field": "DisplayDOC_DocumentDate", "title":"Doc. Dt.","width":"100px",editable: function () { return false; }},
                         { "field": "DOC_BookingReference","title":"Booking Ref.",editable: function () { return false; }},
                         { "field": "DOC_PassengerName", "title": "Passenger",editable: function () { return false; }},
                         { "field": "DOC_Total", "title": "Amount",editable: function () { return false; },format:"{0:n2}",attributes:{style:"text-align:right;"}},
                         { "field": "DOC_Total", "title": "Amount Payable",editable: function () { return false; },format:"{0:n2}",attributes:{style:"text-align:right;"}},
                         { "field": "DOC_DocumentID", "title": "Int. ID",width: "125px",editable: function () { return false; }},
                         { "field": "MatchDescription", "title": "Match Criteria",editable: function () { return false; }},
                         { "field": "MatchDifference", "title": "Diff",editable: function () { return false; },format:"{0:n2}",attributes:{style:"text-align:right;"}},
                         { "field": "Payable", "title": "Payable",editable: function () { return false; },format:"{0:n2}",attributes:{style:"text-align:right;"}},
                         { "field": "Action", "title": "Action",editable: function () { return false; }
    <script id="ProessedRowTemplate" type="text/x-kendo-template" class="KendoExtTemplate">
        <table class="table">
            #if(data != null){#
            #if(data.length == 1 ){#
            <tr>
     
                <td>#=data[0].SI_DocumentNumber#</td>
                <td>#=data[0].DisplaySI_TransactionDate#</td>
                <td>#=data[0].SI_BookingReference#</td>
                <td>#=data[0].SI_PassengerName#</td>
                <td style="text-align:right;">#=kendo.toString(data[0].SI_Amount,'n2')  #</td>
                <td style="text-align:right;">#=kendo.toString(data[0].SI_Total,'n2')#</td>
                <td>#=data[0].DOC_DocumentNo#</td>
                <td>#=data[0].DisplayDOC_DocumentDate#</td>
                <td>#=data[0].DOC_BookingReference#</td>
                <td>#=data[0].DOC_PassengerName#</td>
                <td style="text-align:right;">#=kendo.toString(data[0].DOC_Total,'n2')#</td>
                <td style="text-align:right;">#=kendo.toString(data[0].DOC_Total,'n2')#</td>
                <td><a href="../Document/GetDossierDocument/#: data[0].DOC_DocumentID #" target="_blank" title="#: data[0].DOC_DocumentID #" style="white-space: nowrap;">#: data[0].DOC_DocumentID #</a></td>
                <td>#=data[0].MatchDescription#</td>
                <td style="text-align:right;">#=kendo.toString(data[0].MatchDifference,'n2')#</td>
                <td style="text-align:right;">#=kendo.toString(data[0].Payable,'n2')#</td>
                <td><i class="fas fa-unlink text-danger" onclick="DeleteProcessedRow('#=data[0].SupplierInvoiceReconciliationId #')" title="Break/Remove" aria-hidden="true"></i></td>
            </tr>
            #}else {#
            #for(var x=0; x < data.length; x++){#
            <tr>
                # var rowspanVal = data.length #
                <td>#=data[x].SI_DocumentNumber#</td>
                <td>#=data[x].DisplaySI_TransactionDate#</td>
                <td>#=data[x].SI_BookingReference#</td>
                <td>#=data[x].SI_PassengerName#</td>
                <td style="text-align:right;">#=kendo.toString(data[x].SI_Amount,'n2')#</td>
                <td style="text-align:right;">#=kendo.toString(data[x].SI_Total,'n2')#</td>
                <td>#=data[x].DOC_DocumentNo#</td>
                <td>#=data[x].DisplayDOC_DocumentDate#</td>
                <td>#=data[x].DOC_BookingReference#</td>
                <td>#=data[x].DOC_PassengerName#</td>
                <td style="text-align:right;">#=kendo.toString(data[x].DOC_Total,'n2')#</td>
                <td style="text-align:right;">#=kendo.toString(data[x].DOC_Total,'n2')#</td>
                <td><a href="../Document/GetDossierDocument/#: data[x].DOC_DocumentID #" target="_blank" title="#: data[x].DOC_DocumentID #" style="white-space: nowrap;">#: data[x].DOC_DocumentID #</a></td>
     
                #if(x == 0){#
                <td rowspan="#: rowspanVal #">#=data[x].MatchDescription#</td>
                <td rowspan="#: rowspanVal #" style="text-align:right;">#=kendo.toString(getMatchDifference(data),'n2')#</td>
                <td rowspan="#: rowspanVal #" style="text-align:right;">#=kendo.toString(getPayableAmount(data),'n2')#</td>
                <td rowspan="#: rowspanVal #"><i class="fas fa-unlink text-danger" onclick="DeleteProcessedRow('#=data[0].SupplierInvoiceReconciliationId #')" title="Break/Remove" aria-hidden="true"></i></td>
                #}#
            </tr>
            #}#
            #}#
     
            #}#
        </table>
     
    </script>
    },
                 ]'
                 data-row-template="ProessedRowTemplate" data-groupable="false" data-selectable="row"
                 data-editable="false">
            </div>

     

  2. Eyup
    Admin
    Eyup avatar
    4081 posts

    Posted 25 Nov 2020 Link to this post

    Hi Neeraj,

     

    Do you see any script errors when you open the Chrome browser debugger with F12? Could you modify the following live sample to demonstrate the problem and send the new URL back to us?
    https://dojo.telerik.com/ocAyukuG

     

    Regards,
    Eyup
    Progress Telerik

    Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Back to Top