Questions on Kendo UI for jQuery Forum

11 answers

942 views

Good day,

I have a grid with a few columns. I group by 3 of these fields already in my datasource. I don't want to allow the user the option to sort or group, but by default, I want the grid to have a specific column sorted descending.

The column I want to be sorted descending is ProductType.
If I enable grouping on the grid, this then shows the groups at the top. If I click on the ProductType group at the top of the grid then it sorts descending. That is the behaviour I want set on the grid by default.

Is this possible?

Thank you in advance!

Below is my code:

    var accountSearchDataSource = new kendo.data.DataSource({
        transport: {
            read: {
                url: function () {
                    if (selectedPortfolioId) {
                        return UrlLibrary.FetchAccountsByPortfolioId + '/' + selectedPortfolioId;
                    } else {
                        return null;
                    }
                },
                dataType: 'json'
            }
        },
        pageSize: 10,
        group: [{ field: "CountryCode" }, { field: "AccountNumber" }, { field: "ProductType"}]
    });
    $('#accountSearchResultsGrid').kendoGrid({
        dataSource: accountSearchDataSource,
        selectable: "row",
        pageable: true,
        height: 500,
        columns: [
            { field: 'AccountNumber', title: 'Account Number' },
            { field: 'ProviderName', title: 'Provider Name' },
            { field: 'ProductName', title: 'Product Name' },
            { field: 'ProductType', title: 'Product Type', width: 80 },
            {
                field: 'PriceClass',
                title: 'Price Class',
                template: function (e) {
                    if (!e.PriceClass) {
                        return '';
                    } else {
                        return e.PriceClass;
                    }
                }
            },
            {
                field: 'ClientFee',
                title: 'Default Fee',
                template: function (e) {
                    if (e.ClientFee == false) {
                        return 'Yes';
                    } else {
                        return 'No';
                    }
                },
                width: 70
            },
            {
                field: 'ClientFee',
                title: 'Client Fee',
                template: function (e) {
                    if (e.ClientFee == true) {
                        return 'Yes';
                    } else {
                        return 'No';
                    }
                },
                width: 70
            },
            {
                field: 'Approved',
                title: 'Approved',
                template: function (e) {
                    if (e.ClientFee != null) {
                        if (e.Approved == true) {
                            return '<input type="checkbox" name="approved" checked="checked" disabled="disabled" />';
                        } else {
                            return '<input type="checkbox" name="approved" id="approved' + e.ProductId + '" />';
                        }
                    } else {
                        return '<input type="checkbox" name="approved" disabled="disabled" />';
                    }
                },
                width: 70
            }]
    });

Grid

answered on 14 Dec 2012

2 answers

191 views

Facebook off canvas Menu, Jquery Mobile slide menu

Hi I'm new to Kendo UI Mobile,

I want to do an "Off Canvas Menu / Slide Menu" a la Facebook, is there an example for it.

Cheers
Michael

General Discussions

answered on 14 Dec 2012

2 answers

296 views

How to add nodes programatically when using tree view?

Hi,

We are planning to use kendo tree view for displaying a context path as a tree structure, something like

Field value would look something like A/B/C/D

I will split this string using / to get each nodes, I am trying to form tree as below,

A
-B
--C
---D

I am not sure whats the best way to achieve this.

Is it better to form tree datasource object manually and provide it as a datasource? Or is it good to use append method to append the tree. The problem with append method is that I don't see id for parent node hence I m not sure how to append child corresponding to a particular parent. Can you please let me know the best possible route?

Thanks,
Barani

TreeView

answered on 14 Dec 2012

1 answer

141 views

Slider for Ipad?

Hi,

I am new to Kendo UI , suggested by a colleague i had a look last week and was pretty much impressed by the things offered.

Would like to know:
1)Is the slider is available for I-pad's and other mobile devices?
2)If the answer to the previous question is 'Yes', then can we show the silder value on its handle?

Thanks

Slider

answered on 13 Dec 2012

0 answers

117 views

Grid in modal Window shows "null" tooltip when first opened

I have a modal kendo window that I display when the user clicks a button. In javascript code, I call the refresh method to set the url for the window. Then I call open. The modal opens centered over where the button was. This works.

But if the cursor happens to be where the grid is (basically I leave the cursor where it is after clicking the button), a tooltip appears with the text "null".

If I quickly move the mouse after clicking the button but before the window actually displays so that the mouse is anywhere else besides the grid, then no tooltip appears.

Grid

asked on 13 Dec 2012

3 answers

273 views

GRID client template don't work.

Hi all I just want to use ClientTemplate option and I can't get it working:

As you can see:

columns.Bound(p => p.BookId).Width(50).ClientTemplate("Some HTML code");

Insead of this lane I should have "Some HTML code" but I have ID's

@model List<Biblioteka.ViewModels.BookViewModel>

@{

ViewBag.Title = "Index";

}

<h2>Index</h2>

@(Html.Kendo().Grid<Biblioteka.ViewModels.BookViewModel>()

.Name("BooksKendoGrid")

.Columns(columns =>

{

columns.Bound(p => p.Title);

columns.Bound(p => p.Author);

columns.Bound(p => p.BookGenreId);

columns.Bound(p => p.ReleaseDate);

columns.Bound(p => p.ISBN);

columns.Bound(p => p.Count);

columns.Bound(p => p.RealBookCount);

columns.Bound(p => p.AddDate);

columns.Bound(p => p.ModifiedDate);

columns.Bound(p => p.BookId).Width(50).ClientTemplate("Some HTML code");

//columns.Command(command => { command.Edit(); }).Width(200);

})

//.ToolBar(toolbar => toolbar.Create())

// PopUp editing Mode

.Editable(editable => editable.TemplateName("BooksEditor").Mode(GridEditMode.PopUp))

.Pageable()

.Sortable()

.Scrollable()

.Filterable()

.DataSource(dataSource => dataSource

.Ajax()

.ServerOperation(false)

.Model(model =>

{

//The unique identifier (primary key) of the model is the ProductID property

model.Id(p => p.BookId);

})

// .Create(create => create.Action("Create", "Books"))

.Read(read => read.Action("BooksKendoGridRead", "Books").Type(HttpVerbs.Post)

)

).BindTo(Model)

)

Grid

answered on 13 Dec 2012

3 answers

127 views

Grid pager and tab errors

Hi guys,

Im currently getting the following errors when a hit the next button on pager:

SCRIPT87: Invalid argument.

kendo.web.min.js, line 10 character 223280

and the following when I hit one tab of 6 that I have on that page

SCRIPT5007: Unable to get value of the property 'replace': object is null or undefined

kendo.web.min.js, line 10 character 5001

What could be wrong?

Any Ideas?

Thanks in advance...

Camilo Vergara M.

Grid

answered on 13 Dec 2012

3 answers

193 views

[Solved] How do I add binding to a custom widget using in a template

Please see my code here:
http://jsfiddle.net/RzfHu/2/

I would like this custom widget do like this:
<input type="text" data-role="colorpicker" data-bind="value:BGColor"

/>

But it failed saying: Uncaught TypeError: Object [object Object] has no method 'value'
So how do I add binding to this custom widget "colorpicker"?

MVVM

answered on 13 Dec 2012

3 answers

1.3K+ views

Change “items per page” to "Items per page" in List view pager

Hi All,

How to change “items per page” to "Items per page" in List view pager?

Regards,
Partha.

ListView

answered on 13 Dec 2012

1 answer

147 views

Filter datagrid

Hello,
I try to filter my datagrid like this :

The same filter must be used for 2 properties. But an error is raised when I use the Or method, if I remove the Or, it works but it is not what I want to do because, without the Or method, the composant do an And between the two filters.

.
.
.
                    .Filter(f =>
                        {
                            if(!string.IsNullOrEmpty(Model.FilterByVendor))
                            {
                                f.Add(a => a.Name).Contains(Model.FilterByVendor).Or();
                                f.Add(a => a.VendorNumber).Contains(Model.FilterByVendor).Or();
                            }
                        })
                    .Read(read => read.Action("GetAllVendors", "Vendor"))
                    .PageSize(20)

            )
            .Filterable()
)

Grid

answered on 13 Dec 2012