Telerik Forums
UI for ASP.NET MVC Forum
5 answers
292 views
I copied the excel demo and got the following message.  I am not sure if it is b.c i am dynamically binding that data.

Excel export is not supported in server binding mode.

View
@(Html.Kendo().Grid(Model)
    .Name("grid")
    .Columns(columns =>
    {
        foreach (System.Data.DataColumn column in Model.Columns)
        {
            var c = columns.Bound(column.ColumnName);
 
        }
    })
    .ToolBar(tools => tools.Excel())
    .Pageable()
    .Sortable()
    .Scrollable()
    .Excel(excel => excel
        .FileName("Export.xlsx")
        .Filterable(true)
        .ProxyURL(Url.Action("Excel_Export_Save", "Reports"))
    )
    .HtmlAttributes(new { style = "height:430px;" })
    .DataSource(dataSource => dataSource
    .Server()
    .Model(model =>
    {
        foreach (System.Data.DataColumn column in Model.Columns)
        {
            var field = model.Field(column.ColumnName, column.DataType);
        }
    })
    )
 
)

controller
[HttpPost]
public ActionResult Excel_Export_Save(string contentType, string base64, string fileName)
{
    var fileContents = Convert.FromBase64String(base64);
 
    return File(fileContents, contentType, fileName);
}
jim
Top achievements
Rank 1
 answered on 23 Feb 2015
6 answers
604 views
Hello,
I have a Telerik ListView inside a partial view that is rendered inside a kendo Window in modal mode.  Using MVC5.

The listview is setup to query the controller for records (which are image files).

In the edit view for my model, and the user can select an image to be part of the model's data.  I want them to select from maybe 5000 images on our system.  So the Listview popup starts with 6 visible images (pagesize is 6) and they can cycle via paging to the image they want to select.

This all works fine.

Currently when the listbox is displayed, (after a button click on view), it always shows the very first 6.  Consider case where user is editing record 10, and that record has already specified it uses pictureId 50 (pictureID is foreign key to picture table).  I want the listbox to show Item 50 in its selected page, but allow the user to page back to other pages, or page forward.  The page backs/forwards will do the datarequests as needed.

I added a "save" button to the popup window so i could test out code.  My listview is named "imageListView".
In my sample, i just wanted to choose item 9, as an example. 
If i first navigate to page 2 so item 9 is shown on the listview, then the below code works fine.
but if i am on page 1 (items 1-6 shown), the get(9) call returns null.

how can i figure out what page to go to prior to actually loading the items on the page?

$("#save").click(function () {
    var lv = $("#imageListView").data("kendoListView");
    var model = lv.dataSource.get(9);
    var index = lv.dataSource.indexOf(model);
     var pg = Math.floor(index / lv.dataSource.pageSize()) + 1;
    lv.dataSource.page(pg);
}

Nikolay Rusev
Telerik team
 answered on 23 Feb 2015
3 answers
138 views
We allow our users to optionally save the state of their grids and persist them in the db. When a user comes back to he screen, they see the standard grid display just for a moment, then it updates their grid via JavaScript ( setOptions call) as it applies their persisted state settings. This makes it look like it's doing a double load. 

We would rather just initialize the grid with their persisted settings (via serialized json string) so the grid shows correctly on the initial load.

Is this possible?

We are using MVC.

Thanks!
The Bearded One
Top achievements
Rank 1
 answered on 23 Feb 2015
6 answers
807 views
Hello,
 
I have an editable grid which is set up to use PopUp edit mode. One of the columns (color) is a string that holds a hex value for a color. I have created an editor template to handle the edit and create functions.  Here is how I define the grid:

@(Html.Kendo().Grid<DL.Data.PayCodes>()
            .Name("grdPayCodes")
            .Columns(columns =>
            {
                columns.Bound(p => p.pay_code).Width(120).Title("Code");
                columns.Bound(p => p.color).Width(75).Title("Color").ClientTemplate("<div style='width: 100%; text-align: center;'><div style='width: 25px; height: 25px; background: #=color#; -moz-border-radius: 17px; -webkit-border-radius: 17px; border-radius: 17px; margin: auto; #= SetBorder(this, color)#'></div></div>");
                columns.Bound(p => p.description).Title("Description");
                columns.Command(command => { command.Edit(); command.Custom("Delete").Click("DeletePayCodes_Click"); }).Width(180).HtmlAttributes(new { style = "text-align: center;" });
            })
            .ToolBar(toolbar => toolbar.Create())
            .Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("PayCodesAddRecordTemplate"))
            .Sortable()
            .Scrollable()
            .HtmlAttributes(new { style = "height:430px; margin-top: 7px;" })
            .DataSource(dataSource => dataSource
                .Ajax()
                .Model(model => model.Id(p => p.pay_code))
                .Create(update => update.Action("CreatePayCodes", "Settings"))
                        .Read(read => read.Action("GetPayCodesDSGrid", "Common"))
                        .Update(update => update.Action("UpdatePayCodes", "Settings"))
                                .Events(events => events.Error("grdPayCodes_ErrorHandler").RequestEnd("grdPayCodes_RequestEnd"))
            )
                    .Events(ev => ev.DataBound("grdPayCodes_DataBound").Edit("grdPayCodes_Edit"))
        )
and here is how I define my editor template
<table style="margin-left: 5%; width: 90%;">
    <tr>
        <td class="label-cell">
            <label for="pay_code">Code</label>
        </td>
        <td>
            <input id="pay_code" name="pit_name" class="data-cell" data-bind="value: pay_code">
        </td>
    </tr>
    <tr>
        <td class="label-cell">
            <label for="color">Color</label>
        </td>
        <td>
            @(Html.Kendo().ColorPicker()
                .Name("color")
                .Value("#ffffff")
            )
        </td>
    </tr>
    <tr>
        <td class="label-cell">
            <label for="description">Description</label>
        </td>
        <td>
            <input id="description" name="description" class="data-cell" data-bind="value: description">
        </td>
    </tr>
</table>
Everything works well for the edit, however when I try to create a new record, I get an error: Cannot Parse Color: at kendo.all.min.js, line 17, column 6374

I understand that when creating a new record the color property of the model is an empty string, but I am initializing the color picker with a default value of #ffffff. Why am I still getting this error?

I am using version 2013.3.1119.340 with VS 2013. I am testing on IE 11, but I tried FF and I am still getting the same error.

Any help would be greatly appreciated.

Thank you.






Dimiter Madjarov
Telerik team
 answered on 23 Feb 2015
2 answers
127 views
For the majority of our grids we have a specific configuration, Paging, Filters, etc. Any ideas of how to create a single config object in C# that I can just pass into a grid rather than setting everything for every grid.

With js it seems doable... I just create a config object, modify any of our defaults if needs for that grid, and pass it to the jQuery extension. 

But, I'm not sure how to do it for the MVC helpers. Any ideas?
Bob
Top achievements
Rank 1
 answered on 20 Feb 2015
2 answers
334 views
Hello,

I would like to have multiple controls in a column on a single grid row.
For example like two datetime controls in a column on a row. I could use row template and can show (display) one below another in a row of a column, but how to do edit (& delete)? Please provide technical inputs and how to do it.

Attached is picture showing what is my requirement (for example: Scheduled time and Actual time in a row of a single column). How to achieve edit/ delete?
Brian
Top achievements
Rank 1
 answered on 20 Feb 2015
8 answers
242 views
I was following the demo for the Custom Editting
http://demos.telerik.com/aspnet-mvc/grid/editing-custom

And I did not get the Drop down as expected.    I saw the ID  and Name be replace in the column instead a drop down

I used the 
Columns.Bound(p => p.Category).ClientTemplate("#=Category.CategoryName#").Width(160);


The one thing I couldnt not figure out was in the Controller it defince the ViewData["categories"] = categories;

I could not figure out how that was wired to the Razor page.



Kelso
Top achievements
Rank 1
 answered on 20 Feb 2015
3 answers
3.9K+ views
I am using kendo button the following way.

    @(Html.Kendo().Button().Name("deleteButton").HtmlAttributes(new { type = "button", @class = "k-primary pull-right" }).Content("Delete").Events(ev => ev.Click("Delete(1)")))

I need to call a javascript function with parameters

        function Delete(value)
        {
            alert(value)
        }

But it doesn't work when I click the button.
Everything works fine without arguments.

Does telerik support passing arguments to javascript functions from buttons?
Dimiter Madjarov
Telerik team
 answered on 20 Feb 2015
2 answers
515 views
I have the following grid in my table. I am using the first column with a checkbox for selectig teh row.
And it has a header for multiselect(selects all check boxes using jquery)

 @(Html.Kendo().Grid<Customer>()
          .Name("grid")
          .Columns(columns =>
          {
              columns.Template(@<text></text>)
                  .ClientTemplate("<input name='chkSelect' id='select_#= Id #' type='checkbox' value='#= Id #' />").Width(30)
                  .HeaderTemplate("<input id='chkSelectAll'  type='checkbox'/>").Locked(true);    
      
     
              columns.Bound(c => c.Name)
                  .ClientTemplate("<a href='" + Url.Action("Edit", "Customer") + "/#= Id #' " + ">#= Name #</a>").Width(140)

              columns.Bound(c => c.CustomerName).Width(110).Filterable(ftb => ftb.Cell(cell => cell.ShowOperators(false)));
          })


Now I also have  feature for show/hide column and I persist them using localstorage like this


        function SaveHiddenState() {
            var grid = $("#grid").data("kendoGrid");
            localStorage["customer-grid-options"] = kendo.stringify(grid.getOptions());
        }

And I retreive the saved options using this

        $(function () {
            var grid = $("#grid").data("kendoGrid");
            var options = localStorage["account-grid-options"];
            if (options) {
                grid.setOptions(JSON.parse(options));
            }
        });

All these work fine.
But strangely I am losing my header template for my first column alone if I get data from the localstorage. I  just get a blank header as if I hadnt included a headertemplate.
 Anything that I am missing ?




prakash
Top achievements
Rank 1
 answered on 20 Feb 2015
3 answers
112 views
We've run into the situation where a chart is rendering one of the labels too high, so it gets hidden under the (kendo) window title bar. I've attached pictures of it rendered incorrectly in firefox (chrom does the same) and rendered correctly in IE. I'm guessing this related to the box model.

We're currently running an older version (2012.2.710.340) because we ran into some issues trying to get current and I haven't got them sorted out yet. So wondering if this has perhaps already been fixed in a later version? I'm able to work around the issue by calculating a max and setting it, but it'd be nice if I didn't have to do that.
Iliana Dyankova
Telerik team
 answered on 20 Feb 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
Rob
Top achievements
Rank 3
Bronze
Iron
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Top users last month
Rob
Top achievements
Rank 3
Bronze
Iron
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?