This is a migrated thread and some comments may be shown as answers.

Filters are not working in row-template with merged cell

1 Answer 92 Views
MVVM
This is a migrated thread and some comments may be shown as answers.
Neeraj
Top achievements
Rank 1
Veteran
Neeraj asked on 23 Nov 2020, 12:47 PM

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>

 

1 Answer, 1 is accepted

Sort by
0
Eyup
Telerik team
answered on 25 Nov 2020, 12:21 PM

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/.

Tags
MVVM
Asked by
Neeraj
Top achievements
Rank 1
Veteran
Answers by
Eyup
Telerik team
Share this question
or