Telerik Forums
UI for ASP.NET MVC Forum
1 answer
148 views
I can't get date editing to work within my grid.

Date formatting is set to yyyy-MM-dd everywhere I can think of

In the viewmodel I have EstCommenceDate set as follows

[Required]
[DataType(DataType.Date)]
[DisplayFormat(ApplyFormatInEditMode = true, DataFormatString = "{0:yyyy-MM-dd}")]
[Display(ResourceType = typeof(Resources), Name = "OpportunityGridViewModel_EstCommenceDate", Description = "OpportunityGridViewModel_EstCommenceDate")]
[UIHint("GridDateColumn")]
public DateTime? EstCommenceDate { get; set; }

In GridDateColumn.cshtml I have
@Html.Kendo().DatePickerFor(m => m).Format("yyyy-MM-dd")

When I edit a date and try and save changes why does it give this attached error?  Why is the date in US format?

Vladimir Iliev
Telerik team
 answered on 17 Jan 2014
1 answer
351 views
Hi,
I'm trying to set the editor so it won't include the 'allday' and 'repeater' sections, but I do want an atendees multiselect like the one you use in your resource example
I've set a template with the start and end date but i'm having trouble with getting the multiselect to work and specially I'm unable to pull the atendees for each event.

I've searched the web finding interesting examples like: this but I do want to use the mvc helper

any help will be appreciated
Vladimir Iliev
Telerik team
 answered on 17 Jan 2014
2 answers
589 views
Related to this question, I want to achieve the same behavior inside the ListView instead of a kendo Grid. My attempt is here. The edit template switches to different controls based on the value in the model at the beginning of the edit. But the problem is that I can't find a way to switch the 2nd field based on the user selection in the first field.  Also if I change the first field to an 'AutoComplete' list, can I still follow the same pattern?  One answer to this question didn't solve the proper data binding.  I appreciate any help to solve this.

Thank you

Code:

<div class="row">
<div class="col-xs-6 col-md-4">
<!-- Inputs -->
<div class="demo-section">
<a class="k-button k-button-icontext k-add-button" href="#"><span class="k-icon k-add"></span>Add new record</a>
</div>

<div id="listView"></div>

<script type="text/x-kendo-tmpl" id="template">
<div class="product-view k-widget">
<div class="edit-buttons">
<a class="k-button k-button-icontext k-edit-button" href="\\#"><span class="k-icon k-edit"></span></a>
<a class="k-button k-button-icontext k-delete-button" href="\\#"><span class="k-icon k-delete"> </span></a>
</div>
<dl>
<dt>Type</dt>
<dd> #: typeTitle# </dd>
<dt>Value</dt>
<dd>
# if (typeTitle === "DateTime") { #
#: kendo.toString(name, "MM/dd/yyyy hh:mm")#
#} else { #
#:name #
# } #
</dd>
</dl>
</div>
</script>

<script type="text/x-kendo-tmpl" id="editTemplate">
<div class="product-view k-widget">
<div class="edit-buttons">
<a class="k-button k-button-icontext k-update-button" href="\\#"><span class="k-icon k-update"></span></a>
<a class="k-button k-button-icontext k-cancel-button" href="\\#"><span class="k-icon k-cancel"></span></a>
</div>
<dl>
<dt>Key</dt>
<dd>
<select data-role="dropdownlist"
data-text-field="title"
data-value-field="id"
data-source="_typeDataSource"
data-bind="value: typeTitle"
name="InputType"
data-change="dropdownlist_change"
required="required"
validationmessage="required"></select>
<span data-for="InputType" class="k-invalid-msg"></span>
</dd>
<dt>Value</dt>
<dd>
<div id="divInputType">
# if (typeTitle === "DateTime") { #
<input data-role="datetimepicker" type="text" data-bind="value: name" data-format="MM/dd/yyyy hh:mm" name="InputValue" required="required" validationmessage="required" />
#} else { #
<input type="text" data-bind="value: name" name="InputValue" required="required" validationmessage="required" />
# } #
<span data-for="name" class="k-invalid-msg"></span>
</div>
</dd>
</dl>
</div>
</script>

</div>
<div class="col-sm-6 col-md-8">
<!-- Data -->
Diagnostics Data will be shown here.
</div>
</div>

<script>
_typeDataSource = new kendo.data.DataSource({
data: [{
id: 1,
title: "String"
}, {
id: 2,
title: "Number"
}, {
id: 3,
title: "DateTime"
}]
});

_peopleDataSource = new kendo.data.DataSource({
data: [{
id: 1,
name: "John",
typeId: 1,
typeTitle: "String"
}, {
id: 2,
name: "12345",
typeId: 2,
typeTitle: "Number"
}, {
id: 3,
name: "12/20/2013",
typeId: 3,
typeTitle: "DateTime"
}],
schema: {
model: {
id: "id",
fields: {
id: {
editable: false,
nullable: true
},
name: {
validation: {
required: true
}
},
typeTitle: "typeTitle"
}
}
}
});

listView = $("#listView").kendoListView({
dataSource: _peopleDataSource,
template: kendo.template($("#template").html()),
editTemplate: kendo.template($("#editTemplate").html())
}).delegate(".k-edit-button", "click", function (e) {
listView.edit($(this).closest(".product-view"));
e.preventDefault();
}).delegate(".k-delete-button", "click", function (e) {
listView.remove($(this).closest(".product-view"));
e.preventDefault();
}).delegate(".k-update-button", "click", function (e) {
listView.save();
e.preventDefault();
}).delegate(".k-cancel-button", "click", function (e) {
listView.cancel();
e.preventDefault();
}).data("kendoListView");

$(".k-add-button").click(function (e) {
listView.add();
e.preventDefault();
});

function dropdownlist_change(e) {
var value = this.value();
// Use the value of the widget

console.log(value);
//if (value == 2) {
// console.log('here');

// var secondColumn = $('#divInputType');
// secondColumn.empty();
// //var model = grid._modelForContainer(secondColumn);

// $("<input data-bind='value: Value '/>").appendTo(secondColumn).kendoDateTimePicker();
// kendo.bind(secondColumn, model);
//}
}
</script>
Saravanan
Top achievements
Rank 1
 answered on 16 Jan 2014
1 answer
222 views
we have an issue with the upload in our MVC application that the full path is pulled back in IE while FF & Chrome only have file name.  Can any one provide any input on this?  TIA
Dimo
Telerik team
 answered on 16 Jan 2014
1 answer
74 views


Steps to reproduce the issue:

1. Open the Telerik asp.net mvc grid page shown in the below link.

http://demos.telerik.com/aspnet-mvc/razor/Grid/EditingAjax?theme=vista

2. Click on Add New Record button and enter a date in one of the date pickers in the grid. Click on save button.

3. Now change the TimeZone of your machine to a TimeZone which is running at least a few hours behind your current Time Zone and refresh the entire page (Ctrl+F5).

4. If there is a major time difference between the newly selected timezone and your default timezone then the previously saved date would get reduced by a day. For example: if the date you had saved was 1/1/2014 it would get changed to 12/31/2013.

5. Could you please help understand why this is happening and provide a solution that would prevent the date being reduced by a day depending on the client machine's time zone.

Thanks.
Alexander Popov
Telerik team
 answered on 15 Jan 2014
3 answers
78 views
Hi everyone, I'm using the asp.net mvc wrapper chart, but I have a problem when I set the graphic type to column, is some cases I get the text undefined, I attached an image, my code is:
01.@(Html.Kendo().Chart(Model)
02.    .Name("graphicchart")
03.    .Title(title => title.Text(ViewBag.graphictitle))
04.    .Legend(legend => legend
05.        .Position(ChartLegendPosition.Bottom)
06.    )
07.    .ChartArea(chartArea => chartArea
08.        .Background("transparent")
09.    )
10.   .SeriesDefaults(seriesDefaults =>
11.        seriesDefaults.Line()
12.    )
13.    .Series(series =>
14.    {
15.        series.Line(model => model.Parvalue).Name("Valor").Labels(true).Markers(true).Width(3).Opacity(0.8);
16.    })
17.    .CategoryAxis(axis => axis
18.        .Categories(model => model.Datetimevalue)
19.        .MajorGridLines(lines => lines.Visible(false))
20.        .Labels(labels => labels.Rotation(-90))
21.        .Date()
22.        .BaseUnitStep(10)
23.        .MinorGridLines(lines => lines.Visible(true))
24.    )
25.    .Tooltip(tooltip => tooltip
26.        .Visible(true)
27.        .Format("{0}")
28.    )
29.)
Thanks for your help!
Iliana Dyankova
Telerik team
 answered on 15 Jan 2014
4 answers
301 views
I recently downloaded the Kendo UI for ASP.Net MVC.  I ran the msi installer.  Then I started looking for the MVC control examples.   I looked in the following folder. C:\Program Files (x86)\Telerik\Kendo UI for ASP.NET MVC Q2 2013\src\Kendo.Mvc.  I opened the csproj file, "Kendo.MVC.csproj"  However, I did not find any MVC examples.  Please tell me where I can find MVC examples for using the Kendo controls.
Preeti
Top achievements
Rank 1
 answered on 15 Jan 2014
2 answers
368 views
I'm implementing single row undo functionality (rather than cancelling all changes made in the grid). I have an image that will be clicked to trigger the undo:

columns.Template(@<text></text>).ClientTemplate("<img class='undoButton' style='width:16px;' src='Content/images/undo.png' />").Width(32);

Then some JavaScript that attaches the functionality to the img:

<script type="text/javascript">
        // Undo functionality
        $('#activity-grid').on('click', '.undoButton', function (e) {
            e.preventDefault();
  
            //alert('undo');
  
            var grid = $('#activity-grid').data().kendoGrid;
            var dataItem = grid.dataItem($(this).closest('tr'));
  
            dataItem.dirty = false;
  
            grid.dataSource.cancelChanges(dataItem); // works
  
            //grid.refresh(); // only way to show the changes in the UI
        });
</script>

The bolded line clears the changes, but the grid is not updated unless I call the line that is commented out (grid.refresh()).

The problem is that calling .refresh clears the other rows' "dirty" indicator, which is problematic. Is there a way to refresh the UI for a single row? I thought by calling cancelChanges(dataItem), it would do that automatically for me.


Thank you!
Louis
Top achievements
Rank 1
 answered on 14 Jan 2014
1 answer
101 views
I am using this example http://www.kendoui.com/code-library/mvc/grid/using-multiselect-in-grid.aspx to put a multiselect in grid, which works great because the TeritoryEditor's data is set from ViewData and all works well, however I would like each multiselect's data source to be set when the parent is expanded, in other words the datasource should be loaded just like the children in the sub grid, I am not exactly sure where /how i should set the multiselect data source on based on parent
Daniel
Telerik team
 answered on 14 Jan 2014
1 answer
150 views

Using "contains" filter gives me all rows that do not have the specified value.  How can I filter grid rows that do not contain a certain value, so that I only get rows that do have the value?  I tried "doesnotcontain" which doesn't work.

if (val) {
                grid.dataSource.filter({
                    logic: "or",
                    filters: [
                    { field: "someField", operator: "contains", value: val },
                   { field: "someField2", operator: "contains", value: val },
...
Alexander Popov
Telerik team
 answered on 14 Jan 2014
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?