Questions on Kendo UI for jQuery Forum

0 answers

250 views

Updating dataSource after Adding a new item in Grid

I have the Grids set up in a few places on my site and they are working well except when I create a new item. The item is sent to the controller correctly, written to the database and then wrapped in JSON with the new ID and sent back out to the site correctly (I tracked it in Firebug and the JSON is well formed with no errors). How do I bind this back to the dataSource and replace the new line? If I click Update on the row it creates another new item instead of updating the current.

Grid Code

<%: Html.Kendo().Grid<Thread.Data.Models.Model>()

.Name("Grid")

.Columns(columns =>

{

columns.Command(command => { command.Edit(); command.Destroy(); }).Width(190).HtmlAttributes(new { style = "text-align:center;" });

columns.Bound(m => m.ModelID).Hidden();

columns.Bound(m => m.ModelName).Width(140);

columns.Bound(m => m.Company).Width(160).ClientTemplate("#= (typeof Company === 'undefined') ? ' ' : Company.CompanyName #").EditorTemplateName("CompanyDropDownList");

columns.Bound(m => m.Job).Width(160).ClientTemplate("#= (typeof Job === 'undefined') ? ' ' : Job.JobName #").EditorTemplateName("JobDropDownList");

columns.Bound(m => m.TempModelNumberFlag).Width(100);

columns.Bound(m => m.IsCarryOver).Width(100);

columns.Bound(m => m.HoursEstimate).Width(120).ClientTemplate("#= (HoursEstimate === null) ? ' ' : HoursEstimate #");

columns.Bound(m => m.Description).Width(140).ClientTemplate("#= (Description === 'null') ? ' ' : Description #");

columns.Bound(m => m.RetailIntroDate).Width(140).Format("{0:d}");

})

.ClientDetailTemplateId("jobDetailTemplate")

.ToolBar(toolBar =>

{

toolBar.Create();

})

.Editable(editable => editable.Mode(Kendo.Mvc.UI.GridEditMode.InLine))

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

.Pageable()

.Sortable()

.Scrollable()

.Selectable()

.Filterable()

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

.DataSource(dataSource => dataSource

.Ajax()

.ServerOperation(false)

.PageSize(15)

.Events(events => events.Error("error_handler"))

.Model(model =>

{

model.Id(j => j.ModelID);

model.Field(j => j.ModelID).Editable(false);

model.Field(j => j.AlertCount).Editable(false);

model.Field(j => j.ArticleCount).Editable(false);

model.Field(j => j.DocumentCount).Editable(false);

})

.Read(read => read.Action("Model_Read", "Models"))

.Update(update => update.Action("Model_Save", "Models"))

.Create(create => create.Action("Model_Save", "Models"))

.Destroy(destroy => destroy.Action("Model_Destroy", "Models"))

)

%>

In the Controller, after the save I return this:
return Json(new[] { results.ToList()[0] }.ToDataSourceResult(request, ModelState));

The JSON returned is fine and has the ID:

Data

[Object { ModelID=6

, ModelName="Test IV"

, ModelNumber="DSAF", more...}]

Total 1

AggregateResults null

Errors null

Can this rebind or do I have to call Read and reload the whole dataSource? And if so how do I do either one of those.

Thanks,

Matt

Grid

asked on 30 Oct 2012

0 answers

137 views

Upload one file or all selected files

Hi,

I have a webpage with a button upload in the upper section of the page.

When the user click this button he can select one or multiples files to upload.

I added an handler to the select method of the kendo ui upload control.

For each file selected I call a jquery template to show the information of the selected file with two button (Upload and Cancel).

So if I select 2 files I will will call 2 times this template and render it for each file.

I have a button Upload All too in my webpage.

So my goal is to have the possibility to upload only one file or all and to have a progress bar.

It is possible with Kendo UI upload control ?

Thank you

Upload

asked on 30 Oct 2012

1 answer

118 views

Hierarchy with Detail Editing?

I have a grid that uses the hierarchy feature.

Is it possible to have inline editing for the child rows?

I can get it to work for the parent rows, but the update button doesn't do anything with the child rows.

Grid

answered on 30 Oct 2012

2 answers

2.3K+ views

manual change page?

Hi, I'm trying to figure out how I could load a grid and read a cookie and move the grid to a page from the value stored in the cookie.

I'm currently able to grab the page number through some code I found:

dataBound: function (e) {pageNum = this.dataSource.page(); $.cookie('jobpagenum', pageNum); },

now when the page reloads, I want to be able to tell the grid to switch over to that page.

any help?

thanks
steve

Grid

answered on 30 Oct 2012

2 answers

822 views

Grid number field inline edit with step?

Is there a way to set the step for a number field in the grid or do I need to make a custom editor with a kendoNumericTextBox and put it in there? For example, my Commissions column is a percentage, and I would like the number to go from 0 to 1.0 with a step of .01.

var dsInvestments2 = new kendo.data.DataSource({

transport: {

read: "/api/investments",

create: { url: "/api/investments", type: "POST" },

update: {

url: function (o) { return "/api/investments/" + o.ID; },

type: "PUT"

},

destroy: {

url: function (o) { return "/api/investments/" + o.ID; },

type: "DELETE"

}

},

group: [ { field: "AccountTypeName", dir: "desc" }, { field: "ProductName", dir: "desc" } ],

schema: {

model: {

id: "ID",

fields: {

ID: { editable: false, nullable: false },

AccountTypeID: { editable: true },

AccountTypeName: { editable: false },

ProductID: { validation: { required: true } },

ProductName: { editable: false },

Name: { validation: { required: true } },

Commission: { validation: { required: true }, type: "number" }

}

});

$("#investments").kendoGrid({

sortable: true,

scrollable: true,

toolbar: [{ name: "create", text: "New" }],

dataSource: dsInvestments2,

columns: [

{ field: "AccountTypeID", title: "Account Type", template: "#=AccountTypeName#", editor: accountTypeEditor, hidden: true },

{ field: "AccountTypeName", title: "Account Type", hidden: true, groupHeaderTemplate: "${ value }" },

{ field: "ProductID", title: "Product", editor: productsEditor, template: "#=ProductName#", hidden: true },

{ field: "ProductName", title: "Product", hidden: true, groupHeaderTemplate: "${ value }" },

{ field: "Name", title: "Investment" },

{ field: "Commission", title: "Commission", format: "{0:p0}", width: 100, type: "number", step: 0.01 },

{ command: ["edit", "destroy"], title: " ", width: 200 }],

editable: "inline"

});

Grid

answered on 30 Oct 2012

0 answers

94 views

HTML 5 Presentation

do you think it possible to create something like http://www.themobileplaybook.com/en-us/ using Kendo as a framework and woudl it be relatively easy for a moderate programer.

Thank You
Ralonzo

General Discussions

asked on 30 Oct 2012

0 answers

99 views

TreeView control is hanged in drg and drop

Hi ,

I am facing a problem in using kendo ui treeview control in drag and drop.
The drag and drop functionality is not working smoothly, i am using on demand data for binding child node by HierarchicalDataSource.
The problem is similar as in http://jsbin.com/itoqiz/6
I am attach aching a screenshot, please have a look.
Please let me know your feedback on the same as soon as possible.

Many-Many thanks to you in advance

TreeView

asked on 30 Oct 2012

0 answers

162 views

data-model attribute support in navbar (or layout) for automatic data binding

Apparently only views support the data-model attribute for automatic bindings. Please confirm.

I have come across the requirement to set the view title in the navbar according to the data displayed in the view which should be IMO a fairly common requirement. For example, when editing a contact, the navbar would display the contact full name. In such use case, you would use the data-model attribute and get automatic binding on the view, but you would have to explicitly bind the navbar through kendo.bind in your code to get binding on the view title.

It would be nice if the navbar (or the layout) could also support the data-model attribute. I would be happy to post a feature request on uservoice once this is confirmed, but I have no more votes available.

NavBar

asked on 30 Oct 2012

2 answers

91 views

On closing the editor, it doesn't "clean up" - there's a graphical error.

Hi,

This issue only happens in Chrome.

When I close the editor, some of the editor is still shown, the graphics doesn't clean up.

A recording of the problem

Any idea?

Thanks
Mojo

DatePicker

answered on 30 Oct 2012

0 answers

135 views

How to transfer parameters from a kendo grid

Hellow,
I'm new using of Kendo UI and I have a problem when I wanna transfer parameters from a click on the text in the row of the Kendo grid. Well, I don't really know to explain (I'm french ^^').
What I would like is :
I have a kendo grid with a template column. When I click on a lign of this column, I want the grid to recup few parameter and put them into the url to redirect me on another page where is a new kendo grid which display informations relative at the lign selected before.

Below a part of my code :

$("#grid").kendoGrid({

dataSource: dS,

columns: [{ title: "Copropriété", field: "Lib", template: "<a href='HistoriqueCompte.html'> ${Lib} <a/> " },

{ title: "Agence", field: "RaisonSocialeLicence" },

{ title: "Solde", field: "Solde" }]

});

Do you have any idea about what I have to do to get what I want ?

EDIT Fif' : SOLUTION

"<a href='HistoriqueCompte.html?CodeCopro=${CodeCopro}&IndGmcCopro=${IndGmcCopro}&IdAgence=${IdAgence}' >${Lib}<a/> " }

Grid