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

Listview

3 Answers 117 Views
ListView
This is a migrated thread and some comments may be shown as answers.
Tonih
Top achievements
Rank 1
Tonih asked on 15 May 2013, 04:44 PM
Hi,

I have a listview component that uses a template like so:

$("#listView").kendoListView({
                dataSource: _series,
                template: kendo.template($("#template").html()),
                selectable: true,
                change: function() {
                     var index = this.select().index(),
                        dataItem = this.dataSource.view()[index];
                }
}

<script type="text/x-kendo-tmpl" id="template">
            <div class="listItem">
                <input type="checkbox" value="#= id #"/>
            </div>
</script>

What I would like is for the checkbox to fire the listview change event, instead of the listview itself. How do I accomplish this? Thanks.

Tonih

3 Answers, 1 is accepted

Sort by
0
Tonih
Top achievements
Rank 1
answered on 15 May 2013, 05:18 PM
Figured this out. I simply added an onchange event to the template checkbox component like so:

<script type="text/x-kendo-tmpl" id="template">
            <div class="listItem">
                <input type="checkbox" value="#= id #" onchange="alert(this.value)"/>
            </div>
        </script>

Tonih
0
Tonih
Top achievements
Rank 1
answered on 10 Jun 2013, 05:00 PM
Hi, I am still having a bit of problem with this. As in my initial post to this question, I have a listview component that uses a template like so:

$("#listView").kendoListView({
                dataSource: _series,
                template: kendo.template($("#template").html()),
                selectable: true,
                change: function() {
                     var index = this.select().index(),
                        dataItem = this.dataSource.view()[index];
                }
}

<script type="text/x-kendo-tmpl" id="template">
            <div class="listItem">
                <input type="checkbox" value="#= id #"/>
            </div>
</script>

I would like for the checkbox in my template to handle the #listView change: function() instead of the listview itself. The reason being is that I don't want the entire row of the list to be clickable and fire the change event, i only want when the checkbox onchange is fired, then the exact change function in the listview should execute. How can I achieve this? Hope I was clear thanks.

Tonih
0
Accepted
Alexander Valchev
Telerik team
answered on 12 Jun 2013, 12:33 PM
Hi Tonih,

If I understood correctly you would like to select the ListView items with checkboxes. This functionality is not supported however you can easily implement it with a custom JavaScript logic.
Please check this example and let me know if I missed something: http://jsbin.com/olicag/2/edit

Regards,
Alexander Valchev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Tags
ListView
Asked by
Tonih
Top achievements
Rank 1
Answers by
Tonih
Top achievements
Rank 1
Alexander Valchev
Telerik team
Share this question
or