Questions on UI for ASP.NET MVC Forum

1 answer

6.4K+ views

Remove dropdown option from Kendo dropdownlist using jquery

I have tried and tried and searched the internet trying to figure this out but still haven't found an exact answer. Removing an item from a standard issued select dropdown is pretty easy, the code is: $("#dropdownlistID option[value='optiontoremove']").remove();

How do i do this with Kendo Dropdownlist, something along the lines of $("#dropdownlistID").data("kendoDropDownList").whateverhere.remove

Thanks to whoever can help me solve this.

DropDownList

answered on 19 Sep 2016

7 answers

759 views

Close event access parent document

HI!

Hi have a page with multiple grids. When I click in one element a modal window (kendoWindow) opens and update info from the item (it's not create or edit popup).

So when I close the kendoWindow I want to refresh the dataSource, but when I try to access to the specific grid it is undefined. How can I solve it?

Here's the code from onClose event of the kendoWindow.

Thanks!!!

function onClose(e) {

$("#undo").fadeIn();

var grid = $("grid_" + zona).data("kendoGrid"); // <- undefined (grid's name is valid)

grid.dataSource.read()

}

Window

answered on 19 Sep 2016

23 answers

2.6K+ views

DatePicker format will not validate even

I have a DatePicker that I want the desired input to be "Sun, 3/10/13"

I've set up the DatePicker Format AND added the same format to the ParseFormats functions of "ddd, M/d/yyyy"

The strange thing is that the desired input works, but the validation fires.

For example.

I type "3/10/2013" into the field and tab to the next input. At this point, my input changes to "Sun, 3/10/13" (which is desired), BUT I get the "Field Date must be a date" validation error message.

Do I need to define this format on the view model as well or is something else strange going on?

Here's the source and an image of the issue is attached:

@(Html.Kendo().DatePickerFor(m => m.PickupDate)

.ParseFormats(new string[] {

"ddd, M/d/yyyy",

"ddd, MM/dd/yyyy",

"ddd, M/dd/yyyy",

})

.Format("ddd, M/d/yyyy")

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

)

<span class="k-invalid-msg" data-for="PickupDate"></span>

DatePicker

answered on 17 Sep 2016

3 answers

445 views

Inline Editing of Dynamic Columns

I have a model with a dynamic number of attributes that I am displaying in a grid using the method described here. The ajax read, edit, and destroy functions work properly, but I can't get the create button to generate a new line in the grid. Is there a way to get this functionality working with dynamically generated columns?

Model:

01.public class Product

02. {

03. public int ID { get; set; }

04.

05. private string _Name = "Product";

06. public string Name

07. {

08. get { return _Name; }

09. set { _Name = value; }

10. }

11.

12. public Dictionary<string, int> OptionIDs { get; set; }

13. }

Grid in View:

01.

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

02. .Name("grid")

03. .Columns(columns =>

04. {

05. columns.Bound("Name").Title("Name").EditorTemplateName("String");

06. columns.Bound("ID").Title("Product ID").EditorTemplateName("Integer");

07.

08. foreach (Dimension d in Model.Dimensions)

09. {

10. columns.Bound($"OptionIDs[{d.ID.ToString()}]").Title(d.Name).EditorTemplateName("Integer");

11. }

12. columns.Command(command => { command.Edit(); command.Destroy(); });

13. })

14. .ToolBar(tb => tb.Create())

15. .Selectable()

16. .Editable(editable => editable.Mode(GridEditMode.InLine))

17. .Pageable()

18. .DataSource(datasource => datasource

19. .Ajax()

20. .Model(

21. model =>

22. {

23. model.Id("ID");

24. }

25. )

26. .PageSize(20)

27. .Read(read => read.Action( "Products_Read", "Products"))

28. .Update(update => update.Action( "Products_Update", "Products"))

29. .Create(create => create.Action( "Products_Create", "Products"))

30. .Destroy(destroy => destroy.Action( "Products_Destroy", "Products"))

31. )

32.)

Controller:

01.public class ProductsController : Controller

02. {

03. public ActionResult Index()

04. {

05. return View(Models.MockData.PVM);

06. }

07.

08. public ActionResult Products_Read([DataSourceRequest] DataSourceRequest request)

09. {

10. IQueryable<Models.Product> ps = Models.MockData.PVM.Products.AsQueryable();

11. DataSourceResult result = ps.ToDataSourceResult(request, p => new

12. {

13. Name = p.Name,

14. ID = p.ID,

15. OptionIDs = p.OptionIDs

16. });

17.

18. return Json(result, JsonRequestBehavior.AllowGet);

19. }

20.

21. public ActionResult Products_Create([DataSourceRequest] DataSourceRequest request, Models.Product product)

22. {

23. return Json(new[] { product }.ToDataSourceResult(request, ModelState));

24. }

25.

26. public ActionResult Products_Update([DataSourceRequest] DataSourceRequest request, Models.Product product)

27. {

28. return Json(new[] { product }.ToDataSourceResult(request, ModelState));

29. }

30.

31. public ActionResult Products_Destroy([DataSourceRequest] DataSourceRequest request, Models.Product product)

32. {

33. return Json(new[] { product }.ToDataSourceResult(request, ModelState));

34. }

35. }

Grid

answered on 16 Sep 2016

6 answers

43 views

Where did the MVC Online Demos go? They are all HTML5 samples now

It's been a few months since I have had to use the MVC demo section online (http://demos.telerik.com/aspnet-mvc/ ), so I'm sorry if I missed a notice about the document changes.

However, now when I go to the MVC demos, they look exactly the same as the HTML5 demo. It use to be the MVC demos would show the .cshtml with the Html helpers used. Now it's all jscript.

Example http://demos.telerik.com/aspnet-mvc/combobox/index looks the same as http://demos.telerik.com/kendo-ui/combobox/index

Something going on?

General Discussions

answered on 16 Sep 2016

21 answers

2.8K+ views

How to access values from a List<> in the ViewModel

So I have a ViewModel that contains a string and a List<NpiList> object.

@(Html.Kendo().Grid<ViewModels.PecosViewModel>()
.Name("npi-grid")
.Columns(columns =>
{
columns.Bound(c => c.NpiList) <-- I cannot access the properties of the list, like FirstName or LastName. It only gives me the option to bound to the list.

})
)

Any suggestions?

Grid

answered on 16 Sep 2016

4 answers

166 views

Grid not displaying data in all columns

I have this grid

@(Html.Kendo().Grid<AccidentBook.Models.Accident>()

.Name("grid")

.Columns(columns =>

{

columns.Bound(c => c.AccidentDate );

columns.Bound(c => c.Description);

})

.DataSource(dataSource => dataSource

.Ajax()

.Model(model => model.Id(p => p.ID))

.Read(read => read.Action("Accidents_Read", "Accident"))

)

Here we can see Accidents_Read

public ActionResult Accidents_Read([DataSourceRequest]DataSourceRequest request)

{

IQueryable<Accident> accidents = db.Accidents;

DataSourceResult result = accidents.ToDataSourceResult(request, accident => new {

ID = accident.ID,

AccidentDate = accident.AccidentDate,

Descripion = accident.Description,

});

return Json(result);

}

The issue I am having is that the description column is that the Description column isn't being displayed, AccidentDate is displayed ok. I can see using firebug that the data is being returned ok (attached image). Does anyone have any ideas as to what might be the problem?

Grid

answered on 16 Sep 2016

3 answers

433 views

Two foreign key drop-downs in grid?

Hi! I use MVC Core and Kendo UI for MVC.

I have a grid that has two different foreign key columns, for which I want drop-downs. I have two problems:
1. How can I bind any of them to the MVC Model? TheGridForeignKey.cshtml that I copied in to the Shared/EditorTemplates folder uses some unknown field in the ViewData (which is null and throws an exception at run-time). I want to use MVC. I tried the following which hard-codes some values but it at least shows the drop-down in grid both columns:

Html.Kendo().DropDownListFor(m => m)

.BindTo((SelectList) new SelectList(new List<string> { "A", "B", "C" }) )

2.The GridForeignKey.cshtml is shared for all views in the whole site, how can I bind it in the actual view instead, where I have control over data?

As you can see, I haven't really figured out how all this works and is glued together.

Grid

answered on 16 Sep 2016

1 answer

398 views

"Invalid Model Configuration" Error when scaffolding. From EDMX model. EF5, MVC5, VS2015. Why???

Getting "Invalid Model Configuration" Error when scaffolding. From EDMX model. EF5/6, MVC5, VS2015. Why??? There shouldn't be any reason for this to happen.

General Discussions

answered on 16 Sep 2016

1 answer

151 views

Boostrap Style Layout

Hi,

I am in the process of converting to an Kendo MVC application and using a bootstrap style framework.

I was looking for an example in Kendo ListView that I could achieve in a RadListView with the following code. Setting pagesize to 3 and displaying 3 items horizontally.

<telerik:RadListView ID="RadListView1" runat="server" OnNeedDataSource="RadListView1_NeedDataSource" ItemPlaceholderID="PlaceHolder1" PageSize="3" AllowPaging="true" Width="100%">

<LayoutTemplate>

<div class="row uniform">

<asp:PlaceHolder ID="PlaceHolder1" runat="server" />

</div>

</LayoutTemplate>

<ItemTemplate>

<div class="4u 12u(narrower)">

<div class="boxwrapper style1">

<section class="box special">

<span class="image fit">

<telerik:RadBinaryImage ID="RadBinaryImage2" runat="server" AutoAdjustImageControlSize="false" DataValue='<%#Eval("ArticleImage") %>' />

</span>