Telerik Forums
UI for ASP.NET MVC Forum
3 answers
148 views

When I set an item to expand on initial render (via .Expanded(true)) I lose formatting.

I suspect this is because the item loses class "k-state-default" and we have overridden css for this class. I have worked around by adding the class directly:

panelbar.Add()
    .Text("Expanded Item")
    .HtmlAttributes(new {@class="k-state-default"})
    .Expanded(true)
    .Content(...

This seems to me to be a bug rather than default behaviour. Why would expanding on initial render be different from expanding via mouse click?

There is something in kendo.panelbar.js that looks a bit suspicious to me:

wrapperCssClass: function (group, item) {
    var result = "k-item",
        index = item.index;
 
    if (item.enabled === false) {
        result += " " + DISABLEDCLASS;
    } else if (item.expanded === true) {
        result += " " + ACTIVECLASS;
    } else {
        result += " k-state-default";
    }
 
    if (index === 0) {
        result += " k-first";
    }
 
    if (index == group.length-1) {
        result += " k-last";
    }
 
    if (item.cssClass) {
        result += " " + item.cssClass;
    }
 
    return result;
},

 

Can someone confirm if this is a bug or just me being dim.

Also, is my workaround safe (i.e. it won't interfere with the operation of the control).

Cheers,

Mark

 

 

 

 

 

 

Ivan Danchev
Telerik team
 answered on 26 Feb 2016
5 answers
2.6K+ views
I'm having problems with enabling.  I need to be able to have the dropdownlist, initially, be disable.  After I enable it, I need to retrieve data and filter based on parameters.  What I am running into is that when I enable the dropdownlist via javascript, nothing is happening.  What am I doing wrong?  Any help is greatly appreciated.

<script>
    function myFunction() {
        var functionalRequirements = new Array();
        var i = 0;
        var hearing = document.getElementById("hearing");
        var vision = document.getElementById("vision");
        if(hearing.checked) {
            functionalRequirements[i] = hearing.value;
            i++;
        }
        if(vision.checked){
            functionalRequirements[i] = vision.value;
            i++;
        }
  
        var categories = $("#categories").data("kendoDropDownList"),
            products = $("#products").data("kendoDropDownList"),
            orders = $("#orders").data("kendoDropDownList");

        categories.enable(true);
        categories.setDataSource(read.action("GetCascadeCategories", "Home", functionalRequirements));
        
        });

    }
</script>
<div class="demo-section">
<form name="input" id="theForm">
    <input type="checkbox" name="hearing" value="Hearing" id="hearing"/>Hearing
    <input type="checkbox" name="vision" value="Vision" id="vision"/>Vision
    <br/>
    <input type="submit" value="Submit" onclick="myFunction()"/>

</form>


    <p>
        <label for="categories">Catergories:</label>
        @(Html.Kendo().DropDownList()
              .Name("categories")
              .HtmlAttributes(new { style = "width:300px" })
              .OptionLabel("Select category...")
              .DataTextField("CategoryName")
              .DataValueField("CategoryId")
              .Enable(false)
             
              
              )

    </p>.....
Dimiter Madjarov
Telerik team
 answered on 26 Feb 2016
1 answer
111 views

Does anyone know how to Group by resource and date in the week view in MVC such as in this example in the ajax version?

http://demos.telerik.com/aspnet-ajax/scheduler/examples/resourcegrouping/defaultcs.aspx

if you set in the example GroupBy="Date, Speaker" the group will be by date and the speakers under each date.

 

I have tried to do something similar in the MVC version but not able to get the same behaviour

.Group(group => group.Resources("Date, EmployeeID")) - Failed

.Group(group => group.Resources("Date").Resources("EmployeeID")) - Failed

 

 

 

Vladimir Iliev
Telerik team
 answered on 26 Feb 2016
4 answers
248 views

Is it possible to get some or all of the values from subsequent pages in the grid?

For example:

The user is on page one or three. I would like to get all of the values for a particular column from the grid. Even those values not shown in the grid (pages 2 & 3).

Greg
Top achievements
Rank 1
 answered on 25 Feb 2016
3 answers
599 views

Using the Kendo Editor's FileBrowser is there any way to insert a link to a file who's <a> tag (anchor tag) has the attribute target="_blank", i.e. the link to the file opens in a new tab. I know this could be manually added to the inserted link through the "ViewHtml" button however my client is not tech savvy and this option is not a desired solution.

Below is an example of the current and desired outcome upon inserting a file using the FileBrowser.

Current outcome:
<a href="/Files/SomeFile.pdf">File</a>

Desired outcome:

<a href="/Files/SomeFile.pdf" target="_blank">File</a>


Stanimir
Telerik team
 answered on 25 Feb 2016
1 answer
82 views

I need to prevent some users from modifying current occurrence of recurring appointment. I've built scheduler_edit function but now adding new appointments is also disabled. How to distinguish between them? I've also tried using e.event.isNew() but it didn't work because event is new in both current occurrence and adding new appointment.

Plamen
Telerik team
 answered on 25 Feb 2016
2 answers
431 views

I'm testing the grid for an almost certain purchase, and I've tried to export it to both PDF and XLS. With Excel it was almost straight forward, but when I try to follow the steps presented on the demo (http://demos.telerik.com/aspnet-mvc/Beta/grid/pdf-export) it does not work. When I click on the export button, the progress bar loads and when it finishes nothing happens, the action never gets to be executed.

This is my view:

@model IEnumerable<ViewModels.TestViewModel>

@{
    ViewBag.Title = "Tests KendoUI";
}

<script src="~/Scripts/lib/jszip.min.js" type="text/javascript"></script>
<script src="~/Scripts/lib/pako.min.js" type="text/javascript"></script>

<style>
    /*
                Use the DejaVu Sans font for display and embedding in the PDF file.
                The standard PDF fonts have no support for Unicode characters.
            */
    .k-grid {
        font-family: "DejaVu Sans", "Arial", sans-serif;
    }

    /* Hide the Grid header and pager during export */
    .k-pdf-export .k-grid-toolbar,
    .k-pdf-export .k-pager-wrap,
    .k-pdf-export a.k-button.k-button-icontext,
    .k-pdf-export .k-filter-row,
    .k-pdf-export .k-grouping-header,
    .k-pdf-export .k-grid tr td:last-child {
        display: none !important;
    }
</style>

@(Html.Kendo().Grid(Model)
      .Name("grid")
      .DataSource(dataSource => dataSource
          .Ajax()
          .Read(read => read.Action("Products_Read", "Home"))
          .Aggregates(aggregates => aggregates.Add(p => p.oper_monto).Sum())
          )
      .Columns(columns =>
      {
        columns.Bound(p => p.oper_numero).Hidden(true);
        columns.Bound(p => p.oper_monto).ClientFooterTemplate("Total: #=sum#");
        columns.Bound(p => p.cpto_codigo);
      })
      .Excel(excel => excel
        .FileName("Reporte.xlsx")
        .Filterable(true)
        .AllPages(true)
        .ProxyURL(Url.Action("Excel_Export_Save", "Home"))
      )
      .Pdf(pdf => pdf
            .AllPages()
            .FileName("Reporte.pdf")
            .ProxyURL(Url.Action("Pdf_Export_Save", "Home"))
        )
      .ColumnMenu()
      .ToolBar(t => t.Excel().Text("Exportar a Excel"))
      .ToolBar(t => t.Pdf().Text("Exportar a PDF"))
      .ToolBar(toolBar => 
                    toolBar.Custom()
                        .Text("Guardar Preferencias")
                        .HtmlAttributes(new { id = "save" })
      )
      .ToolBar(toolBar =>
                    toolBar.Custom()
                        .Text("Cargar Preferencias")
                        .HtmlAttributes(new { id = "load" })
      )                      
      .Filterable(ftb => ftb.Mode(GridFilterMode.Menu))
)

<script>

    $(function () {
        var grid = $("#grid").data("kendoGrid");

        $("#save").click(function (e) {
            e.preventDefault();
            localStorage["kendo-grid-options"] = kendo.stringify(grid.getOptions());
        });

        $("#load").click(function (e) {
            e.preventDefault();
            var options = localStorage["kendo-grid-options"];
            if (options) {
                grid.setOptions(JSON.parse(options));
            }
        });
    });
</script>

And this is my controller action:

[HttpPost]
        public ActionResult Pdf_Export_Save(string contentType, string base64, string fileName)
        {
            var fileContents = Convert.FromBase64String(base64);

            return File(fileContents, contentType, fileName);
        }

 

Thanks in advance.

Dimiter Madjarov
Telerik team
 answered on 24 Feb 2016
3 answers
152 views

Hi,

I'm currently using a custom timeline view on my scheduler as my only view.
In this particular case the "business hours" button isn't really relevant.
How would one go about hiding this button as elegantly as possible?

Many thanks in advance.

Pavlos
Top achievements
Rank 1
 answered on 24 Feb 2016
2 answers
101 views

Hi,

 

I'd like to edit a child collection of entities in a Grid with local data and inline edit. Is this possible?

I tried it and it doesn't work.

Thanks

Sven

Sven
Top achievements
Rank 1
 answered on 24 Feb 2016
3 answers
221 views

Hi,

I have 2 tiers of Kendo Grids. They are defined as:

1st tier grid:

            <% Html.Kendo().Grid<EvaluationsSummaryGridViewModel>()
                .Name("EvaluationGrid")
                .TableHtmlAttributes(new { style = "font-size:8pt;" })
                .HtmlAttributes(new { style = "height:415px;width:1100px" })
                .DataSource(dataSource => dataSource
                        .Ajax()
                        .Model(model => model.Id(a => a.EvaluationId))
                        .ServerOperation(true)
                        .Events(e => e.RequestEnd("onEvaluationSummaryRequestEnd"))
                        .Read(read => read.Action("GetEvaluationSummaryAjax", "Evaluations", new { yearId = ViewData["YearId"], evaluationVersionId = ViewData["EvaluationVersionId"] }))
                        .PageSize(15)
                    )
                .Editable(e => e.Mode(Kendo.Mvc.UI.GridEditMode.InLine).Enabled(true))
                .ClientDetailTemplateId("EvaluationOverallQuestionTemplate")
...

%>

2nd tier grid:

    <script id="EvaluationOverallQuestionTemplate" type="text/x-kendo-template">
        <%: Html.Kendo().Grid<EvaluationsSummaryOverallQuestionsGridViewModel>()
            .Name("EvaluationGrid_#=EvaluationId#")
            .TableHtmlAttributes(new { style = "font-size:8pt;" })
            .HtmlAttributes(new { style = "height:320px;width:950px" })
            .DataSource(dataSource => dataSource
                    .Ajax()
                    .Model(model => model.Id(a => a.EvaluationQuestionId))
                    .ServerOperation(false)
                    .Events(a => a.RequestEnd("onEvaluationsSummaryOverallQuestionsGridRequestEnd"))
                    .Read(read => read.Action("EvaluationsSummaryOverallQuestionsAjax", "Evaluations", new { evaluationId ="#=EvaluationId#" }))
                )
            .Pageable(pager => pager.Input(true)
                                    .Refresh(true)
                                    .PageSizes(new[] { 10, 20, 30 })
                    )
            .Editable(e => e.Mode(Kendo.Mvc.UI.GridEditMode.InLine).Enabled(true))
            .Scrollable(scrolling => scrolling.Height(300))
            .Resizable(resize => resize.Columns(true))
            .Sortable()
            .Filterable()
            .Columns(columns =>
            {
                columns.Bound(b => b.EvalutionMasterPillarId)
                    .Width(100);
                columns.Bound(b => b.VersionQuestion)
                    .Width(300);
                columns.Bound(b => b.HPAAssessment)
                    .Width(300);
                columns.Bound(e => e.EvaluationStatusInitial)
                    .ClientTemplate("<div class='sprite sprite-StopLight_#=EvaluationStatusInitial#'></div>")
                    .Filterable(false)
                    .Sortable(false)
                    .HtmlAttributes(new { style = "text-align:center" })
                    .Width(100);
                columns.Bound(e => e.EvaluationStatusCurrent)
                    .ClientTemplate("<div class='sprite sprite-StopLight_#=EvaluationStatusCurrent#'></div>")
                    .Filterable(false)
                    .Sortable(false)
                    .HtmlAttributes(new { style = "text-align:center" })
                    .Width(100);
           })
           .ToClientTemplate()         
        %>
    </script>

The problem is that while 1st tier grid is working fine, 2nd tier grid can not be opened when clicking on the arrow on each row of 1st grid. The reason is ClientTemplate("<div class='sprite sprite-StopLight_#=EvaluationStatusInitial#'></div>"), which is supposed to display different icons based on the value of "EvaluationStatusInitial". I need help on how to make it work. Thanks.

 

Maria Ilieva
Telerik team
 answered on 24 Feb 2016
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
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
DateTimePicker
TimePicker
StockChart
RadialGauge
ContextMenu
ArcGauge
+? more
Top users last month
Jay
Top achievements
Rank 3
Bronze
Iron
Iron
yw
Top achievements
Rank 2
Iron
Iron
Stefan
Top achievements
Rank 2
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Bohdan
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Jay
Top achievements
Rank 3
Bronze
Iron
Iron
yw
Top achievements
Rank 2
Iron
Iron
Stefan
Top achievements
Rank 2
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Bohdan
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?