Telerik Forums
UI for ASP.NET MVC Forum
1 answer
112 views
I've read through the API and was wondering if there is a way to only allow dates to be selected from the calendar OR a real date typed in.  Currently someone could type in "Bill" or "I want to type an alphanumeric sentence"...  I'd like to prevent someone from even entering anything except for a valid date.

I am currently validating this value after the fact and then alerting the user they have entered an invalid date, but just want to be able to cut out that step (or at least part of it) if possible.

Thanks
Jason
Georgi Krustev
Telerik team
 answered on 11 Dec 2013
5 answers
301 views
This means my model is not binding and the operations are not working.

The read method works just fine, but that is it....  For Example, my Destroy Method:

CONTROLLER:
     public ActionResult Memo_Delete(MemoModel memo)
        {
            using (var context = new eEntities.eWJB())
            {
                Note _note = context.Notes.First(i => i.nMemoID == memo.memoID);
                context.Notes.Remove(_note);
                context.SaveChanges();
            }
            return Json(new[] { memo }.ToDataSourceResult(request, ModelState));
        }

The JS Below sends the following malformed JSON to the Controller:  It looks like Query Parameters / Not JSON:  

Any Suggestions?  I have tried the parameter mapping with no luck.

clientID=8&memoID=2&memoTime=Sat+May+08+2004+13%3A05%3A00+GMT-0700+(Pacific+Daylight+Time)&subject=General+Notes&memo=%24200+Appraisal+%230403053&initials=MM&code=4&eyesOnly=false&sticky=false

JS for the GRID:

    jQuery("#grid2").kendoGrid(
         {
             columns: [
               { "title": "Pin", "width": "30px", "field": "sticky", "filterable": {}, "encoded": true, "editor": null },
               { "title": "Private", "width": "30px", "field": "eyesOnly", "filterable": {}, "encoded": true, "editor": null },
               { "title": "Date", "width": "90px", "field": "memoTime", "format": "{0:dd/MM/yyyy}", "filterable": {}, "encoded": true, "editor": null },
               { "title": "Subject", "width": "125px", "field": "subject", "filterable": {}, "encoded": true, "editor": null },
               { "title": "Note", "width": "250px", "encoded": false, "field": "memo", "filterable": {}, "editor": null },
               { "title": "Initials", "width": "30px", "field": "initials", "filterable": {}, "encoded": true, "editor": null },
               {
                   "width": "172px", "command": [
                     { "name": "edit", "buttonType": "ImageAndText", "text": "Edit" }, { "name": "destroy", "buttonType": "ImageAndText", "text": "Delete" }]
               }],
             pageable: { "refresh": true, "pageSizes": [5, 10, 20], "buttonCount": 5 },
             sortable: true,
             selectable: "Single, Row",
             resizable: true,
             scrollable: false,
             editable: { "confirmation": "Are you sure you want to delete this record?", "mode": "popup", "template": "\u003cdiv class=\"editor-label\"\u003e\u003clabel for=\"clientID\"\u003eclientID\u003c/label\u003e\u003c/div\u003e\u003cdiv class=\"editor-field\"\u003e\u003cinput class=\"text-box single-line\" data-val=\"true\" data-val-number=\"The field clientID must be a number.\" data-val-required=\"The clientID field is required.\" id=\"clientID\" name=\"clientID\" type=\"number\" value=\"0\" /\u003e \u003cspan class=\"field-validation-valid\" data-valmsg-for=\"clientID\" data-valmsg-replace=\"true\"\u003e\u003c/span\u003e\u003c/div\u003e\u003cdiv class=\"editor-label\"\u003e\u003clabel for=\"memoID\"\u003ememoID\u003c/label\u003e\u003c/div\u003e\u003cdiv class=\"editor-field\"\u003e\u003cinput class=\"text-box single-line\" data-val=\"true\" data-val-number=\"The field memoID must be a number.\" data-val-required=\"The memoID field is required.\" id=\"memoID\" name=\"memoID\" type=\"number\" value=\"0\" /\u003e \u003cspan class=\"field-validation-valid\" data-valmsg-for=\"memoID\" data-valmsg-replace=\"true\"\u003e\u003c/span\u003e\u003c/div\u003e\u003cdiv class=\"editor-label\"\u003e\u003clabel for=\"memoTime\"\u003ememoTime\u003c/label\u003e\u003c/div\u003e\u003cdiv class=\"editor-field\"\u003e\u003cinput data-val=\"true\" data-val-date=\"The field memoTime must be a date.\" id=\"memoTime\" name=\"memoTime\" type=\"datetime\" /\u003e\u003cscript\u003e\tjQuery(function(){jQuery(\"\\\\\\#memoTime\").kendoDateTimePicker({\"format\":\"M/d/yyyy h:mm tt\",\"min\":new Date(1900,0,1,0,0,0,0),\"max\":new Date(2099,11,31,0,0,0,0),\"interval\":30});});\u003c\\/script\u003e \u003cspan class=\"field-validation-valid\" data-valmsg-for=\"memoTime\" data-valmsg-replace=\"true\"\u003e\u003c/span\u003e\u003c/div\u003e\u003cdiv class=\"editor-label\"\u003e\u003clabel for=\"subject\"\u003esubject\u003c/label\u003e\u003c/div\u003e\u003cdiv class=\"editor-field\"\u003e\u003cinput class=\"k-textbox\" data-val=\"true\" data-val-required=\"The subject field is required.\" id=\"subject\" name=\"subject\" placeholder=\"\" type=\"text\" value=\"\" /\u003e \u003cspan class=\"field-validation-valid\" data-valmsg-for=\"subject\" data-valmsg-replace=\"true\"\u003e\u003c/span\u003e\u003c/div\u003e\u003cdiv class=\"editor-label\"\u003e\u003clabel for=\"memo\"\u003ememo\u003c/label\u003e\u003c/div\u003e\u003cdiv class=\"editor-field\"\u003e\u003cinput class=\"k-textbox\" data-val=\"true\" data-val-required=\"The memo field is required.\" id=\"memo\" name=\"memo\" placeholder=\"\" type=\"text\" value=\"\" /\u003e \u003cspan class=\"field-validation-valid\" data-valmsg-for=\"memo\" data-valmsg-replace=\"true\"\u003e\u003c/span\u003e\u003c/div\u003e\u003cdiv class=\"editor-label\"\u003e\u003clabel for=\"initials\"\u003einitials\u003c/label\u003e\u003c/div\u003e\u003cdiv class=\"editor-field\"\u003e\u003cinput class=\"k-textbox\" id=\"initials\" name=\"initials\" placeholder=\"\" type=\"text\" value=\"\" /\u003e \u003cspan class=\"field-validation-valid\" data-valmsg-for=\"initials\" data-valmsg-replace=\"true\"\u003e\u003c/span\u003e\u003c/div\u003e\u003cdiv class=\"editor-label\"\u003e\u003clabel for=\"code\"\u003ecode\u003c/label\u003e\u003c/div\u003e\u003cdiv class=\"editor-field\"\u003e\u003cinput class=\"k-textbox\" data-val=\"true\" data-val-number=\"The field code must be a number.\" id=\"code\" name=\"code\" placeholder=\"\" type=\"text\" value=\"\" /\u003e \u003cspan class=\"field-validation-valid\" data-valmsg-for=\"code\" data-valmsg-replace=\"true\"\u003e\u003c/span\u003e\u003c/div\u003e\u003cdiv class=\"editor-label\"\u003e\u003clabel for=\"eyesOnly\"\u003eeyesOnly\u003c/label\u003e\u003c/div\u003e\u003cdiv class=\"editor-field\"\u003e\u003cinput class=\"k-textbox\" id=\"eyesOnly\" name=\"eyesOnly\" placeholder=\"\" type=\"text\" value=\"\" /\u003e \u003cspan class=\"field-validation-valid\" data-valmsg-for=\"eyesOnly\" data-valmsg-replace=\"true\"\u003e\u003c/span\u003e\u003c/div\u003e\u003cdiv class=\"editor-label\"\u003e\u003clabel for=\"sticky\"\u003esticky\u003c/label\u003e\u003c/div\u003e\u003cdiv class=\"editor-field\"\u003e\u003cselect class=\"list-box tri-state\" id=\"sticky\" name=\"sticky\"\u003e\u003coption selected=\"selected\" value=\"\"\u003eNot Set\u003c/option\u003e\u003coption value=\"true\"\u003eTrue\u003c/option\u003e\u003coption value=\"false\"\u003eFalse\u003c/option\u003e\u003c/select\u003e \u003cspan class=\"field-validation-valid\" data-valmsg-for=\"sticky\" data-valmsg-replace=\"true\"\u003e\u003c/span\u003e\u003c/div\u003e", "window": { "title": "Edit", "modal": true, "draggable": true, "resizable": false }, "create": true, "update": true, "destroy": true }, "toolbar": { "command": [{ "name": null, "buttonType": "ImageAndText", "text": "Add new record" }] },
             dataSource: {
                 transport: {
                     prefix: "",
                     read: { url: "/Memo/Memos_Read"},
                     update: { url: "/Memo/Memo_Update", dataType: "json", contentType: "application/json", type: "POST" },
                     create: { url: "/Memo/Memo_Add", dataType: "json", contentType: "application/json", type: "POST" },
                     destroy: { url: "/Memo/Memo_Delete", dataType: "json", contentType: "application/json", type: "POST" }
                 },
                 parameterMap: function (options, operation) {
                     if (operation !== "read" && options.models) {
                         return {models: kendo.stringify(options.models)};
                     }
                     return options; // <-- added this line

                 
             },
                 pageSize: 10, "page": 1, "total": 0, "type": "aspnetmvc-ajax", "error": error_handler,
                 schema: {
                     data: "Data", "total": "Total", "errors": "Errors",
                     model: {
                         "id": "memoID", "fields":
                             {
                                 "clientID": { "type": "number" },
                                 "memoID": { "type": "number" },
                                 "memoTime": { "type": "date", "defaultValue": null },
                                 "subject": { "type": "string" },
                                 "memo": { "type": "string" },
                                 "initials": { "type": "string" },
                                 "code": { "type": "number", "defaultValue": null },
                                 "eyesOnly": { "type": "boolean", "defaultValue": null },
                                 "sticky": { "type": "boolean", "defaultValue": null }
                             }
                     }
                 }
             }
         });
   });
Rosen
Telerik team
 answered on 11 Dec 2013
1 answer
89 views
How could I get the selected data of a kendo grid and send them to controller for being read? How could I get it with the corresponding ViewModel?
Daniel
Telerik team
 answered on 10 Dec 2013
1 answer
60 views
I have several filter options in a kendo grid and I need to get data from the controller after being filtered. How could I do that?
Vladimir Iliev
Telerik team
 answered on 10 Dec 2013
1 answer
113 views
I’m trying to set a common value in the “Message” parameter of the “IsEqualTo” property in a kendo grid. My project is Multilanguage, so, when I select a language different than “English”, the shown message is different than “Es igual a”. What should I do to fix that? This is the piece of code:

        .Filterable(filterable => filterable

        .Extra(false)

         .Operators(operators => operators

            .ForString(str => str.Clear()              

               .IsEqualTo("Es igual a")

            ))
Dimiter Madjarov
Telerik team
 answered on 10 Dec 2013
1 answer
202 views
Hello,

We have problems with the Multiselect: the initial values ​​don’t bind the control on loading of the component.
RoutesSelected a list of type "DepotViewModel" defined in the datasource.
RouteGuids is a list of Guid type.

 @(Html.Kendo().MultiSelect()                            
.Name("RouteGuids")                             
.DataTextField("Code")                             
.DataValueField("Id")                             
.Placeholder("Select route...")
.AutoBind(true)                            
.Filter("startswith")
.MaxSelectedItems(8)
.Value(Model.RoutesSelected)
.DataSource(source => source.Read(read => read.Action("GetDepots", "Request")).ServerFiltering(false)               
)      
)

Any idea?

Thanks,
Mathieu
Petur Subev
Telerik team
 answered on 10 Dec 2013
1 answer
2.3K+ views
So I have figured out how to give a grid a default sort order and it works good...  I would like to also be able to give it a secondary sort order...  first sort is "Bill Date" and then within rows that have the same bill date, they would be sort by "CoordinationOfBenefit".

Also of note, I have enabled multisort in the .Sortable

Thanks,
Jason



@(Html.Kendo().Grid<AccountClaim>()
                        .Scrollable(s => s.Height("auto"))
                        .Name("AccountClaimsGrid")
                        .HtmlAttributes(new { @class = "cursorLink", style= "height: 200px;" })
                        .DataSource(ds => ds.Ajax()
                            .Sort(sort => sort.Add("BillDate").Descending())
                            .Read("AccountClaimsData", "Workdriver", new { ProductName = ViewBag.SelectedProduct.ProductName, AccountId = Model.Account.AccountId })
                            //.PageSize(5)
                            .Events(e => e.Change("ClaimDataSourceChanged")))
                        .Columns(c =>
                        {
                            c.Bound(f => f.AccountClaimId).Visible(false);
                            c.Bound(f => f.ClaimNumber).Title("Claim Number").Width(125);
                            c.Bound(f => f.InsuranceCode).Title("Ins Code").Width(75);
                            c.Bound(f => f.CoordinationOfBenefit).Title("COB").Width(55);
                            c.Bound(f => f.ServiceDate).Title("Service").Format("{0:d}").Width(85);
                            c.Bound(f => f.BillDate).Title("Bill").Format("{0:d}").Width(85);
                            c.Bound(f => f.ClaimStatusRollupName).Title("Status").Width(100);
                            c.Bound(f => f.ClaimAmount).Title("Claim Amount").ClientTemplate("<span style='float: right;'>#=kendo.toString(ClaimAmount,'c')#</span>").Width(115);
                            c.Bound(f => f.PaidAmount).Title("Paid Amount").ClientTemplate("<span style='float: right;'>#=kendo.toString(PaidAmount,'c')#</span>").Width(110);
                            c.Bound(f => f.AdjustmentAmount).Title("Adjustment Amount").ClientTemplate("<span style='float: right;'>#=kendo.toString(AdjustmentAmount,'c')#</span>").Width(135);
                            c.Bound(f => f.PaidAmount).Title("Patient Amount").ClientTemplate("<span style='float: right;'>#=kendo.toString(PaidAmount,'c')#</span>").Width(125);
                        })
                        .Selectable(s => s.Mode(GridSelectionMode.Single))
                        .Sortable(s => s.SortMode(GridSortMode.MultipleColumn))
                        .Groupable(g =>
                        {
                            g.Messages(m =>
                            {
                                m.Empty("Drag Column Header Here to Group");
                            }
                            );
                        }
                            )
                        .Filterable()
                        .ColumnMenu()
                        .Events(e => e.Change("ClaimSelectionChanged"))
                    )
Alexander Popov
Telerik team
 answered on 09 Dec 2013
1 answer
114 views
When I try to add some table/tr/td tags, it is displaying some lines at the end of td tags.  Attaching a sample image of how it is appearing wtihin the Kendo Grid.

Sample Code :


<script id="DetailInfo" type="text/html">
<table class="DetailReport" cellspacing="10" >
<tbody>
<tr>
<td>Audit Key:</td>
<td><input Type="TextBox" width="10" class="data" ID="auditkey" readonly value="Test"/> </td>
<td><Label ID="label5">LPI Refund ID:</Label> </td>
<td><input Type="TextBox" class="data" ID="RID" readonly value="asdf"/> </td>
<td><Label ID="label12" class="label">Report Date:</Label></td>
<td><input type="TextBox" ID="ReportDate" class="data" readonly/></td>
<td><Label ID="label13" class="label">Rfund Amt:</Label> </td>
<td><input type="TextBox" ID="refundedamount" class="data" readonly /></td>

</tr>

</tbody>
</table>
</script>
THanks
Siva

Dimo
Telerik team
 answered on 09 Dec 2013
6 answers
464 views
What I'm trying to do is I have 2 ComboBoxes that are setup in a Cascading relationship.  What I am not able to get working is that when 1 option is selected in the first ComboBox the cascaded ComboBox should ONLY allow choices from the Items list it is populated with.  When a 2nd option is selected in the first ComboBox(i.e. Other) the cascaded ComboBox should allow ANY text to be entered.

How can I achieve this?  Below is my View and Controller in question. 

VIEW:
<div class="form-group">
            @Html.LabelFor(model => model.locationCode, new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @(Html.Kendo().ComboBox()
                        .Name("locationCode")
                        .Filter(FilterType.Contains)
                        .DataTextField("Text")
                        .DataValueField("Value")
                        .BindTo(Model.Locations)
                        .Suggest(true)
                )
                @Html.ValidationMessageFor(model => model.locationCode)
            </div>
        </div>
 
        <div class="form-group">
            @Html.LabelFor(model => model.loadType, new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @(Html.Kendo().ComboBox()
                        .Name("loadType")
                        .Filter(FilterType.Contains)
                        .DataTextField("Text")
                        .DataValueField("Value")
                        .BindTo(Model.LoadTypes)
                        .Suggest(true)
                )
                @Html.ValidationMessageFor(model => model.loadType)
            </div>
        </div>
 
        <div class="form-group">
            @Html.LabelFor(model => model.loadDescrip, new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @(Html.Kendo().ComboBox()
                        .Name("loadDescription")
                        .Filter(FilterType.Contains)
                        .DataTextField("DocCode")
                        .DataValueField("DocCode")
                        .DataSource(source =>
                        {
                            source.Read(read =>
                            {
                                read.Action("GetCascadeDocumentNumbers", "DockDoor")
                                    .Data("filterLoadDescription");
                            })
                          .ServerFiltering(true);
                        })
                        .Enable(false)
                        .AutoBind(false)
                        .CascadeFrom("loadType")
                )
                <script>
                    function filterLoadDescription() {
                        return {
                            locCode: $("#locationCode").val(),
                            loadType: $("#loadType").val(),
                            docNumFilter: $("#loadDescription").data("kendoComboBox").input.val()
                        };
                    }
                </script>
                @Html.ValidationMessageFor(model => model.loadDescrip)
            </div>
        </div>
CONTROLLER:
public JsonResult GetCascadeDocumentNumbers(string locCode, string loadType, string docNumFilter)
{
    if (loadType != "OPEN" && loadType != "GENERIC")
    {
        var docNums = db.GetCurrentDocumentNumbers(locCode, loadType).AsEnumerable();
 
        if (!string.IsNullOrWhiteSpace(docNumFilter))
        {
            docNums = docNums.Where(x => x.Contains(docNumFilter));
        }
 
        return Json(docNums.Select(x => new { DocCode = x.ToString() }), JsonRequestBehavior.AllowGet);
    }
    return Json(string.Empty, JsonRequestBehavior.AllowGet);
}


Georgi Krustev
Telerik team
 answered on 09 Dec 2013
1 answer
236 views
I see the documentation using Kendo UI web, etc...   I want to use the wrappers for this instead of coding the jscript.

Any resources?
Alexander Popov
Telerik team
 answered on 09 Dec 2013
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
Template
Barcode
ButtonGroup (Mobile)
Drawer (Mobile)
ImageEditor
RadioGroup
Sparkline
Stepper
TabStrip (Mobile)
GridLayout
Badge
LinearGauge
ModalView
ResponsivePanel
TextArea
Breadcrumb
ExpansionPanel
Licensing
Rating
ScrollView
ButtonGroup
CheckBoxGroup
NavBar
ProgressBar
QRCode
RadioButton
Scroller
Timeline
TreeMap
TaskBoard
OrgChart
Captcha
ActionSheet
Signature
DateTimePicker
AppBar
BottomNavigation
Card
FloatingActionButton
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
Top achievements
Rank 1
Iron
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
ivory
Top achievements
Rank 1
Iron
Nurik
Top achievements
Rank 2
Iron
Iron
YF
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Top achievements
Rank 1
Iron
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
ivory
Top achievements
Rank 1
Iron
Nurik
Top achievements
Rank 2
Iron
Iron
YF
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?