Questions on UI for ASP.NET MVC Forum

2 answers

145 views

Editor: How to enable Tabulator inside the editor textbox

Hello,

I use the Editor control in my MVC application. I need to support the Tabulator key inside the Editor textbox.
When I press the Tabulator key, the Editor control looses the focues. But I need the support of the Tabulator key inside the Editor textbox.

Is there any "hack" or workaround to perform this action in the Editor textbox?

Greets

Editor

answered on 17 May 2013

2 answers

279 views

Display Edit/Delete button based on record column

Hi,

If I want to display edit and delete button for the record which CanEdit column is true, can you suggest how to do that?

columns.Bound(p => p.CanEdit).Width(100);
columns.Command(command => { command.Edit(); command.Destroy(); }).Width(172);

Thanks
Dan

Grid

answered on 17 May 2013

5 answers

393 views

Grid Toolbar functioality outside grid

Hi
i am using telerik for one of my project where i use custom button placed ouside grid for saving the whole grid data. (c#.net)
Now i am working on MVC Razor i see in kendo with toolbar,
can we have the same tool bar functionality outside grid meaning ,
can i use one button (save) where i can take all grid datas and do the same process how toolbar does(iterate)
and save .

I know batch process does individual grid save , i need to send some 4 grid to controller and save

I have one requirement of this type

Please let me know whether above requirement possible or not

Senthil

Grid

answered on 16 May 2013

1 answer

162 views

Grid Cell DropDownList, Currency Textbox and DatePicker

Hello,

I am trying to implement the edit, delete and save functionality in the grid. I am facing couple of issues during the development.
I have to use the drop down list to display the multiple values in one of the column. I have read few posts in this forum and I checked with examples which has been downloaded from this site. Still, I could not make it work.
While editing, I have to display the datepicker in the date of birth column, how can I add the datepicker control inside the grid.
The same way I need to give more flexibility to the use to increase / decrease the number values. When I edit the record, always I get the textbox for all the columns.

I have attached my project. Please go through and let me know what I am missing to make it work successfully.

Thanks!

Grid

answered on 16 May 2013

1 answer

295 views

Grid with Dynamic Editing Modes

I have a grid with two columns: OrganizationId and OrganizationName.

The users are able to create/edit new Organizations. when an user clicks in the Create toolbar button both properties should be editable.
The thing is, when the grid is rendered it probably has some records, so if the user tries to edit one of those, he/she is going to be able to edit the OrganizationName, but the OrganizationId has be a label.
This last behavior doesn't apply if the user tries to edit a new record (a record added with the create button functionality in this render time).

At the end it should be like
if it's old record -> edit mode = label + textbox
if it's new record -> create/edit mode = textbbox + textbox

Right now I have my custom kendo wrapper that reads the object properties, dynamically builds the grid columns and returns a GridBuilder. It look like this:

01.public static CustomGridFor<TProperty> KendoGrid<TModel, TProperty>(

02. Expression<Func<TModel, IEnumerable<TProperty>>> expression,

03. string defaultProperty,

04. string createAction,

05. string readAction,

06. string updateAction,

07. string controller,

08. string errorHandler) where TProperty : class

09.{

10. var dataSource = expression.Compile().Invoke(htmlHelper.ViewData.Model);

11. var gridColumnSettings = GridBuilderExtensions.CreateGridColumnSettings<TProperty>() as List<GridColumnSettings>;

12. if (gridColumnSettings != null)

13. {

14. gridColumnSettings.Add(new GridCommandColumnSettings { Commands = { new GridEditActionCommand(), }, });

15. }

16.

17. var gridBuilder = new this.Grid(dataSource)

18. .Name("GridName")

19. .Columns(c => c.LoadSettings(gridColumnSettings))

20. .DataSource(source => source

21. .Ajax()

22. .PageSize(50)

23. .Model(model => model.Id(defaultProperty))

24. .Destroy(d => d.Action(destroyAction, controller))

25. .Read(r => r.Action(readAction, controller))

26. .Update(u => u.Action(updateAction, controller))

27. .Batch(true)

28. .Events(e => e.Error(errorHandler)))

29. .ToolBar(a => a.Create().Text("New"))

30. .Editable(editable => editable.Mode(GridEditMode.InLine));

31.

32. return gridBuilder;

33.}

I made some research about the grid behavior and found the Grid / Editing custom editor, this example has a ClientTemplate and Editable as false, something like this is what I want for the OrganizationId edit mode in the in old records and for the new ones edition I can use the Inline Editing.

01....

02.columns.Bound(p => p.Category).ClientTemplate("#=Category.CategoryName#").Width(160);

03....

04..Model(model =>

05.{

06. model.Id(p => p.ProductID);

07. model.Field(p => p.ProductID).Editable(false);

08.})

09....

Another question that I have, is there any way to set the DataSource Model property dynamically?

1....

2..DataSource(source => source.Ajax()

3. .Model(model =>

4. {

5. model.Id(p => p.ProductID);

6. model.Field(p => p.ProductID).Editable(false);

7. })

8....

I mean, do something like the columns loading where we can build the columns list with its name, behavior, ... and then set it.

1..Columns(c => c.LoadSettings(new IEnumerable<GridColumnSettings>()))

thanks in advance,
-julio

Grid

answered on 16 May 2013

6 answers

388 views

GridColumnSettings issues.

Hi,

I’m working with a Kendo Grid using MVC4 with Razor’s syntax.

I need to be able to customize column’s order and displaying option in order to save user’s preference.

To achieve that, I tried to use a tab of GridColumnSettings and load it in the View using the LoadSettings method of the columns property.

I have a few issues with that:

- Even if the column order can be set dynamically with this method, I don’t understand how to use ClientTemplate or Template attribute of the GridColumnSettings object.

- By using this loading system I have two Gird's options who don’t work anymore: line and column are not selectable and the groupable option seems to not work too.

Thanks for your help.

Grid

answered on 16 May 2013

2 answers

802 views

Adding a new row at the bottom of grid

How to add a new row at the bottom of the grid instead of the first row?

Grid

answered on 15 May 2013

1 answer

700 views

ClientDetailTemplate: 'Invalid template' when using kendo.toString() in ClientTemplate Column

Dear KendoUI Team!
I hope you can help me. I got the following problem:
when using kendo.toString to format a number.

The following line inside the ClientDetailTemplate for a grid Column leads to an 'invalid template' error:
(BAD:)
columns.Bound(o => o.Price).Title(Strings.di_Price).ClientTemplate("#= kendo.toString(Price, \"n2\") #");
or
columns.Bound(o => o.Price).Title(Strings.di_Price).ClientTemplate("#= kendo.toString(Price, 'n2') #");

while this is OK:
(GOOD:)
columns.Bound(o => o.Price).Title(Strings.di_Price).ClientTemplate("#= kendo.toString(Price) #");

Here is the line in the model

[DataType("Number")]
public decimal Price { get; set; }

But I want to format the column. In the main grid, I can use .toString() like described. But in the ClientDetailTemplate it fails.
What can I do to format the output in ClientDetailTemplate?

brgds
Malcolm Howlett

Grid

answered on 15 May 2013

1 answer

53 views

Firebug causes grid cell elements to disappear when editing

Run the examples app in FF, pull up any grid example. Start firebug. Click edit button - POOF - grd elements disappear.
error shows up in firebug - TypeError: ot.jQuery(...).handler is not a function - kendo.web.min.js (line 9)

Any advice - I would like to use firebug to debug my apps!

Grid

answered on 15 May 2013

2 answers

230 views

Clicking update after edit does nothing on the client

Scenario.

1. Create a new KendoUI MVC 4 application.
2. Copy the NorthwindDB, Controller, View, Model and supporting classes for the Grid Editing_Inline example code found from the KendoUI MVC examples install.
3. Build and run - Grid comes up, I can sort and page and add new record.
THE ISSUE: When I click edit - the row changes and allows me to change values. I make sure I change some to make it dirty. I then click Update. I can confirm (through a breakpoint) that the Controllor Action EditingInline_Update is hit.
HOWEVER- the Grid Row DOES NOT Change back to a non-edit mode.

I have tried all sorts of things - updating the jquery version. Making sure my script references match the examples project, etc etc.

WHAT AM I missing??

Grid

answered on 14 May 2013