Telerik Forums
UI for ASP.NET MVC Forum
1 answer
241 views

Using UI for MVC (Q1 2016)

@(
    Html.Kendo().ComboBoxFor(m => m)
    .Filter(FilterType.Contains)
    .AutoBind(false)
    .Placeholder("Choose Course")
    .HtmlAttributes(new { style = "width:400px;" })

    //Removed for brevity

)

 

The following width style in the HtmlAttributes above will cause the combobox dropdown button wrapper div to increase as a percentage of the entire combobox (ie. the div gets wider as the entire combobox gets wider.). Is this the native behavior when changing the width of the combobox? I also have not had this issue with any other widgets. 

See attached png file.

Chris
Top achievements
Rank 1
 answered on 09 Jun 2016
3 answers
466 views

I am using Kendo UI 2016.1.226, Windows 7 Enterprise SP 1, Google Chrome 51.0.2704.79 m, SQL Server 2012

I created a ListView for available report filters (Filter List), which loads from a stored procedure and uses the HTML ListView wrapper.  On Filter List databound, I am dynamically creating 2 more listviews (Available items and Selected items) for each item in the primary ListView.  When an item is selected from the primary, if no items are currently in the available list, the datasource is read from a stored procedure, passing the report filter ID, and returns a list of KeyIndex (int) and Value (string) items from various DB tables.  These are supposed to be loaded in the Available ListView's databound event.  However, there are no items in the datasource after return from the stored procedure call.

 

I suspect the issue is a JSON vs. OData format issue (see 12/5/2011 post here: http://www.telerik.com/forums/connect-grid-to-mvc-controller-method).  I don't care about grouping, filtering, and sorting of the items, but it seems like I may need to send a request object to the controller in order to call ToDataSourceResult, which I'm guessing converts JSON to OData format.  The Available datasource has AutoBind set to false, so that I can load only the report filters as needed.  When I try to pass information in the request, I get the following error because there is no data to group, filter, or sort yet:

    jquery.min.js:3 Uncaught TypeError: Cannot read property 'length' of undefined

 

                var availableDataSource = listViewAvailable.dataSource;
                var parameterMap = availableDataSource.transport.parameterMap;
                var request = parameterMap({ filter: availableDataSource.filter(), group: availableDataSource.group(), sort: availableDataSource.sort() });
                availableDataSource.transport.options.read.url = 
                    "/ReportCategory/GetFilterValues?FilterID=" + dataItem.ReportFilterID + "&TplNum=" + @ViewBag.TplNum + "&request=" + request;
                availableDataSource.read();

If I leave the parameterMap empty, my controller routine is called, the JSON data is populated and returned to the client, but the number of items in the datasource is 0:

               var request = parameterMap({  });

 

        public async Task<ActionResult> GetFilterValues([DataSourceRequest]DataSourceRequest request, int FilterID = 0, int TplNum = 0)
        {
            var url = string.Format("{0}{1}/{2}", GlobalVariables.ApiBaseUrl.Replace("api", "GetFilterValues"), FilterID, TplNum);

            var jsonResult = await Request.GetSerializedJsonResult<FilterValues>(url);
            IList listFilterValues = (IList)jsonResult;

            return Json(listFilterValues.ToDataSourceResult(request),JsonRequestBehavior.AllowGet);
        }

Datasource definition:

                    filterDataSource = new kendo.data.DataSource({
                        type: "odata",
                        transport: {
                            read: {
                                url: "/api/GetFilterValues/" + filterRecord.ReportFilterID + '/' + @ViewBag.TplNum,
                                type: "GET",
                                dataType: "json"
                            },
                        },
                        schema: {
                            model: {
                                fields: {
                                    KeyIndex: { type: "number" },
                                    Value: { type: "string" }
                                }
                            },
                            data: function(data) { return data.value; },
                            total: function(data) { return data["odata.count"]; }
                        },
                        serverFiltering: true,
                        serverGrouping: true,
                        serverSorting: true
                    });

Available ListView:

            idString = "Filters_1_" + filterIndex;
            divString = '<div id="' + idString + '" class="filterlist1" style="display: none;"><h2>Available Values</h2></div>';
            divStringInner = '<div class="filterlist1_inner"></div>';
            $(divString).insertAfter('#ReportFilters');
            $(divStringInner).insertAfter('#' + idString + ' h2').kendoListView({
                dataSource: filterDataSource,
                dataBound: onAvailableDataBound,
                autoBind: false,
                pageable: false,
                selectable: selectableType,
                template: kendo.template($('#' + templateName).html())
            });

ListView item template (TBD being eventually replaced by the Value string in the datasource):

<script type="text/x-kendo-tmpl" id="options">
<div class="filter2">
    <h3 value='0'>TBD</h3>
</div>
</script>

 

I saw something for SQL Server called FOR JSON AUTO that may help make the stored procedure OData compliant (https://msdn.microsoft.com/en-us/library/dn921897.aspx), but that is for SQL Server 2016 on.  Any ideas?

Brian
Top achievements
Rank 1
 answered on 09 Jun 2016
3 answers
415 views
Hi,

I'm not able to get Ajax binding to work with my combobox.  I went the Kendo Ajax binding example to the letter.  The combox box returns 'undefined' in the results.  I verified that the controller method is called.

Controller:
public JsonResult GetContainers()
        {
            List<Container> containers = new List<Container>();
            containers.Add(new Container() { ContainerId = 1, ContainerName = "Container1" });
            containers.Add(new Container() { ContainerId = 2, ContainerName = "Container2" });
  
            return Json(containers);
        }
View:
    @(Html.Kendo().ComboBox()
        .Name("TestContainerName")
        .DataTextField("ContainerName")
        .DataValueField("ContainerId")
        .Filter(FilterType.Contains)
            .DataSource(dataSource =>
            {
                dataSource.Read(read =>
                    {
                        read.Action("GetContainers", "Common");
                    });
            })
        .SelectedIndex(0)
)
Mark
Top achievements
Rank 2
 answered on 09 Jun 2016
1 answer
140 views

I am using Kendo Grid and also using its Foreign Key column editing option.

When I build my project on local host, it seems everything is perfect.

However, when I publish it, it does not working as on my local host.

On my local, it is a dropdownlist but when I publish it, it seems like its a numeric textbox.

How can I fix this ?

Konstantin Dikov
Telerik team
 answered on 09 Jun 2016
7 answers
3.0K+ views
I'm having trouble figuring out how to use a Kendo Comobox in an editor template for a Grid cell (both ajax).  Is there an example of this anywhere? I have a typical scenario where the Combobox has an id for the value and but text for the display.  The text needs to appear in the grid cell and combobox, but the id needs to be posted when the grid is submitted.  Below is a code snippet for what I have at the moment.

The column binding for the grid of employees:

columns.Bound(c => c.Employee).EditorTemplateName("EmployeeId");

The editor template:

@(Html.Kendo().ComboBox()
          .Name("EmployeeId")
          .DataTextField("value")
          .DataValueField("key")
          .Filter("startswith")
          .DataSource(source => {
              source.Read(read =>
              {
                read.Action("GetEmployees", "Employee");
              })
              .ServerFiltering(false);
          })
    )

This loads the combobox values and the startswith filtering is working fine, but when I make a selection, the grid doesn't take the selected value.  It works if I switch to a column bound to the EmployeeId, but then the column displays the id rather than the text.

What is the right way to handle this?  I would think this is a really common scenario, so assume there is a straight forward way to deal with it.

Thanks, DanO
lucerias
Top achievements
Rank 1
 answered on 09 Jun 2016
1 answer
391 views
I am working on Kendo UI Grid.  I have requirement where role will added dynamically.  So in a single column there should be multiple checkbox. Is there is any way to fix it.
Marin
Telerik team
 answered on 08 Jun 2016
3 answers
513 views

Hi!

After a while, I was able to have a working EditorTemplate for a List<MyObject> type. I'm calling the Template using UIHint over the collection property n the parent ViewModel. The grid on the EditorTemplate is however complete Widget-based now. It is working with the data array woth matching properties as of the actual ViewModel. How do I map the final rows of a kendo grid to the Model?

Shafi
Top achievements
Rank 1
 answered on 08 Jun 2016
3 answers
532 views
It appears that something with the tooltip is preventing the bootstrap row from sizing the 12 columns correctly and less then 12 seem to fit in a row by default.

You can see an email here: http://dojo.telerik.com/uCamu (you will need to expand the results side so the columns aren't stacked)

Thanks,
~L
Dimo
Telerik team
 answered on 07 Jun 2016
2 answers
619 views

This isn't really specific to MobileView but I'm using a MobileView in a partial view that I'm using as a layout template and I want to make the Title dynamic by using ViewBag.Title as the string.

@(Html.Kendo().MobileView()
                .Title(ViewBag.Title)
                .Name("two-drawer-home")
                .Header(obj => Html.Kendo().MobileNavBar().Content(navbar =>
                    @<text>
                        @(Html.Kendo().MobileButton().Name("btnLeftDrawer").Align(MobileButtonAlign.Left).Rel(MobileButtonRel.Drawer).Url("#left-drawer").ClickOn("down"))
                        @navbar.ViewTitle("Hello there")
                        @(Html.Kendo().MobileButton().Name("btnRightDrawer").Align(MobileButtonAlign.Right).Rel(MobileButtonRel.Drawer).Url("#right-drawer").ClickOn("down"))
                    </text>)
                .HtmlAttributes(new { style = "height: 46px;" })
                )
                .Content(@<text>@RenderBody()</text>)
)

 

But this isn't valid. I've also tried @ViewBag.Title and various other incarnations. I'm wondering if this type of thing is possible in the Title of the MVC controls. 

Mike
Top achievements
Rank 1
 answered on 07 Jun 2016
0 answers
140 views
From the official 2016 Q2 Release (2016.2.504) the Scheduler will start using comma (previously semicolon) as delimiter for the recurrence exceptions. Also the Scheduler will no longer add trailing delimiter to the recurrence exception.

This change was required as the previous behavior does not conform to the RFC5545 spec:

From the official 2016 Q2 Release (2016.2.504) the Scheduler will start using comma (previously semicolon) as delimiter for the recurrence exceptions. Also the Scheduler will no longer add trailing delimiter to the recurrence exception. This change driven by the RFC5545 spec (previous behavior was incorrect):


http://tools.ietf.org/html/rfc5545#page-120
The following changes are required to all events that have "recurrenceException" set:
  1. Remove the trailing semicolon delimiter
  2. Replace all occurrences of semicolon with comma
//Old recurrence exception:
recurrenceException:"20160603T050000Z;20160503T050000Z;"
  
//New recurrence exception:
recurrenceException:"20160603T050000Z,20160503T050000Z"

Apologies for the caused inconvenience.
Kendo UI
Top achievements
Rank 1
 asked on 07 Jun 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
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?