Telerik Forums
UI for ASP.NET MVC Forum
1 answer
76 views
Is it possible to override the default behavior of the navigation key in Kendo Grid?  Specifically, my client would like to use the tab key to traverse cells vertically (in a column).
Alexander Popov
Telerik team
 answered on 08 Jun 2015
3 answers
503 views

I'm trying to add in custom conditions in the ClientTemplate using the guide here http://docs.telerik.com/kendo-ui/aspnet-mvc/helpers/grid/faq

I have a checkbox in the child grid which i want to show a cross or a tick depending on the state.

​columns.Bound(o => o.IsChecked).ClientTemplate(
 
    "# if (IsChecked == true) { #" +
        "<i class='tickButton'></i>" +
    "# } else { #" +
        "<i class='crossButton'></i>" +
    "# } #"
);

 However, doing this, i get the error message "Uncaught ReferenceError: IsChecked is not defined"

 

What is the correct way to get this columns bound value?

Dimiter Madjarov
Telerik team
 answered on 08 Jun 2015
3 answers
436 views

I am defining the following Kendo DropDownlist in asp.net mvc:

@(Html.Kendo().DropDownList()
     .Name("OrganizationName")                   
     .DataTextField("OrganizationName")
     .DataValueField("OrganizationName")
     .OptionLabel("-- Select an Organization --")
     .HtmlAttributes(new { style = "width: 100%;" })
     .DataSource(source =>
     {
          source.Custom()
          .ServerFiltering(false)
          .Type("aspnetmvc-ajax")
          .Transport(transport =>
          {
               transport.Read(read =>
               {
                   read.Url(@Url.HttpRouteUrl("DefaultAPI", new { controller = "OrganizationAPI", action = "GetAllOrganizations" })).Type(HttpVerbs.Get);
               });
           })
           .Schema(schema =>
           {
               schema.Data("Data")
               .Total("Total");
           });
      }))

And I am trying to reload the dropdownlist using javascript, as follows:

 

function RebindOrganizations() {
    $('#OrganizationName').data("kendoDropDownList").dataSource.read();
}

The DropDownList is loading initially, but it throws an "undefined" in the javascript, specifically at the .data("kendoDropDownList") portion of the code. The error is:

 

TypeError: $(...).data(...) is undefined

Now I think it's probable that the issue arises because I'm trying to make the call upon returning from a modal window. Here is the code that actually calls my function:

 

    function bindForm(dialog) {
    $('form', dialog).submit(function () {
        $.ajax({
            url: this.action,
            type: this.method,
            data: $(this).serialize(),
            success: function (result) {
                if (result.success) {
                    $('#myModal').modal('hide');
                    if (result.url != null)
                        $('#replacetarget').load(result.url); //  Load data from the server and place the returned HTML into the matched element
                    else {
                        RebindOrganizations();
                    }
                } else {
                    $('#myModalContent').html(result);
                    bindForm(dialog);
                }
            }
        });
        return false;
    });
}

But when I click an input button with onClick="RebindOrganizations();" it works.

Anyone able to tell me what I'm doing wrong?

Thanks!

Laurie

Laurie
Top achievements
Rank 2
 answered on 05 Jun 2015
1 answer
114 views

Hi

what is the best method for laying out controls in a table fashion.

As an example within a PanelBar I am layout toolboxes and buttons etc. Is there a table method or please advise best mothod?

 

Thank you

Sebastian
Telerik team
 answered on 05 Jun 2015
1 answer
68 views
Hi, does the upgrade wizard update all css file and javascript files as well?  Or just the DLL files?
Dyanko
Telerik team
 answered on 05 Jun 2015
3 answers
195 views

Hi

I am trying to put together a master/detail grid where both the master and detail grid has foreign key columns. The two grids work normally with the foreign key columns when they are on their own, but once I put them together, I have an "invalid template" error.

Here's my razor view of the master/detail grid.

    @(Html.Kendo().Grid<EMD.DAL.Domain.Attribute.AssetSubType>()
      .Name("subTypeGrid")
      .Columns(columns =>
      {
          columns.Bound(c => c.AssetSubTypeID).Width(50);
          columns.ForeignKey(c => c.AssetTypeID, (System.Collections.IEnumerable)ViewData["assetTypes"], "AssetTypeID", "Type").Width(200);
          columns.Bound(c => c.SubType).Width(300);
          columns.Bound(c => c.Description).Width(300);
          columns.Bound(c => c.ProductTypeID).Width(100).Hidden();
          columns.Bound(c => c.PhysicalItem).Width(100).Hidden();
          columns.Bound(c => c.LastModified).Hidden();
          columns.Bound(c => c.LastModifiedBy).Hidden();
          columns.Command(command => { command.Edit(); command.Destroy(); }).Width(180);
      })
      .ToolBar(toolbar =>
      {
          toolbar.Create();
      })
      .ColumnMenu()
      .Editable(editable => editable.Mode(GridEditMode.InLine))
      .Pageable()
      .Reorderable(reorder => reorder.Columns(true))
      .Navigatable()
      .Selectable()
      .Groupable()
      .Resizable(resize => resize.Columns(true))
      .Sortable(sortable =>
      {
          sortable.SortMode(GridSortMode.MultipleColumn);
      })
      .Filterable(filterable => filterable.Mode(GridFilterMode.Menu))
      .Scrollable()
      .ClientDetailTemplateId("template")
      .HtmlAttributes(new { style = "height:800px;" })
      .DataSource(dataSource => dataSource
          .Ajax()
          .PageSize(15)
          .Events(events => events.Error("grid_error")) // Handle the "error" event
          .Model(model => model.Id(p => p.AssetSubTypeID))
          .Read(read => read.Action("AssetSubTypes_Read", "AssetAttribute"))
          .Create(create => create.Action("AssetSubTypes_Create", "AssetAttribute"))
          .Update(update => update.Action("AssetSubTypes_Update", "AssetAttribute"))
          .Destroy(destroy => destroy.Action("AssetSubTypes_Destroy", "AssetAttribute"))
      )
          //.Events(events => events.DataBound("dataBound"))
    )
</div>
<script id="template" type="text/kendo-tmpl">
    @(Html.Kendo().Grid<EMD.DAL.Domain.Attribute.SubTypeAttribute>()
                            .Name("attributeGrid_#=AssetSubTypeID#")
                            .Columns(columns =>
                            {
                                columns.Bound(c => c.SubTypeAttributeID).Hidden();
                                columns.Bound(c => c.AssetSubTypeID).Hidden();
                                columns.Bound(c => c.AttributeValueID);
                                //columns.ForeignKey(c => c.AttributeValueID, (System.Collections.IEnumerable)ViewData["attributes"], "AttributeValueID", "Attribute").Title("Attribute").Width(200);
                                columns.Bound(c => c.DefaultValue);
                                columns.Bound(c => c.Description);
                                columns.Bound(c => c.LastModified).Hidden();
                                columns.Bound(c => c.LastModifiedBy).Hidden();
                                columns.Command(command => { command.Edit(); command.Destroy(); }).Width(180);
                            })
                            .DataSource(dataSource => dataSource
                                .Ajax()
                                .PageSize(5)
                                .Model(model => model.Id(p => p.SubTypeAttributeID))
                                .Read(read => read.Action("SubTypeAttributes_Read", "AssetAttribute", new { assetSubTypeID = "#=AssetSubTypeID#" }))
                                .Update(update => update.Action("SubTypeAttributes_Update", "AssetAttribute"))
                                .Create(update => update.Action("SubTypeAttributes_Create", "AssetAttribute").Data("onAddSubItem"))
                                .Destroy(update => update.Action("SubTypeAttributes_Destroy", "AssetAttribute"))
                             )
                            .ToolBar(toolbar =>
                            {
                                toolbar.Create().HtmlAttributes((new { onclick = "setMasterSubTypeID(this, #=AssetSubTypeID#)" }));
                                //toolbar.Excel();
                            })
                             .Editable()
                             .ColumnMenu()
                             .Sortable()
                             .Scrollable()
                             .Resizable(resize => resize.Columns(true))
                             .Filterable(filterable => filterable.Mode(GridFilterMode.Menu))
                             .Editable(editable => editable.Mode(GridEditMode.InLine))
        .ToClientTemplate()
    )

</script>

 

Funny thing is if I comment out the foreignkeycolumn on the detail grid (columns.ForeignKey(c => c.AttributeValueID,
(System.Collections.IEnumerable)ViewData["attributes"],
"AttributeValueID", "Attribute").Title("Attribute").Width(200);), and change it to bound. Everything works.

After searching various forums and making sure there is no spacing in field names and "encoder Type" is not defined in Web.config (http://www.telerik.com/forums/master-details-grid-not-working). I cannot get the grid to work.

I may be missing something very trivial but I just can't figure out why the grids work on their own but not when they are together.

Appreciate any thoughts.

Boyan Dimitrov
Telerik team
 answered on 05 Jun 2015
2 answers
133 views

I have a situation where Kendo works and renders correctly on my local VS dev environment, but when deployed to IIS I have two issues that I think are related.

1) Kendo controls are not rendering properly as if the css files are not fully recognized. For example, color BlueOpal is applied to the button, but the border is not the same.

2) Kendo control values are not reconized on IIS.  So for the following code:

@(Html.Kendo().Button()
.Name("showButton")
.HtmlAttributes(new { type = "submit", name = "ButtonType", value = "Show" })
.Content("Apply Selected Template"))

 So 'ButtonType' value of 'Show' works (in the controller) on local dev, but not when rendered by IIS. 

Kendo UI MVC version: 2015.1.318

I verified that all the script, content, css, etc. files are fully copied and identical on IIS as they are in my dev environment.

Dimo
Telerik team
 answered on 04 Jun 2015
1 answer
457 views

I need to be able to enter multiple values or ranges into a textbox, similar to MS Words print page function.

So, I could have something like 1-3, 7-10, 15,16. And I need to allow only numeric or commas.

Can that be done using the NumericTextBox?

If not, any ideas how I could accomplish this?

TIA,

Bob

Atanas Georgiev
Telerik team
 answered on 04 Jun 2015
2 answers
441 views

I have a simple grid that uses a custom popup editor template. In the template, I'd like to use a Numeric Textbox.

Due to localization, the application keeps trying to use a comma to separate decimals in the numeric values. When these values are passed to the ASP.NET MVC back-end, the value is lost and null is passed. How can I ensure the posted value has a period separator?

I have tried setting the underlying field values to 2.5 instead of 2,5 in the grid's Save event, as well as tried to overwrite the e.model.WeightKg to 2.5. The value is still passed with a comma separator, as shown by inspecting the form data in the request.

 My grid:

01.@(Html.Kendo().Grid<PackageViewModel>()
02.    .Name("PackageGrid")
03.    .Columns(columns => {
04.        columns.Bound(o => o.PackageCode);
05.        columns.Bound(o => o.WeightKg);
06.        columns.Command(o => o.Edit());
07.    })
08.    .DataSource(d => d
09.        .WebApi()
10.        .Model(m => m.Id(o => o.PackageCode))
11.        .Read(c => c.Url(Url.HttpRouteUrl("DefaultApi", new { controller = "Packages" })))
12.        .Create(c => c.Url(Url.HttpRouteUrl("DefaultApi", new { controller = "Packages" })))
13.        .Destroy(c => c.Url(Url.HttpRouteUrl("DefaultApi", new { controller = "Packages" id = "{0}" })))
14.        .Update(c => c.Url(Url.HttpRouteUrl("DefaultApi", new { controller = "Packages" id = "{0}" })))
15.        .PageSize(20)
16.    )
17.    .Editable(e => e.Mode(GridEditMode.PopUp).TemplateName("Package"))
18.    .Selectable()
19.    .Deferred()
20.)

The numeric textbox in the template:

1.@Html.Kendo().NumericTextBoxFor(m => m.WeightKg).Decimals(8)

And the unparsed form data, followed by the parsed form data:

sort=&group=&filter=&PackageCode=DOOS-B&WeightKg=2%2C5
 
sort:
group:
filter:
PackageCode:DOOS-B
LeegGewichtKg:2,5

Rosen
Telerik team
 answered on 04 Jun 2015
1 answer
540 views

Hey,

 I have a grid with a datasource that needs to have all of its datasource modifications done server side because the results can be quite large and I want to use the filters provided. I see that the DataSourceRequest returns a list of filters, however these filters can come back in a number of different structures depending on the number of filters applied. 

I was wondering if you had a solution for converting these into something that can be used to query oData or converted in to linq where clauses.

Kiril Nikolov
Telerik team
 answered on 04 Jun 2015
Narrow your results
Selected tags
Tags
Grid
General Discussions
Scheduler
DropDownList
Chart
Editor
TreeView
DatePicker
Upload
ComboBox
MultiSelect
ListView
Window
TabStrip
Menu
Installer and VS Extensions
Spreadsheet
AutoComplete
TreeList
Gantt
PanelBar
NumericTextBox
Filter
ToolTip
Map
Diagram
Button
PivotGrid
Form
ListBox
Splitter
Application
FileManager
Sortable
Calendar
View
MaskedTextBox
PDFViewer
TextBox
Toolbar
MultiColumnComboBox
Dialog
DropDownTree
Checkbox
Slider
Switch
Notification
ListView (Mobile)
Pager
Accessibility
ColorPicker
DateRangePicker
Wizard
Security
Styling
Chat
MediaPlayer
TileLayout
DateInput
Drawer
SplitView
Barcode
ButtonGroup (Mobile)
Drawer (Mobile)
ImageEditor
RadioGroup
Sparkline
Stepper
TabStrip (Mobile)
GridLayout
Template
Badge
LinearGauge
ModalView
ResponsivePanel
TextArea
Breadcrumb
ExpansionPanel
Rating
ScrollView
ButtonGroup
CheckBoxGroup
NavBar
ProgressBar
QRCode
RadioButton
Scroller
Timeline
TreeMap
TaskBoard
OrgChart
Captcha
ActionSheet
Signature
DateTimePicker
AppBar
BottomNavigation
Card
FloatingActionButton
Licensing
Localization
MultiViewCalendar
PopOver (Mobile)
Ripple
ScrollView (Mobile)
Switch (Mobile)
PivotGridV2
FlatColorPicker
ColorPalette
DropDownButton
AIPrompt
PropertyGrid
ActionSheet (Mobile)
BulletGraph
Button (Mobile)
Collapsible
Loader
CircularGauge
SkeletonContainer
Popover
HeatMap
Avatar
ColorGradient
CircularProgressBar
SplitButton
StackLayout
TimeDurationPicker
Chip
ChipList
DockManager
ToggleButton
Sankey
OTPInput
ChartWizard
SpeechToTextButton
InlineAIPrompt
TimePicker
StockChart
RadialGauge
ContextMenu
ArcGauge
AICodingAssistant
+? more
Top users last month
Ambisoft
Top achievements
Rank 2
Iron
Pascal
Top achievements
Rank 2
Iron
Matthew
Top achievements
Rank 1
Sergii
Top achievements
Rank 1
Iron
Iron
Andrey
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Ambisoft
Top achievements
Rank 2
Iron
Pascal
Top achievements
Rank 2
Iron
Matthew
Top achievements
Rank 1
Sergii
Top achievements
Rank 1
Iron
Iron
Andrey
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?