Telerik Forums
Kendo UI for jQuery Forum
2 answers
159 views
Hello, In my cshtml the Toolbar is having a red underline and shows this error message:kendo.mvc.ui.fluent.gridresizingsettingsBuilder doesn not contain a defination for 'Toolbar' and not extention methiod..  What do I need to get this working ?
I am trying to implement the Grid Custom Editing from the Demo's example
this is how my gridd is defined:

@(Html.Kendo().Grid<SurveyMaintenance.Models.SurveyItem>()
.Name("idComplexGridSurveyItems")
.HtmlAttributes(new { ID = "idComplexGridSurveyItems", Class = "k-grid-header" })

.Columns(columns =>
{
columns.Bound(p => p.UPC).Width(100);
columns.Bound(p => p.Brand).Width(80);
columns.Bound(p => p.ShelfTagDesc).Width(150);
columns.Bound(p => p.CasePack).Width(60);
columns.Bound(p => p.UnitSize).Width(60);
})
.Sortable()
.Scrollable()
.Events(events => events.DataBound("SurveyItemGridDataBound"))
.Resizable(resize => resize.Columns(true)
.ToolBar(toolBar =>
{
toolBar.Create();
toolBar.Save();
})
.Editable(editable => editable.Mode(GridEditMode.InCell))
)
.DataSource(dataSource => dataSource
.Ajax()
.ServerOperation(false)
.Events(events => events.Error("grid_error_handler"))
.Read(
read => read.Action("GetSurveyItems", "Survey").Data("SurveyComplexFunctions.additionalData")

)
.Model(model =>
{
model.Id(p => p.ItemId);
model.Field(p => p.ItemId).Editable(false);
})
.Create(create => create.Action("EditingCustom_Create", "idComplexGridSurveyItems"))
.Update(update => update.Action("EditingCustom_Update", "idComplexGridSurveyItems"))
.Destroy(destroy => destroy.Action("EditingCustom_Destroy", "idComplexGridSurveyItems"))
 
)
)

I have scripts included:

<link rel="stylesheet" href="@Url.Content(baseUrl + "/CDN/Kendo_2013.2.918/Content/kendo.common.min.css")">
<link rel="stylesheet" href="@Url.Content(baseUrl + "/CDN/Kendo_2013.2.918/Content/kendo.silver.min.css")">

<script type="text/javascript" src="@baseUrl/CDN/Scripts_2013.2.918/kendo.modernizr.custom.js"></script>
<script type="text/javascript" src="@baseUrl/CDN/Scripts_2013.2.918/kendo/2013.2.918/jquery.min.js"></script>
<script type="text/javascript" src="@baseUrl/CDN/Scripts_2013.2.918/jquery-ui.min.js"></script>

<script type="text/javascript" src="@baseUrl/CDN/Scripts_2013.2.918/kendo/2013.2.918/kendo.all.min.js"></script>

<script type="text/javascript" src="@baseUrl/CDN/Scripts_2013.2.918/kendo/2013.2.918/kendo.web.min.js"></script>
<script type="text/javascript" src="@baseUrl/CDN/Scripts_2013.2.918/kendo/2013.2.918/kendo.aspnetmvc.min.js"></script>

<script type="text/javascript" src="@baseUrl/CDN/Scripts_2013.2.918/knockout-2.2.0.js"> </script>

Traci
Top achievements
Rank 1
 answered on 18 Oct 2013
5 answers
537 views
We're upgrading from Telerik MVC to Kendo, and have followed the migration instructions and looked at docs and forum posts for two cascading dropdown lists.  However,  the revised code is not working - the cascading controller event never fires (it's in the same controller as the view).  One caveat is that the dropdowns are inside a grid detail, so the controller method had to peek into Request.Form[0] to get the argument.  But, that controller method isn't even firing in the revised code.  UI-wise, it looks as if the cascading code is trying to refresh the dropdown, but no data ever shows up.

Old code:
                    @(Html.Telerik().DropDownListFor(i => item.CountryCodeID)
                    .Name("addressEditCountryCodeID_" + item.ListIndex)
                    .BindTo(new SelectList(countries, "key", "value", item.CountryCodeID))
                    .CascadeTo("addressEditState_" + item.ListIndex)
                    .HtmlAttributes(new { @class = "dropDownList", style = "width: 250px; float:left; margin-right: 10px;" })
                    )
...
                @(Html.Telerik().DropDownListFor(model => item.State)
                    .Name("addressEditState_" + item.ListIndex)
                    .DataBinding(binding => binding.Ajax().Select("GetStatesByCountryCode", "Recipients"))
                    .ClientEvents(c => c.OnDataBound("getStateValue"))
                    .HtmlAttributes(new { @class = "dropDownList", style = "width: 90px; float:left; margin-right: 10px;" })
                    )

New code:
                    @(Html.Kendo().DropDownListFor(i => item.CountryCodeID)
                    .Name("addressEditCountryCodeID_" + item.ListIndex)
                    .BindTo(new SelectList(countries, "key", "value", item.CountryCodeID))
                    .DataTextField("Text")
                    .DataValueField("Value")
                    .HtmlAttributes(new { @class = "dropDownList", style = "width: 250px; float:left; margin-right: 10px;" })
                    )
...

                @(Html.Kendo().DropDownListFor(model => item.State)
                    .Name("addressEditState_" + item.ListIndex)
                    .CascadeFrom("addressEditCountryCodeID_" + item.ListIndex)
                    // .DataBinding(binding => binding.Ajax().Select("GetStatesByCountryCode", "Recipients"))
                    .DataSource(source => {
                        source.Read(read =>
                        {
                            read.Action("GetStatesByCountryCode", "Recipients");
                        })
                    .ServerFiltering(true);
                    })
                    .DataTextField("Text")
                    .DataValueField("Value")
                    .Events(c => c.DataBound("getStateValue"))
                    .HtmlAttributes(new { @class = "dropDownList", style = "width: 90px; float:left; margin-right: 10px;" })
                    )


Controller method:
        [AcceptVerbs(HttpVerbs.Post)]
        public ActionResult GetStatesByCountryCode()
        {
            // Because we can have multiple addresses and Telerik hard-codes the control name as a parameter,
            // we're using Request.Form[0] in order to extract the value.
            List<USState> result = new List<USState>();
            int countryCodeId;
            if (int.TryParse(Request.Form[0].ToString(), out countryCodeId))
            {
                result = LookupService.GetStateListByCountryCode((int)countryCodeId).ToList();
                if (result.Count > 0)
                {
                    result.Insert(0, new USState() { Code = "", Name = "" }); // add a blank at the beginning.
                }
            }
            return new JsonResult { Data = new SelectList(result, "Code", "Code") };            
        }

Ideas?  (Or just another pair of eyes?)

Jim Stanley
Blackboard Connect
Jim
Top achievements
Rank 1
 answered on 18 Oct 2013
3 answers
81 views
I am looking to create my first app that would be available on android and IOS and would like to know which of the following is possible with kendo UI and Icenium

Say I had an app for viewing different styles of external house doors (there will be a list of different doors) on a house.

Get photo of house (using either camera or exisiting photo in directory)
drag different images of door styles from a list onto (on top of) the house photo
Resize door image to cover door in house photo.

Thank you in advance for any help.

Kiril Nikolov
Telerik team
 answered on 18 Oct 2013
1 answer
905 views
For the Grid, is there a way to style width in css instead of with the component's "width" property in html or js?

Also, I couldn't see a solution for using css max-width to specify column widths which is what I most want to do. Is there a way to do that for Kendo grid as I can for regular html tables?  The goal is to make a column take up no more room than it needs (for its widest value or its header, whichever is greater), and no more than the prescribed maximum regardless.  Without max-width, it's hard to style tables well in my applications.

Thanks,

Larry
Dimo
Telerik team
 answered on 18 Oct 2013
2 answers
325 views
We are evaluating the Telerik KendoUI Web Framework and want to identify it's potential. Therefore we put some effort in developing a small web application containing a Grid widget. The Grid's DataSource is based on a remote JSON source which contains about 5000 data objects.
We wanted to make heavy use of the filter, sorting, grouping and/or paging functionality because these are features which are often required by our customers.

Basically we are satisfied with the KendoUI Web Framework. Although we miss some great features we know from other Telerik products (like the Silverlight RadControls) we are happy with it's spectrum of functionality. But the greatest downside (from our point of view) is the Grid's lack of support for virtualization used together with grouping. We were not able to find a good solution to make the Grid highly responsive and user friendly while supporting large sets of data.
In our case the filtering works like charm when the virtualization is enabled. But when it comes to grouping there is this strange effect for collapsed groups: the groups are not arranged one below the other. The user has to scroll/page through large empty areas before the next group appears. This is very unpleasant to use.
When the virtualization is disabled, the filtering is much slower (but filters in an acceptable amount of time). Also the interaction on rows has a very high delay (like selection or activating and collapsing groups).

Do you have any tips regarding the grouping?
Are there plans to work on those issues in future releases of KendoUI?

EDIT: I'm referring to and voted for this feedback.
Aaron
Top achievements
Rank 1
 answered on 18 Oct 2013
0 answers
100 views
hi,
i am new to kendo ui..
i want to set up an kendo data source for a remote server..
as per the kendo ui datasource documention..

var dataSource = new kendo.data.DataSource({ 
transport: {
 // make JSONP request to http://demos.kendoui.com/service/products/create 
create: {
 url: "http://demos.kendoui.com/service/products/create",
 dataType: "jsonp" // "jsonp" is required for cross-domain requests; use "json" for same-domain requests },
});
here url="http://demos.kendoui.com/service/products/create", is a remote end point.

how do we create the remote endpoint for the server??
plz give the step by step instruction to create it..
Rajesh
Top achievements
Rank 1
 asked on 18 Oct 2013
1 answer
115 views
Hi,

I am wondering how to get distinct string values from data source on the categoryAxis in Kendo Chart? It seems to work fine with numeric values but it is not the case with string values. Is there a bug or is something that I am missing...?
Can somebody help me, please?

Here, attached are the sample charts.

Thank you,
Mimi
Iliana Dyankova
Telerik team
 answered on 18 Oct 2013
4 answers
1.6K+ views
 How to hide the ClientFooterTemplate,I already have ClientGroupFooterTemplate and want to make ClientFooterTemplate hide? Although I  set nothing about ClientFooterTemplate,It still have a lot of blank in the footer of the grid!
SEAN
Top achievements
Rank 1
 answered on 18 Oct 2013
8 answers
206 views
Hi there,

I am looking into feasibility to create mobile(phone) version of high traffic site with Kendo UI Mobile.

Following this article http://docs.kendoui.com/getting-started/using-kendo-with/aspnet-mvc/helpers/mobileapplication/overview I was able to create an example navigating pages with ajax. Since the controller is returning PartialView for the page, when you reload the url for the second page, that page seems broken as it doesn't load layout.  

I was able to workaround that with this code
            if (Request.IsAjaxRequest())
                            return PartialView();
             return View();

But when I load that second page directly, link to the third page got messed up (showing the route data and appending relative url)
Everything works well though when I set PushState to false, but in that case # is added to the url.
 
Is my approach wrong, or there is different setup for ajax navigation with ability to load inside pages by typing the url?

Any help would be appreciated.

Thanks.
Miljan
Top achievements
Rank 2
 answered on 17 Oct 2013
0 answers
408 views
If anybody else is wondering, because this code took me forever to figure out, here's how I change the tooltip template date format. Only works with dates, not times. Probably won't be perfect if your time zones are too far apart, but Daylight Saving Time won't screw it up.

$('#DateChart').kendoChart({
    ...
    categoryAxis: {
        baseUnit: "fit",
        autoBaseUnitSteps: {
            seconds: [],
            minutes: [],
            hours: [],
            days: [1],
            weeks: [1],
            months: [1,3],
            years: [1]
        },
        maxDateGroups: MaxBars,
    },
    tooltip: {
        visible: true,
        template: $('#DateChartTemplate').html()
    }
});
  
<script id="DateChartTemplate" type="text/x-kendo-template">
    # var BaseUnit = $('\#DateChart').data("kendoChart").options.categoryAxis.baseUnit;
    var FirstDate = array[0].Date;
    var LastDate = array[array.length - 1].Date;
  
    if (BaseUnit == "days" || (BaseUnit == "fit" &&
    Math.round((LastDate - FirstDate) / 86400000) < MaxBars)) { #
        #:value#<br />
        #=kendo.format("{0:ddd MMM d}", category)#
 
    # } else if (BaseUnit == "weeks" || (BaseUnit == "fit" &&
    (Math.round((LastDate - FirstDate) / 86400000)
    + FirstDate.getDay() - LastDate.getDay()) / 7 < MaxBars)) { #
        #:value#<br />
        #=kendo.format("{0:'Week of' MMM d}", category)#
 
    # } else if (BaseUnit == "months" || (BaseUnit == "fit" &&
    (LastDate.getFullYear() - FirstDate.getFullYear()) * 12
    + LastDate.getMonth() - FirstDate.getMonth() < 3 * MaxBars)) { #
        #:value#<br />
        #=kendo.format("{0:MMMM yyyy}", category)#
 
    # } else { #
        #:value#<br />
        #=kendo.format("{0:yyyy}", category)#
    # } #
</script>
Deej
Top achievements
Rank 1
 asked on 17 Oct 2013
Narrow your results
Selected tags
Tags
Grid
General Discussions
Charts
Data Source
Scheduler
DropDownList
TreeView
MVVM
Editor
Window
DatePicker
Spreadsheet
Upload
ListView (Mobile)
ComboBox
TabStrip
MultiSelect
AutoComplete
ListView
Menu
Templates
Gantt
Validation
TreeList
Diagram
NumericTextBox
Splitter
PanelBar
Application
Map
Drag and Drop
ToolTip
Calendar
PivotGrid
ScrollView (Mobile)
Toolbar
TabStrip (Mobile)
Slider
Button (Mobile)
Filter
SPA
Drawing API
Drawer (Mobile)
Globalization
LinearGauge
Sortable
ModalView
Hierarchical Data Source
Button
FileManager
MaskedTextBox
View
Form
NavBar
Notification
Switch (Mobile)
SplitView
ListBox
DropDownTree
PDFViewer
Sparkline
ActionSheet
TileLayout
PopOver (Mobile)
TreeMap
ButtonGroup
ColorPicker
Pager
Styling
Chat
MultiColumnComboBox
Dialog
DateRangePicker
Checkbox
Timeline
Drawer
DateInput
ProgressBar
MediaPlayer
ImageEditor
TextBox
OrgChart
Accessibility
Effects
PivotGridV2
Licensing
ScrollView
Switch
TextArea
BulletChart
QRCode
ResponsivePanel
Wizard
CheckBoxGroup
Localization
Barcode
Breadcrumb
Collapsible
MultiViewCalendar
Touch
RadioButton
Stepper
Card
ExpansionPanel
Rating
RadioGroup
Badge
Captcha
Heatmap
AppBar
Loader
Security
TaskBoard
Popover
DockManager
TimePicker
FloatingActionButton
CircularGauge
ColorGradient
ColorPalette
DropDownButton
TimeDurationPicker
ToggleButton
BottomNavigation
Ripple
SkeletonContainer
Avatar
Circular ProgressBar
FlatColorPicker
SplitButton
Signature
Chip
ChipList
VS Code Extension
AIPrompt
PropertyGrid
Sankey
Chart Wizard
OTP Input
SpeechToTextButton
InlineAIPrompt
StockChart
ContextMenu
DateTimePicker
RadialGauge
ArcGauge
AICodingAssistant
SmartPasteButton
PromptBox
SegmentedControl
+? more
Top users last month
Chester
Top achievements
Rank 1
Iron
Simon
Top achievements
Rank 1
Iron
Douglas
Top achievements
Rank 2
Iron
Iron
SUNIL
Top achievements
Rank 3
Iron
Iron
Iron
Marco
Top achievements
Rank 3
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Chester
Top achievements
Rank 1
Iron
Simon
Top achievements
Rank 1
Iron
Douglas
Top achievements
Rank 2
Iron
Iron
SUNIL
Top achievements
Rank 3
Iron
Iron
Iron
Marco
Top achievements
Rank 3
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?