I have an MVC Grid with Paging enabled.

I need the pager to just show numbers, no hover animation, no next/last buttons, basically:

1 2 3 4 5 6  and so on.

How can I turn off the reset of the features? I've been trying to disable them CSS element by element, but it's like unravalling a big knot.

I'm getting the following error when trying to place an upload element in a script template.  The file select button appears with the Kendo UI formatting but the error below is generated when clicking edit or add new.  I'm using the scripts from the Q2 2012 Beta that works with ASP.NET MVC.


Thanks,
Brad

Hi,

We are using the Kendo UI build 2013.1.319. We are implementing a ASP.NET MVC Application using Razor as the templating engine. We've a simple page with a Search Criteria interface and the Grid displayed on the Right side. When the page loads initially, all features of the grid seem to be working fine. But when the user clicks on the Search button on the screen, we reload the grid using AJAX.  The dataset in the grid is refreshed by making a call to a method in the Controller Class which returns data. The read method of the grid is invoked to trigger this process as shown in many of your examples. When this happens pagination is reflected incorrectly. It displays "0" pages and "No Results Found" for the result count when the data set in the grid contains lot of data. Features like Sorting, Pagination etc are handled on the client side for this component. Please let us know if we are doing something incorrectly in this case.

Code is attached in the following files. Appreciate if you can provide a quick input on this issue. We tried to search the cases in the forums but were unable to resolve this particular issue.

Thanks

Girish

View
--------
            @(Html.Kendo().Grid(Model)
                            .Name("grid")
                            .Columns(columns =>
                            {
                                columns.Bound(p => p.Products)
                                           .Width(100);
                                columns.Bound(p => p.DocumentCode)
                                            .Groupable(false)
                                            .Width(80);
                                columns.Bound(p => p.Title)
                                            .Groupable(false)
                                            .Width(150);
                                columns.Bound(p => p.Description)
                                            .Groupable(false)                                    
                                            .Width(200);
                                columns.Bound(p => p.Categories)
                                            .Title("Category - Topic")
                                            .Width(250);
                                columns.Bound(p => p.ObjectId)
                                            .Title("")
                                            .Filterable(false)
                                            .Groupable(false)
                                            .Width(150)
                                            .ClientTemplate("#= documentDetails(data) #");
                            })
                            .Groupable()
                            .Sortable(sortable => sortable
                                    .AllowUnsort(true)
                                    .SortMode(GridSortMode.MultipleColumn))
                            .Scrollable()
                            .Filterable()
                            .Pageable()
                            .DataSource(dataSource => dataSource
                                    .Ajax()
                                    .ServerOperation(false)
                                    .PageSize(50)
                                    .Events(events => events.Error("onError"))
                                    .Read(read => read.Action("SearchResultsRead", "Search")) 
                            )    
                        )
            <script>
                function onError(e, status) {
                    alert("error raised");
                }

                function documentDetails(searchResult) {
                    var action = '@Url.Action("DocumentDetails", "Search")';
                    
                    var links = "<a href='#' class='tablectrl_small bDefault tipS' title='View Properties Test Title' onclick='viewProperties(\"{1}\")'><span class='iconb'> <img src='@Url.Content("/Images/icons/usual/icon-list.png")' alt='View Properties' /></span></a>";
                    var html = kendo.format(links,
                        action,
                        searchResult.ObjectId
                    );
                    
                    return html;
                }
            </script>

@section scripts
            {
    <script>
            $(document).on({
                click: function () {
                    var grid = $("#grid").data("kendoGrid");
                    grid.dataSource.read();
                    
                }
            }, "#btnSearch");
</script>


Controller Class

 public class SearchController : BaseController
    {

        public ActionResult Index(string id)
        {
            ViewBag.PageName = "Search";
            return View(SearchData());
        }

        public List<SearchResultsViewModel> SearchData()
        {
            SearchService searchService = new SearchService();
            List<SearchResultsViewModel> searchResults = searchService.PerformSearch(30);
            return searchResults;
        }

        public ActionResult SearchResultsRead()
        {
            SearchService searchService = new SearchService();
            List<SearchResultsViewModel> searchResults = searchService.PerformSearch(75);
            var searchResultsJson = Json(searchResults);
            return Json(searchResultsJson, JsonRequestBehavior.AllowGet);

        }
    }

Hello,

I am using Kendo MVC Wrappers and ran into a problem.
I have bound a column to the grid using:
And though Amount is of type decimal? the grid is showing on it's column the filter for string type(the one with the operators: Contains, Starts with,Ends with...etc) instead of showing me the numeric type filter(the one with Greater than, etc). Naturally, filtering with StartsWith will result in an error( the grid is AJAX() bound)

The problem seems to be only with a property on the child of the object model.When i use this:
The filter operator and textbox recognize the column as numeric and display the appropiate filter.

I appreciate the help,
Claudiu

Hi, I try to understand the FilterCustomizationDemo to do the same.

I don't understand were the "dataSource: titles" come from!

How can I tell the UI function to take the internal Grid datasource?

thanks

Hi ,

i want to use your Upload widget in my application, but I'm facing a litte problem here.
For example, the user selects a file on his local file system: "test.txt", but the file should be renamed into "file1.txt" at the upload target. Is there any way to archieve this?

I'm using jquery-2.0.3, jquery-ui-1.10.3 and kendo ui v2013.1.419


Thank you very much!

A touch event can be handle by:


How can do use binding to connect this to a object's method?  Something akin to the following:


Thanks.

Life Cycle question

I have a standard grid on a page. The grid has templates that generate some Html.

I try to modify the html the grid generated with jQuery in the Document Ready function, but the elements are not there when I attempt the blow javascript. I am guessing I am trying to early in the life cycle? If so, how do I modify internal html elements using jQuery? Note that if I manually run the script in FF's FireBug after the page is all ready, it works fine.
 

I have a large number (100+) of grids in my application.  May of which are bound to <table> elements via the use of the data-field attribute on the headers of the table.  The tables all scroll.  What I'd like to do now is specify the width of just a few columns in each table, these are mainly columns that the fixed table layout makes too wide, columns containing just icons or block of colour designating a status of some sort.  I have tried the following...

- Adding a width to the header column - unfortunately the header styles don't get copied to data table so we end up with the headers being the correct size but the data columns not lining up

- Adding a colgroup with widths to the table - this does seem to work in isolation, the colgroup gets copied between the two tables, however, when this method is used inside the Durandal spa framework the colgroup is not yet in the DOM when Kendo does it's thing and is therefore not picked up

- Adding the columns property to the initialisation of the grid in js and specifying width there - this always works, however, doing this for all of my grids, none of which specify the columns property currently, is a much bigger overhead than I'd like and it presents a maintenance headache going forward (plus, I'd rather not specify styling in js)

- Adding a data-width to the th and adding this to the columns collection on dataBinding or dataBound - This doesn't seem to work which is a shame as adding a simple event handler to each grid that picks up on a data attribute, much like the data-field attribute we already use would be a perfect solution in many ways.

I think the dataBinding or dataBound solution may be the way to go, I'm just not sure how to re-size columns in either of those event handlers.  I've  created a small fiddle with which I've been experimenting and any guidance would be greatly appreciated.

 

Hey,

I have an observable object looking something like this:

So far so good. No I want to use this filtered array in a source binding (to generate a table, say) and I want to to the following:

Where availableDescription is an array contained in my viewModel.
This generates an error (Uncaught TypeError: Object [object Array] has no method 'parent' )

Apparently kendo is resolving 'availableDescriptions' by calling 'parent()' on the observable array that is the context for my template. To work around this I changed my implementation of filteredArray to look like this:

It works, but isn't particularly graceful. Is there a better way to do this ?