Questions on UI for ASP.NET MVC Forum

4 answers

1.4K+ views

Hi,

I would like to set the widths of my columns and display a horizontal scrollbar since width exceeds container. When I try my code the columns get compressed with no horizontal scrollbar. If I resize a column, the scrollbar does appear. Is there a way to honor the fixed widths and have a horizontal scrollbar appear below instead of shrinking the widths?

@(Html.Kendo()
.Grid(Model.MyData)
.Name("myData")
.Columns(column =>
{
column.Bound(s => s.Col1).Width(60);
column.Bound(s => s.Col2).Width(80).Title("Col2");
column.Bound(s => s.Col3).Width(30).ClientTemplate("<span>#= Col3 != null ? Col3 : '' #</span>");
... several others
column.Bound(s => s.ColX).Width(100).ClientTemplate("<span>#= ColX != null ? ColX : '' #</span>");
})
.ColumnMenu()
.Scrollable(s => s.Enabled(true).Height("auto"))
.Pageable(builder => builder.PageSizes(new List<object> { 20, 50, "all" }))
.Filterable()
.Sortable()
.Groupable()
.Resizable(resize => resize.Columns(true))
.DataSource(datasource => datasource
.Ajax()
.PageSize(20)
.Read(read => read.Action("MyReadAction", "MyController")
)
))

Grid

answered on 18 Jan 2018

1 answer

366 views

Using a tabstrip with datasource help

I am pulling in a tabstrip to show details within a template on the kendo grid. I do my initial pull for the grid, but would like to use a separate datasource for the tabstrip. I only have one tab that holds all these detail. Is there a better way of achieving this? I do want to show everythign in teh table like the HTML shows, but want to pull it from its own datasource when the detail table is displayed.

I do it elsewhere successfully but thats with using a grid within the template.

Below is the grid code and the template code

@(Html.Kendo().Grid<InvoiceVM>()

.Name("grid")

.Columns(columns =>

{

columns.Bound(i => i.DarwinInvoiceNumber).Title("Invoice").ClientTemplate("<a href='" + Url.Action("Current", "PayrollInvoices", new { i = "#: DarwinInvoiceNumber#" }) + "' >#: DarwinInvoiceNumber#</a>").Width(100);

columns.Bound(i => i.DivisionID);

//columns.Bound(i => i.Date).Format("{0:MM/dd/yyyy}");

//columns.Bound(i => i.CheckDate).Format("{0:MM/dd/yyyy}");

columns.Bound(i => i.DateDisplay).Title("Date"); //09/26/2017 DS TFS # 2798

columns.Bound(i => i.CheckDateDisplay).Title("Check Date"); //09/26/2017 DS TFS # 2798

columns.Bound(i => i.Total).Format("{0:C}");

columns.Bound(i => i.Employees);

columns.Bound(i => i.Employees).Title("Checks").Width(100);

columns.Bound(i => i.TotalGross).Title("Gross Wages").Format("{0:C}");

})

.Sortable()

// .Selectable()

.Scrollable()

.ToolBar(tools => tools.Excel())

.Excel(excel => excel

.FileName("PayInvoices.xlsx")

.Filterable(true)

)

.Groupable()

.ColumnMenu()

.Pageable()

.Filterable()

.ClientDetailTemplateId("template")

.HtmlAttributes(new { style = "height:600px;" })

.Reorderable(reorder => reorder.Columns(true))

.Resizable(resize => resize.Columns(true))

.DataSource(dataSource => dataSource

.Ajax()

.PageSize(15)

.Read(read => read.Action("Get_InvoicesRead", "PayrollInvoices"))

)

.Excel(excel => excel

.FileName("InvoiceList.xlsx")

.Filterable(true)

.AllPages(true)

//.ProxyURL(Url.Action("Excel_Export_Summaries_Save", "Reports"))

)

.Events(events => events.DataBound("dataBound"))

)

<script id="template" type="text/kendo-tmpl">

@(Html.Kendo().TabStrip()

.Name("tabStrip_#=DarwinInvoiceNumber#")

.SelectedIndex(0)

.Animation(animation => animation.Open(open => open.Fade(FadeDirection.In)))

.Items(items =>

{

items.Add().Text("Details").Content(

"<div class='invoice_details sub-table-background'>" +

"<table class='table table-bordered'><tr><td><label>Pay Period Begin:</label></td><td>#=kendo.toString(StartDate,'MM/dd/yyyy')#</td><td><label>FICA Med</label></td><td>#= kendo.toString(TotalFicaM,'c') #</td><td><label>Total Benefits</label></td><td>#= kendo.toString(TotalBenefits,'c') #</td></tr>"

+

"<tr><td><label>Pay Period End:</label></td><td>#= kendo.toString(EndDate,'MM/dd/yyyy') #</td><td><label>FICA SS</label></td><td>#= kendo.toString(TotalFicaSS,'c') #</td><td><label>Credits</label></td><td>#= kendo.toString(TotalCredits,'c') #</td></tr>"

+

"<tr><td><label>Net Wages:</label></td><td>#= kendo.toString(NetWagesPayRun,'c')#</td><td><label>FUTA</label></td><td>#= kendo.toString(TotalFUTA,'c') #</td><td><label>Fees </label></td><td>#= kendo.toString(TotalFees,'c') #</td></tr>"

+

"<tr><td><label>Sales Tax:</label></td><td>#= kendo.toString(Tax,'c')#</td><td><label>SUTA</label></td><td>#= kendo.toString(TotalSUTA,'c') #</td><td><label>Amount Due</label></td><td>#= kendo.toString(AmountRemaining,'c') #</td></tr>"

+

"<tr><td><label>Non Gross:</label></td><td>#= kendo.toString(TotalNonGross,'c') #</td><td><label>Worker's Comp</label></td><td>#= kendo.toString(TotalWC,'c') #</td><td></td><td></td></tr>"

+

"</table></div>"

);

})

.ToClientTemplate()

)

</script>

Grid

answered on 18 Jan 2018

1 answer

1.3K+ views

Cannot use Kendo within areas

Hi,

Hope someone can help me out with this.

I have created a new project in which I have successfully added Telerik UI ASP.Net MVC. I can use the following code in the index view of my project:

@(Html.Kendo().DatePicker().Name("datepicker"))

However my issue is that I have split my project into areas, and for some reason the code above doesn't work in the index views in these areas. I get an Compilation error that reads:

"HtmlHelper<dynamic>' does not contain a definition for 'Kendo' and no extension method 'Kendo' accepting a first argument of type 'HtmlHelper<dynamic>' could be found (are you missing a using directive or an assembly reference?"

Do I need to add additional references somewhere in these areas?

Appreciate any help, thanks.

General Discussions

answered on 18 Jan 2018

2 answers

116 views

Javascript Error "Error: Invalid template:'"

Hi,

At the moment I am converting an application with Telerik MVC To Kendo UI.

a lot of stuff I already migrated, but this one it troubling me for a couple of days now.
The structure I have is as following.
- I have a tabsptrip and whithin the items I have grids.
- those grids contain a "DetailView" or as in the new situation "ClientDetailTemplateId"

- the clientTemplate inself contains a tabstrip as well.

and untill here everything is ok.
I can add a tabstrip Item with only HTML.
but as soon as I add an other grid to the tabstrip of the lowest item I get a Javascript Error: "Error: Invalid template:'"

and I don't know why, I tried a lot of different ways of adding the grid.

is there someone who can help me? I'm using version "2017.3.1026" of Kendo UI.
thank you

TabStrip

answered on 18 Jan 2018

1 answer

6.3K+ views

DropDownList with enums

I am trying to use a DropDownList with an enum.

@Html.Kendo().DropDownListFor(model => model.Program) where Program is of type RecyclingProgram which is an Enum.

How do I get the enum values to:

Display in the drop-down list?
Update the model when it is posted back to the server?

DropDownList

answered on 18 Jan 2018

9 answers

877 views

Scheduler weeks in year view on timeline

Hello,

There doesn't seem to currently be a year view for the scheduler that would display time in weeks in a timeline, am I correct in this? On the other hand, is there any detailed documentation for implementing your own views. I mean documentation on what functions to overwrite in TimelineMonthView / what they do exactly and what the different timeslots and groups are.

Scheduler

answered on 17 Jan 2018

1 answer

88 views

Show New Resource Data In New Column

hello telerik.

i'm using telerik gantt chart mvc.

i have added one more button and dialog box to handle one more ResourceAssignment in my chart control. the 2nd one is all the customized dialog box to show new resource assignments.

now i'm facing an issue in showing the new ResourceAssignments data in New Column side by the original ResourceAssignment column at treeview side.

i want to show both resource assignments data in two separate columns. currently both resource's data is showing in the same column that is not what i want.

i've attached images for clarification

Gantt

answered on 17 Jan 2018

13 answers

102 views

One More Dialog Like Resources

Hey Telerik Team !

I've a requirement in my Gantt Chart for MVC.

Same like Resource Assignment Dialog i need to put one more thing (Cars) in a separate dialog box like resources dialog from where the Cars will be assigned to a particular task same like Resource Assignment to a particular task.

How can i do this in Telerik Gantt Chart For MVC ?

Gantt

answered on 17 Jan 2018

2 answers

130 views

When exporting to pdf, aggregate row is appearing on a new page

Hello. When I am exporting to PDF, the aggregate row is displaying on a new page though there is space in the previous page. See attached file.

The settings for generating the pdf are as follows:

.Pdf(pdf => pdf
.AllPages()
.PaperSize("A4")
.Scale(0.6)
.Margin("30mm", "10mm", "30mm", "10mm")
.Landscape()
.RepeatHeaders()
.TemplateId("page-template")
.FileName("Combined Summary Report.pdf")
.ProxyURL(Url.Action("Pdf_Export_Save", "CombinedSummaryReport"))
)

I have tried changing the values for the top and bottom margins, but then some records are not displaying.

Any help will be much appreciated.

Thanks

Grid

answered on 16 Jan 2018

5 answers

260 views

Manipulate Task DataSource

Hello Telerik Team !

I'm using telerik gantt chart for MVC

i want to ask can i manipulate tasks data before it get's bind to the chart ?

like when READ action for task data source gets fired and get the data from server and then at client side before binding tasks to chart it can be changed.

can i do that ? kindly tell.

Thank You.

Gantt

answered on 15 Jan 2018