Questions on UI for ASP.NET MVC Forum

1 answer

234 views

ASP.NET MVC controls are generating inline javaScript

Hello,

We are using ASP.NET MVC controls, and we have one potential deal breaker.

When we open the HTML source off a rendered page we see the HTML code generated by the Telerik control and immediately below it we see a <script> tag with some javascript for that control. This is very bad for us, and we don't want to have javascript code mixed in the HTML.

Is there an alternative to this issue or it is just how the controls are designed?

Thank you!

General Discussions

answered on 23 Mar 2015

1 answer

314 views

Generic Dropdown Editor Template???

I'm creating all of these grids in different views and many require custom edit template. The pattern I'm having to create is a bunch of editor templates for the dropdowns. Is there a way to reuse the editor types with different models. The answer might be no, I just don't have yet the experience with mvc and editor templates for the answer.

My limited and not realistic way would be to have the classes used for the dropdown to inherit from a "BaseDropDown" that has the text and value properties. Then have a case statement determine which dataveiw to use when binding.

Greg

Grid

answered on 20 Mar 2015

2 answers

1.2K+ views

Missing Down Arrow

I have a drop-down list in a collapsible sidebar (defined using css). When placed in the sidebar, the down arrow on the control doesn't show, no matter what the width of the control is set to.

The code is:-

<div id="sidebar-wrapper">

<ul class="sidebar-nav">

<li class="sidebar-brand">

<img src="@Url.Content("~/Content/Images/Trust_Logo.png")" />

</li>

<li style="margin-top:40px;">

<span style="font-size:x-small">Division</span>

@(Html.Kendo().DropDownList()

.Name("ddlDivsion")

.DataValueField("Code")

.DataTextField("Description")

.Events(e => e.Change("onChange"))

.HtmlAttributes(new { style = "width:80px; font-size:x-small;" })

.DataSource(src => src.Read(rd => rd.Action("GetDivisions", "Division")))

)

</li>

</ul>

</div>

And the css that defines the sidebar is:-

#wrapper {

padding-left: 0;

-webkit-transition: all 0.5s ease;

-moz-transition: all 0.5s ease;

-o-transition: all 0.5s ease;

transition: all 0.5s ease;

}

#wrapper.toggled {

padding-left: 150px;

}

#sidebar-wrapper {

z-index: 1000;

position: fixed;

left: 150px;

width: 0;

height: 100%;

margin-left: -150px;

overflow-y: auto;

background: #C9F2F8;

-webkit-transition: all 0.5s ease;

-moz-transition: all 0.5s ease;

-o-transition: all 0.5s ease;

transition: all 0.5s ease;

}

#wrapper.toggled #sidebar-wrapper {

width: 150px;

}

#page-content-wrapper {

width: 100%;

position: absolute;

padding: 15px;

}

#wrapper.toggled #page-content-wrapper {

position: absolute;

margin-right: -150px;

}

/* Sidebar Styles */

.sidebar-nav {

position: absolute;

top: 0;

width: 150px;

margin: 0;

padding: 0;

list-style: none;

}

.sidebar-nav li {

text-indent: 20px;

line-height: 40px;

margin-top:10px;

}

.sidebar-nav li a {

display: block;

text-decoration: none;

color: #0483AA;

}

.sidebar-nav li a:hover {

text-decoration: none;

color: darkblue;

background: rgba(255,255,255,0.2);

}

.sidebar-nav li a:active,

.sidebar-nav li a:focus {

text-decoration: none;

}

.sidebar-nav > .sidebar-brand {

height: 65px;

font-size: 18px;

line-height: 60px;

}

.sidebar-nav > .sidebar-brand a {

color: #999999;

}

.sidebar-nav > .sidebar-brand a:hover {

color: #fff;

background: none;

}

@media(min-width:768px) {

#wrapper {

padding-left: 150px;

}

#wrapper.toggled {

padding-left: 0;

}

#sidebar-wrapper {

width: 150px;

}

#wrapper.toggled #sidebar-wrapper {

width: 0;

}

#page-content-wrapper {

padding: 20px;

position: relative;

}

#wrapper.toggled #page-content-wrapper {

position: relative;

margin-right: 0;

}

I'm assuming something in the css is causing the issue - but can't work out what.

Thanks

DropDownList

answered on 20 Mar 2015

3 answers

99 views

Label in Donut Chart

Hi,

Before I start hacking around with CSS, is there an obvious way to get a label / title in the centre of a Donut Chart?

Thanks

Chart

answered on 20 Mar 2015

6 answers

510 views

Binding to custom editor for a grid column (i.e. drop down list)

How do you specify a custom editor function for in-line editing with ASP.NET MVC? If I was doing this strictly on the client side I would set the 'editor:' attribute on the column with a javascript function name. Is there a way to specify an editor function using Razor syntax in my view?

FYI, the scenario here is very simple - I have a list of Products and each product record has a Category ID field. When I add or edit a product, I want the user to select from a list of defined categories. The category items can come from server on initial page load or dynamically from ajax (in this case, I really don't care which - the category list doesn't change much).

Thanks in advance.

Grid

answered on 19 Mar 2015

3 answers

126 views

Latest UI ASP.NET MVC

Does the latest update for UI for ASP.NET MVC only install for MVC 5 apps in Visual Studio?

We have a few MVC 4 apps, and the upgrade wizard in VS does not seem to want to update those.

Installer and VS Extensions

answered on 19 Mar 2015

2 answers

258 views

ASP.NET MVC Grid - Filter row with date range filter

I tried to search but have been able to find a solution for this. I am attempting to implement a grid with filter row that allows for filtering on a date range - having a From date entry box and a To date entry box both visible in the filter row. I couldn't find a way to implement templates for the filters on filter rows or really either other way to accomplish this. Any help or examples of someone doing something similar would be a huge help. Thanks,

Grid

answered on 19 Mar 2015

2 answers

306 views

Custom editor not working with editCell method

Hi, i have a kendo grid with custom editor that show comboBox or dropDownList or datePicker.
It work correctly if i manually focus on column.

I need to show cell editor from code, so i call myGrid.editCell(myCol), but i noticed that this method work correcly only with columns without custom editor (it's show inputbox and focus on it).
With custom editor columns it's show the corresponding element (comboBox, dropDownList, datePicker ecc...) but if i click the widget not respond (es. not open comboBox or dropdownList or datePicker window).

my kendo ui version is v2014.2.1008

Any solution?
Thanks

Grid

answered on 19 Mar 2015

7 answers

120 views

How was the Unit Price custom editor accomplished on the grid/editing-custom demo?

I may be missing something obvious here, but how was the Unit Price NumericTextBox with a minimum of 1 accomplished on the demo at http://demos.telerik.com/aspnet-mvc/grid/editing-custom ? I only see one mention of UnitPrice in the example code

columns.Bound(p => p.UnitPrice).Width(120);

but surely that's not all there was to it. When I view the demo page's source I also see a kendo.data.DataSource being created with:

UnitPrice: { type: "number", validation: { required: true, min: 1} }

but it still seems like there would be something else going on in the @(Html.Kendo().Grid definition to make the editor use a NumericTextBox over just a plain textbox.

Is there anything else going on, and if so, where can I find the details? I'm not seeing any more information in the local demo project either, but I might just be looking in the wrong place. Or is there a better demo example I can look at that shows how to do just the NumericTextBox in a grid?

Grid

answered on 19 Mar 2015

1 answer

158 views

Treelist expanded by default

How can I set my treelist to expanded state by default ?

TreeList

answered on 19 Mar 2015