Questions on Kendo UI for jQuery Forum

1 answer

91 views

Is there a way to load more data if requested by the user?

For example a guestbook, I want to show the first 10 entries, when the user hits the "show more" button, the next 10 will be loaded and added bellow the first 10. Again, you can push "show more", loading the next 10, append them to the bottom of the list... till no more entries will be received by the server.

Can Kendo UI handle this already?

Regards -

Tom

ListView (Mobile)

answered on 02 Mar 2012

1 answer

1.9K+ views

How can I get the count of number of items in the combo?

My comboboxes are populated dynamically and I want them to be required, but only if there is more than one option. I think I know how to do the validation, but how can I get the item count for combobox?

ComboBox

answered on 02 Mar 2012

2 answers

161 views

lost on a data source issue

Hi all,

any idea why this wouldnt work (all include and link paths checked)
I'm a newby and so lost! i'm getting the data (one record) into the array in the function createRandomData.
But i cant generate the gridview after that.
Can anyone see where i'm going wrong?

V

<!doctype html>
<html>
    <head>
        <title>Admin: Users</title>
        <link href="styles/kendo.black.min.css" rel="stylesheet"/>
        <link href="styles/kendo.default.min.css" rel="stylesheet"/>
        <script src="js/jquery.min.js"></script>
        <script src="js/kendo.core.js"></script>

        <script src="js/kendo.validator.js"></script>
        <script src="js/kendo.model.js"></script>
        <script src="js/kendo.data.js"></script>
        <script src="js/kendo.pager.js"></script>
        <script src="js/kendo.sortable.js"></script>
        <script src="js/kendo.draganddrop.js"></script>

        <script src="js/kendo.groupable.js"></script>
        <script src="js/kendo.grid.js"></script>
        <script src="js/kendo.binder.js"></script>
        <script src="js/kendo.editable.js"></script>
        <script src="js/kendo.popup.js"></script>
        <script src="js/kendo.calendar.js"></script>

        <script src="js/kendo.datepicker.js"></script>
        <script src="js/kendo.numerictextbox.js"></script>
		<script>
function createRandomData(count) {
		var data = [];
		data = {"account_recs":[{"FirstName":"Graham","SecondName":"Fourie"}],"totals":1};
		return data;
}
</script>
    </head>
    <body>
        <a href="../index.html">Back</a>
        <div class="description">Basic usage</div>

        <div id="example" class="k-content">
            <div id="grid"></div>

            <script>
                $(document).ready(function () {
                    $("#grid").kendoGrid({
                        dataSource: {
                            data: createRandomData(1)
						}
                        navigatable: true,
                        pageable: true,
                        height: 400,
                        toolbar: ["create", "save", "cancel"],
                        columns: [
                            "SecondName",
                            { field: "FirstName", width: "100px" },
                            { command: "destroy", title: "&nbsp;", width: "110px" }],
                        editable: true
                    });
                });
            </script>
        </div>
    </body>
</html>

Data Source

answered on 02 Mar 2012

1 answer

362 views

Debug datasource read url

Is there a method or property that returns what url the read method will query ?

Suppose I have
  transport: {
   read: {
    url: window.dataEmitterURL + "/GetStoresTable",
    dataType: "xml",
    data: {
     mainid: getParameter('mainid') ,
     idset: function() { return window.selectedIdset; }
    },
    cache: false
   }
  },

Data Source

answered on 02 Mar 2012

2 answers

52 views

Charts hosted in .aspx pages not working in IE

Hi,

I have been working on migrating my Silverlight application to HTML5 using Kendo UI. It is working very good.
But have a problem with the charts when hosted in aspx pages. The page throws javascript error when viewed in Internet Explorer.
Where as the same thing works in Firefox or Chrome. Please can anybody help ??
I need to get this working in IE as well.

Thanks,
Nikhil

Charts

answered on 02 Mar 2012

0 answers

117 views

Using image in Grid column

Hi ,
How can I use and image in grid column ?
Is there any way to set custom css class in grid column ?
Thanks.

Grid

asked on 02 Mar 2012

3 answers

133 views

Doesnt Refresh

Hi,

Im using this expander panel and the problem is if i have a dynamic fields and if i want to collapse the panel and then expand it back it will always stay to that height and never change so now if i want to pick something else from the Dropdown and if it has more fields depending on my selection it will be hidden or overlapping.

Thanks

PanelBar

answered on 02 Mar 2012

3 answers

627 views

Assign class to column

Is there any way to assign a class to specific columns? Ideally this would be part of the column configuration, but I'm willing to consider alternative methods.

The reasoning for this is that I want to be able to style certain columns differently. For example, on a grid showing days, I want the weekend days to have a different background color.

Grid

answered on 02 Mar 2012

2 answers

121 views

method 'onShowStart'

When I try to call var app = new

kendo.mobile.Application(document.body);

I get error in chrome console and loading div is constantly showing

Uncaught TypeError: Cannot call method 'onShowStart' of undefined


I was check that all files was included in my javascript folder and they were included.

I use trial version so all my files are minified. Do you have any idea what was wrong?



This is my site code:




<!DOCTYPE html>
<html>
<head>
    <title></title>  
    <%= stylesheet_link_tag :application, "kendo.mobile.all.min" %>
    <%= javascript_include_tag "jquery.min", "kendo.all.min", "kendo.culture.hr-HR.min" %>    
     
</head>
<body>  
       <div data-role="header">Header</div>
     <div data-role="content">Hello world!</div>
     <div data-role="footer">Footer</div>
<script type="text/javascript">
    var app = new kendo.mobile.Application(document.body);
</script>
</body>
</html>



Sorry for my bad english.

Application

answered on 02 Mar 2012

7 answers

836 views

Extending the Grid control

I must say that KendoUI looks really good. It seems very solid. The features already existing is great, but my concern is about the features I need but which is not part of Kendo UI. For example I need the Grid control to show PrevPage and NextPage buttons instead of clickable page numbers like the KendoGrid does. How easy is it to extend/customize the controls? Is the kendo team willing to help with questions like that?

I have tried a little and managed to add the mentioned features to the KendoGrid control like this:

jQuery.fn.kendoCustomGrid = function (c) {

if (c.pageable === false) {

this.kendoGrid(c);

return;

}

c.pageable = false;

this.kendoGrid(c);

this.append(

"<div class='k-grid-pager'><button id='prevPage' class='k-button'>Prev</button><button id='nextPage' class='k-button'>Next</button></div>"

);

$('#prevPage').on("click", function (event) {

c.dataSource.page(c.dataSource.page() - 1);

});

$('#nextPage').on("click", function (event) {

c.dataSource.page(c.dataSource.page() + 1);

});

this.on("keydown", function (event) {

if (event.keyCode === 34) { //PgDn

c.dataSource.page(c.dataSource.page() + 1);

}

if (event.keyCode === 33) { //PgUp

c.dataSource.page(c.dataSource.page() - 1);

}

});

};

I can then use $(selector).kendoCustomGrid() instead of $(selector).kendoGrid()

Is this a good way to extend kendo controls? Or is there a better/preferred way?

Grid

answered on 02 Mar 2012