Questions on UI for ASP.NET MVC Forum

1 answer

163 views

When calling ToDatasourceResults it wraps both sides of the filter criteria in LOWER() so that it can do case insensitive queries. We are using it on a DB2 iSeries database and would like to be able to add indexes to improve the performance of the queries.

1. the DB is case sensitive and cannot be changed

2. we can put an upper case index (which would get used) but not a lower case one

I'm looking for some method of changing the LOWER() to UPPER() when using ToDatasourceResults preferably without having to write my own version of it. Is there anywhere in the code that I can override to modify this behaviour?

General Discussions

answered on 12 Feb 2018

7 answers

1.5K+ views

Setting cell as edited (red marker)

I am updating a grid cell with a date value on a button click from a custom command in the row (see code below). I am able to successfully add the value to the cell but I would like to have the cell show the red triangle in the upper left corner (see attached pic) that shows the user the value in the cell has been edited.

function activate_deactivate(e) {

e.preventDefault();

var tr = $(e.target).closest("tr"); //get the row

var dataItem = this.dataItem($(e.currentTarget).closest("tr"));

var data = this.dataItem(tr); //get the row data so it can be referred later

var ad = dataItem.ActivatedOn;

if (isDateActive(dataItem.ActivatedOn, dataItem.DeactivatedOn) || !dataItem.DeactivatedOn)

{

//set the deactivated date

var strTodaysDate = getShortDate();

data.set("DeactivatedOn", strTodaysDate);

}

else

{

//clear the deactivated date (Now Active)

data.set("DeactivatedOn", null);

}

Grid

answered on 09 Feb 2018

10 answers

1.4K+ views

send selected values to controller

Hi Kendo community,

I don't really understand how the selected objects out of a multiselect can be sent to the controller. The databinding out of the db works fine and I'm also able to select and remove items in the multiselect. By the way the multiselect is displayed inside a kendo window and posts with an ajax.beginform.

My multiselect looks like this:

@model SoftwareAdminInterface.Models.Administration.Pattern

@

using (Ajax.BeginForm("SetCombi", "Pattern", new { }, new AjaxOptions() { HttpMethod = "post", UpdateTargetId = "myContentPopupEditRole_div" }))

@(Html.Kendo().MultiSelect()

.MaxSelectedItems(2)

.Name("RegExID")

.DataTextField("RegExName")

.DataValueField("RegExID")

.Placeholder("Select Patterns...")

.AutoBind(false)

.DataSource(source => {

source.Read(read =>

{

read.Action("GetPatternsForCombi", "Pattern");

})

.ServerFiltering(true);

})

)

What I want to do now is to pass the two selected RegExID's over to the controller. Controller action looks like this:

[AcceptVerbs(HttpVerbs.Post)]

public ActionResult SetCombi([DataSourceRequest] DataSourceRequest request, List<Pattern> selectedPatterns)

{

SoftwareHelper helper = new SoftwareHelper();

return PartialView("Combination");

}

basically I thought of getting the IDs from the List<Pattern>, but the list is null.
any advise?

thx in advance
kind regards

MultiSelect

answered on 08 Feb 2018

4 answers

343 views

MVC Grid PopEdit Multiple calls to Insert Action on Update Button click

I have a grid with a create tool bar.

.ToolBar(toolbar => toolbar.Create().Text("Add new Inspection"))

My grid is set to editable with a template.

.Editable(editable => editable.Mode(GridEditMode.PopUp).Window(w => w.Width(600)).TemplateName("Inspection"))

My data source is pretty standard.

.DataSource(dataSource => dataSource

.Ajax()

.Model(model => model.Id(Inspection => Inspection.DEPInspectionsID))

.Read(read => read.Action("InspectionItems_Read", "Inspections"))

.Create(create => create.Action("InspectionItem_Create", "Inspections"))

.Update(update => update.Action("InspectionItem_Update", "Inspections"))

.Destroy(destroy => destroy.Action("Inspections_Destroy", "Inspections"))

)

When I click on the standard Update button on the pop up it calls the InspectionItem_Create action once for the new record, but then it also calls it again for each of the other records on the list as well...

Why would a single click of the update button trigger the function for not only for the item created using the model... but for all of the additional items in the list?

Grid

answered on 08 Feb 2018

3 answers

568 views

grids validation

Hi,

I have 3 grids each one in another tab (another view).

for each one of them I have different Kendo extend validation for example:

function ($, kendo) {
$.extend(true, kendo.ui.validator, {
rules: { // custom rules
dateValidation: function (input, params) {
debugger;
if (input.is("[name='ActualStartDate']") && input.val() != "") {
var startDate = kendo.parseDate(input.val());
var endDate = kendo.parseDate($('#ActualEndDate').val());
if (startDate != null && endDate != null) {
input.attr("data-dateValidation-msg", "Start date should be before End date");
return startDate.getTime() <= endDate.getTime();
}
} else if (input.is("[name='ActualEndDate']") && input.val() != "") {
var endDate = kendo.parseDate(input.val());
var startDate = kendo.parseDate($('#ActualStartDate').val());
if (startDate != null && endDate != null) {
input.attr("data-dateValidation-msg", "End date should be after Start date ");
return startDate.getTime() <= endDate.getTime();

}
}
if (input.is("[name='Description']") && input.val() != "") {
debugger
input.attr("data-dateValidation-msg", "A Description Cannot Be Longer Than 250 Characters");
return (input.val().length <= 250)

}

return true;
}
},
messages: { //custom rules messages
dateValidation: function (input) {
// return the message text
return input.attr("data-val-dateValidation");
}
}
});
})(jQuery, kendo);

because of cache , sometimes the the wrong validator is called and then the validation went wrong.

How can I force that the right validator will be called? is there some unique name for each one?

Thank you

Grid

answered on 07 Feb 2018

1 answer

141 views

Tornado chart is not available in the Kendo Charts library

Currently a tornado chart is not available in the Kendo Charts library. Is there a way to create tornado charts with telerik html charts?

Example is attached below for your reference.

Chart

answered on 07 Feb 2018

1 answer

189 views

Examples integrating Kendo React componenets with MVC DataSourceRequest

Under the React Data Query library, there are examples of doing the filtering/sorting in memory with local data: https://www.telerik.com/kendo-react-ui/components/dataquery/

And there's a page about Integration with UI for ASP.NET Core that shows the standard backend configuration for a DataqSourceRequest/ToDataSourceResult MVC configuration: https://www.telerik.com/kendo-react-ui/components/dataquery/mvc-integration/

But there's no information about how you configure a Kendo React component, for example a grid, to use the MVC Operations. Is there an example anywhere I have missed?

General Discussions

answered on 07 Feb 2018

3 answers

106 views

Model Defaults on Grouped Columns

I have a gird with a toolbar template where I have a pair of cascading drop down lists and an add new button.

The 1st one is Category and the 2nd is Sub Category which Cascades from Category...

01..ToolBar(toolbar => { toolbar.Template(

02. @<text>

03. @(Html.Kendo().DropDownList()

04. .Name("ddlCategory")

05. .DataTextField("Text")

06. .DataValueField("Value")

07. .OptionLabel("Select a Category...")

08. .HtmlAttributes(new { style = "width: 250px;" })

09. .DataSource(source => {

10. source.Read(read => { read.Action("Categories_Read", "Categories"); });

11. })

12. )

13. @(Html.Kendo().DropDownList()

14. .Name("ddlSubCategory")

15. .DataTextField("Text")

16. .DataValueField("Value")

17. .OptionLabel("Select a Sub Category...")

18. .HtmlAttributes(new { style = "width: 250px;" })

19. .DataSource(source => {

20.

source.Read(read => { read.Action("SubCategories_Read", "Categories").Data("filterSubCategories"); }).ServerFiltering(true);

21. })

22. .AutoBind(false).Enable(false).CascadeFrom("ddlCategory")

23. )

24. <a class="k-button k-button-icontext k-grid-add" href="#"><span class="k-icon k-i-add"></span>Add New Contract Item</a>

25. </text>); })

I've set up the datasource model as follows:

1..Model(model =>

2.{

3. model.Id(p => p.ContractItemID);

4. model.Field(p => p.Category).DefaultValue("Category");

5. model.Field(p => p.SubCategory).DefaultValue("Sub Category");

6.})

I'm also grouping on Category and SubCategory and I have created a function for the edit event:

1..Group(groups => { groups.Add(p => p.Category); groups.Add(p => p.SubCategory); } )

2..PageSize(20))

3..Events(e => e.Edit("getCategoryVals"))

The two issues I'm running into is this:

First, I've followed documentation and demos from multiple locations, and I cannot grab the text from the drop down... I'm using the following code... but on line 06 the script fails with an error that .text is not defined.

01.function getCategoryVals(e) {

02.

03. var ddlCategory = $('#ddlCategory');

04. var ddlSubCategory = $('#ddlSubCategory');

05.

06. var tsCategory = ddlCategory.data('kendoComboBox').text();

07. var tsSubCategory = ddlSubCategory.data('kendoComboBox').text();

08.

09. e.model.set("Category", tsCategory);

10. e.model.set("SubCategory", tsSubCategory);

11.}

And Second... If I hard code tsCategory and tsSubCategory, it updates the model and the fields in the new row reflect the new values, BUT the grouping label still shows Category and Sub Category instead of the actual value... I want these fields to be hidden....

Do I have to manually update the grouping labels using jquery or is there a better way to do this?

Grid

answered on 07 Feb 2018

1 answer

166 views

Export To PDF With table of contents

Does the PDF exporter have built in functionality to build a TOC? One way I thought about doing this was using hash anchors. Is that supported?

Thanks!

General Discussions

answered on 06 Feb 2018

2 answers

715 views

ASP.NET MVC Kendo UI Theme Builder - Customize theme for Grid and other controls

HI

I have a question about Theme Builder.

I have a new project and customer want to customize the theme for ALL Telerik Controls (Button, Grid, etc).
I have try the Sass Theme Builder but this theme builder unable to customize Grid's appearance :

Sass Theme Builder
https://docs.telerik.com/kendo-ui/styles-and-layout/sass-themes#sass-theme-builder

And I have found and try the Kendo UI ThemeBuilder, but the error occurred (opened by Google Chrome) :

Kendo UI ThemeBuilder
https://demos.telerik.com/kendo-ui/themebuilder/

--

How could I customize the theme for ALL Telerik Controls (Grid, etc.) ?

And how could I generate following theme files
(kendo.xxxxx.min.css, kendo.dataviz.xxxxx.min.css, kendo.xxxxx.mobile.min.css) :

Blue Opal theme files :

Content/kendo/2017.2.621/kendo.blueopal.min.css
Content/kendo/2017.2.621/kendo.dataviz.blueopal.min.css
Content/kendo/2017.2.621/kendo.blueopal.mobile.min.css

*blueopal - Maybe new theme name.
*2017.2.621 - kendo ui version only.
*Google Chrome version: 63.0.x.x 32bits

Best regards

Chris

General Discussions

answered on 05 Feb 2018