Questions on UI for ASP.NET MVC Forum

3 answers

141 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

205 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

795 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

1 answer

1.6K+ views

Add class to edit line

Hi,

I want to add a specific class to the inputs in Inline editing .

How can I do it?

thanks

Grid

answered on 02 Feb 2018

3 answers

928 views

[Solved] Dynamic Tables

Hi,

at the moment I am converting the old Telerik MVC tool to Kendo MVC for one of our portals.

now I have an issue with a dynamic table, not always all fields are the same and I can't get it to work correctly.

my grid looks like this

@(Html.Kendo().Grid(Model.DefaultView)

.Name("Grid")

.DataSource(dataSource => dataSource

.Ajax()

.Read(read => read.Action("LoadData", "AutorisatieMatrix"))

.Update(read => read.Action("_SaveBatchEditing", "AutorisatieMatrix"))

.Model(model => model.Id("ProgramFunction"))

)

.Sortable()

.Editable(editing => editing.Mode(GridEditMode.InCell))

.ToolBar(commands =>

{

commands.Save();

})

.Columns(columns =>

{

columns.Bound("Id").Visible(false);

foreach (System.Data.DataColumn dcol in Model.Columns)

{

if (dcol.ColumnName != "Id")

{

if (dcol.ColumnName == "ProgramFunction")

columns.Bound("ProgramFunction")

.EditorTemplateName("_ReadOnlyValue")

.ClientTemplate("#=ProgramFunction#")

.Title("Programmafunctie");

else

{

columns.Bound(dcol.ColumnName)

.EditorTemplateName("_PermissionEditor")

.ClientTemplate(boo(this, "#=" + dcol.ColumnName + "#").ToHtmlString())

.Title(dcol.Caption)

;

}

})

where I go through all colums specified in the model.
and the header gets created as it should.

In the controller in the Index I create an empby DataTable so the Model knows which colums to use.

public ActionResult Index()

{

var tbl = CreateNewDataTable();

var model = tbl;

return View(tbl);

}

which seems to work fine.

Then In the loadData DataRequest I generate this same DataTable fill it, add a dynamic wrapper to include "Data" in the json
Convert is to Json and return the Content.

Grid

answered on 02 Feb 2018

9 answers

291 views

Navigation With Arrow Buttons

Is it possible to alter the behaviour of the spreadsheet with some javascript that would allow a user to type a value into a cell and then press the down arrow to set the value and move to the next cell? Simply registering the event and changing which cell is selected doesn't work because the value in the cell doesn't actually get set and I've tried simulating an enter key press but that didn't work because of compatibility issues.

Spreadsheet

answered on 02 Feb 2018

1 answer

1.4K+ views

Passing Multiple Parameters with a Detail Action Button (AJAX)

Hello,

I would like to use the ASP.NET MVC Kendo UI Grid to render a list of records that have a "Detail" button for each record (similar to this look: https://demos.telerik.com/aspnet-mvc/grid/custom-command).

I am currently using an AJAX-bound grid. I need to pass two values to the "Details" controller. Here is what I have so far:

.Columns( c=>

{

c.Bound(c => personId);

c.Bound(c => positionId);

// Want to use a "Details" button to pass personId and positionId to HomeController/Details/{personId}/{positionId}

c.Command( c => cmd.Custom("Details"))

})

.DataSource(d => d

.Ajax()

.Read(r => r.Action("GetPersons", "Home"))

)

However, the business logic in our application requires two values passed to the "Details" controller (see below).

1.

[HttpGet]

public ActionResult Details(int personId, int positionId)

2.{

3. Person person = Person.GetPerson(personId, positionId, myConnection);

4. return View(person);

5.}

Grid

answered on 01 Feb 2018

1 answer

374 views

[Solved] Grid setOptions sortable = false clear header template UNEXPECTEDLY

HI

I met a problem about Grid Sortable :

Grid setOptions sortable = false clear header template UNEXPECTEDLY.

What's going on ?? Why header template lost ?
How to avoid this situation or
how to disable sortable temporary and header template will not be cleared.

Sample Code :

View
columns.Bound(c => c.Column1)
.HeaderTemplate
(
@<text>

<input type='number' class='k-textbox' onfocus="class1.focusAllDays({ element: this })" style='width: 50px; font-size: small;' />

</text>
)
.Width(280);

Javascript

class1 :

focusAllDays: function(e)
{
var grid = get your grid;
//
grid.setOptions({ sortable: false });
},

Best regards

Chris

Grid

answered on 01 Feb 2018

1 answer

108 views

Multi day routes are not getting displayed on day and week view in bussiness hour

I have reproduced the issue on the demo you have provided in following link:
https://demos.telerik.com/kendo-ui/scheduler/index

1. goto https://demos.telerik.com/kendo-ui/scheduler/index
2. there is a resource "Call Charlie about the project"
3. set its start date as 6/11/2013 1:30 AM and set its end date as 6/12/2013 4:00 PM
4. Then this Resource will not be displayed on the scheduler. So in such cases how we can show resource for the multiple days without using "alldayevent" tab/option.
how can i view such resources which have part of view in business hours?

Scheduler

answered on 01 Feb 2018

7 answers

269 views

Upgrade Wizard (2018-R1)

With the recent release of 2018, I began the rework of several projects to also update them to the latest suite. I can report that this with this release I was actually able to perform a MVC Upgrade wizard without failures. That is a first for me.

My update strategy was as follows: First I ran the Report upgrade process. After it completes it reloaded the project and the Telerik product realized I still had a un-upgraded MVC project to upgrade. (That was a welcome change) Upon clicking the upgrade wizard it actually went off and upgraded things.

Upon completion of the process I was able to perform a clean/rebuild solution with zero errors. Using my normal testing process quickly confirmed everything met expectations. That was a very welcome change.

My only complaint is that the upgrade process, of the MVC, is very invisible to the developer. By this I mean the user has no visual indication that anything is happening except for the occasional busy cursor. The status bar occasionally has a message but it seems to be very sporadic. If you somehow improved this portion of your upgrade process things would be "perfect" in my mind.

NOTE: I did discover that you could monitor the contents of the recycle bin to see the progress of the upgrade process. The upgrade process delete files, which end up in the recycle bin, so as long as the number of files is growing you know something is working.

Special Note: Like most developers I also have one of those projects which are "from hell". It is a hybrid project that combines ASPX, MVC, and the HTML5 reporting tools. Collectively this project has never been upgrade capable via the wizards. They literally crashed each time I tried them. Given the hybrid nature, I always accepted is as something I caused myself by building the "beast". I can report that with this release (2018-1) the upgrade process actually worked. I ran the report upgrade wizard first. I then ran the MVC Upgrade process. I then ran the ASPX upgrade wizard. All three worked without error. None crashed. (A very welcome change) The end result compiled with errors as the ASPX process removed the MVC references as unnecessary. Upon re-adding that reference to the solution, everything compiled and tested with 100% accuracy. All tests ran without error. I was thrilled that this un-supported process actually worked!

General Discussions

answered on 01 Feb 2018