Telerik Forums
UI for ASP.NET MVC Forum
1 answer
580 views
.Columns(columns =>
                          {
                              columns.Template(e => { }).ClientTemplate(" ").Title("Store Name");
                              columns.Bound(c => c.Value).Format("R {0:n2}");
                              columns.Bound(c => c.Quantity).Format("{0:n0}");
                              columns.Bound(c => c.ASP).Format("R {0:n2}");
                          })
                          .HtmlAttributes(new { style = "height: 900px;" })
                          .Events(ev => ev.DataBound("onDataBound"))
                          .ClientRowTemplate(
                                                "<tr data-uid='#: uid #'>" +
                                                    "<td ><a href='/Dashboard/Store/#= StoreId #'>" +
                                                        "#: Element #" +
                                                    "</a></td>" +
                                                    "<td class='text-right' >R " +
                                                        "#: Value #" +
                                                    "</td>" +
                                                    "<td  class='text-right'>" +
                                                        "#: Quantity #" +
                                                    "</td>" +
                                                    "<td class='text-right' >R " +
                                                       "#: ASP #" +
                                                    "</td>"+
                                                 "</tr>"     
                            )

Hello

I would like to know how to format the #: ASP # for it to format to decimal with 2  digits ({0:n2})
Regards
Jako
Top achievements
Rank 1
 answered on 23 Sep 2014
1 answer
179 views
If you see the attached images you'll notice that the slider on the right with the square drag handle has a working tooltip, but the slider on the left doesn't have a tooltip when dragged as you can see in the second image. 

I compared the two MVVM based implementations, stripped out the unnecessary information and came up with this: 
<input id="..." name="..." class="post-retirement" data-show-buttons="false" data-role="slider" data-min="0" data-max="2" data-small-step="0.01" value="" data-value="" data-bind="visible: isVisible, events: { change: onChange }" data-index="@i" data-tooltip="{format: '{0:p0}'}"  data-toggle="tooltip" />
<input id="..." name="..." class="weight-split" data-show-buttons="false" data-role="slider" data-min="0" data-max="1" data-small-step="0.01" value="" data-value="" data-bind="visible: isVisible, events: { change: onChange }" data-index="@i" data-tooltip="{format: '{0:p0}'}" data-toggle="tooltip" />

As you can see they're almost identical apart from class names which are used only to style the drag handles differently. 

The JavaScript that activates the tooltip and binds the MVVM objects looks like this: 
//activate tooltips
$("[data-toggle=\"tooltip\"]").tooltip();
 
var postRetirementViewModel = kendo.observable({
    isEnabled: true, 
    isVisible: true, 
    onChange: function (e)
    {
        //get the index for this row
        var index = $(e.sender.element).data("index");
 
        //removed for brevity
    }
});
 
var weightSplitViewModel = kendo.observable({
    isEnabled: true,
    isVisible: true,
    onChange: function (e)
    {
        //removed for brevity
    }
});
 
kendo.bind($(".post-retirement"), postRetirementViewModel);
 
kendo.bind($(".weight-split"), weightSplitViewModel);


Any idea why the left slider tooltip won't show up? 
Hristo Germanov
Telerik team
 answered on 23 Sep 2014
1 answer
252 views
I can change the background color to show the progress (percentage complete section) - but I need to make the background color transparent and use a background-image with linear gradient but can't get that working.  Any idea?
Alex Gyoshev
Telerik team
 answered on 22 Sep 2014
3 answers
156 views
I have a Heirachy Grid where there are columns in the sub-grid that have dependencies on each other. So for I have done these as a set of Cascading DropDownLists. This is using EditorTemplates for each of the DropDownLists as they need to get their content via an Ajax Read. I am using Inline editing on the grids.

However the last item in the cascade will only ever have one value available so it would be better just to make this a non-editable/readonly column and set this when the other selections have been made.

I have looked at the following example that uses the Select event of the drop down list then sets other columns in the same grid however I don't know the grid name (highlighted). How can this work with a Heirachy grid.

                function select(e) {
                    var grid = $("#grid").data("kendoGrid"),
                        model = grid.dataItem(this.element.closest("tr"));

                    model.ProductName = "changed";
                    model.UnitPrice = 100;
                }   











Petur Subev
Telerik team
 answered on 22 Sep 2014
1 answer
132 views
I want to specify max height of the grid content.
I have tried to keep .Scrollbar() and in this by default it is taking 200px as the height. In this case i am getting the scrollbar if the content size is more then 200px but if it is less then 200px then i am getting an empty space till 200px height.

I have tried to keep .Scrollbar(s =>s.height("auto")). In this case i am not getting the scrollbar.

I have even tried to override k-grid-content class by specifying the max-height something like this
#gvCommList .k-grid-content {
        max-height:300px !important;
    }
in this case in IE8 the browser is getting crashed.

I want the height to be adjusted automatically based on the content size and should work in all the browsers.

How to do that?
Dimo
Telerik team
 answered on 19 Sep 2014
3 answers
65 views
Hello,

My application is MVC. I have "Popup.Html" page in views along with "Popup.cshtml". I want to use combobox in the below link in my "popup.html" page.

http://demos.telerik.com/aspnet-ajax/combobox/examples/functionality/autocompleteclientside/defaultcs.aspx

How can I refer Telerik in .html page ?

How can I work with combobox in this page ?
Dimo
Telerik team
 answered on 19 Sep 2014
1 answer
103 views
Hi -

Since updating to the latest release of Kendo MVC (Q3'2014) the menu on several of our pages will not immediately load (see screenshot).  Usually after 1 - 2 seconds the menu will load with all the styles, etc applied but not immediately after the page loaded, which is what it did before.

Any suggestions?
Georgi Krustev
Telerik team
 answered on 18 Sep 2014
1 answer
476 views
Hi there,

I am running into the same issues as noted on this post when using DisplayFor() on a custom editor template which is called from a Kendo Grid:

Display For Issue

However, we are using our own custom HtmlHelper extension methods which have been built on top of Kendo controls to apply business logic where necessary - one of which is to either render a Kendo DropDownList or a DisplayFor depending on certain business logic.

These controls are used throughout the application - both on normal forms and within Kendo Grid Popups.

The fix in the post above will allow the DisplayFor to display information when on a Kendo Grid Popup - but won't work when the control is used elsewhere. Are there any other approaches which would fix this issue so our generic dropdownlist can be used everywhere - otherwise we would need a different control for when this is used on a Kendo Grid Popup, which would not be desirable.

Failing that, is it possible to dispense altogether with the Kendo Grid popup and instead use a Twitter Bootstrap modal to add / edit grid records?

Thanks,

Paul
Dimiter Madjarov
Telerik team
 answered on 18 Sep 2014
4 answers
89 views
Dear Telerik Team!
If I use .navigatable() and Editortemplates (UIHint Attribute) it is not always possible to edit a cell. If I
- have about 1 to 2 thousand rows in a scrollable grid
- and select a cell using the mouse with template to start editing it
- and click fast, which means that there are just a few milliseconds beetween mousedown and mouseup
the the cell enters edit mode, but immediately jumps back to view mode a few milliseconds later without any user intervention.
If I click the mouse slower, meaning that there is a larger timespan beetween mousedown and mouseup the cell stays in edit mode.
I observed this behaviour reproducable in two different projects. I attached one of them.
(The attached project is not in a runnable state because of size restrictions in the forum. You have to add the telerik stuff yourself)
The bug can be experienced at least with actual Internet Explorer and Firefox. The latest Telerik version I am Using is 2014.1.415
If You are sure the bug is fixed in a newer version please inform me.

brgds
Malcolm Howlett
Malcolm
Top achievements
Rank 1
 answered on 18 Sep 2014
1 answer
886 views
Hi,
       I want to create a Kendo TabStrip where tabs are added dynamically. I know we can do it as below

@(Html.Kendo().TabStrip()
         .Name("tabstrip")
               .Items(tabstrip =>
          {
              foreach (var tab in @Model)    // I don't want to iterate through items like this
              {
                  tabstrip.Add().Text(tab.ComponentTypes).Content(@<text>
                    @(Html.Kendo().Grid<dynamic>().Name("grids" + tab.ComponentTypes)                         
                .Columns(columns =>
                {

                }).HtmlAttributes(new { style = "width: 980px;height: 800px" })
                                .Scrollable().Events(events => events.DataBound("dataBound"))
                                .ClientDetailTemplateId("template").Sortable().Pageable().DataSource(dataSource => dataSource
                                .Ajax()
                                                                          .Read(read => read.Action("GetResults", "Result", new {
                                                                              ScanID = tab.ScanID,
                                                                              ComponentType = tab.ComponentTypes }))
                                        .ServerOperation(false)))
                </text>
                );
              }

          }) .Events(events => events.Select("onSelect"))
)

Above code works well ,It is creating Tabs dynamically with grid in each tab. But it is iterating through items in a @Model. Instead of this , is there any other way to bind tabs dynamically to Kendo Tabstrip without iterating.My requirement is ,I want to create a Kendo Tabstrip where tabs are added  dynamically.Based on selection of tab ,I need to display data in Kendo Grid which is present inside Kendo Tabstrip where data in Grid changes based on Tab selection.

How to achieve this.Please Suggest..
Daniel
Telerik team
 answered on 18 Sep 2014
Narrow your results
Selected tags
Tags
+? more
Top users last month
Rob
Top achievements
Rank 3
Iron
Iron
Iron
Atul
Top achievements
Rank 1
Iron
Iron
Iron
Alexander
Top achievements
Rank 1
Veteran
Iron
Serkan
Top achievements
Rank 1
Iron
Shawn
Top achievements
Rank 1
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Rob
Top achievements
Rank 3
Iron
Iron
Iron
Atul
Top achievements
Rank 1
Iron
Iron
Iron
Alexander
Top achievements
Rank 1
Veteran
Iron
Serkan
Top achievements
Rank 1
Iron
Shawn
Top achievements
Rank 1
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?