Questions on Kendo UI for jQuery Forum

1 answer

143 views

How can we Configure the ComboBox within the Grid.

Hello,

I would like to know, how can we place comboBox within the Grid cell.

Please look at the codes

<!DOCTYPE html>

<html>

<head>

<title></title>

<script src="js/jquery.min.js"></script>

<script src="js/kendo.all.js"></script>

<link href="css/kendo.common.css" rel="stylesheet" />

<link href="css/kendo.default.css" rel="stylesheet" />

</head>

<body>

<div id="example" class="k-content">

<div id="grid"></div>

<script>

$(document).ready(function (){

dataSource = new kendo.data.DataSource({

transport: {

read:{

url: "http://localhost/kendo-prac/data/employees.php",

dataType: "jsonp"

},

update: {

url: "http://localhost/kendo-prac/data/update.php",

dataType: "jsonp"

},

destroy: {

url:"http://localhost/kendo-prac/data/delete.php",

dataType: "jsonp"

},

parameterMap: function(options, operation) {

if (operation !== "read" && options.models) {

return {models: kendo.stringify(options.models)};

}

},

batch: true,

pageSize: 10,

schema: {

model: {

id: "ID",

fields: {

Name: { editable: false, nullable: false },

Title: { editable: true, nullable: false },

URL: { editable: true, nullable: false },

FTP: { editable: true, nullable: false },

Status: { type: "string", editable:false},

Remarks: { editable: false, nullable: false }

}

});

$("#grid").kendoGrid({

dataSource: dataSource,

navigatable: true,

pageable: true,

height: 650,

scrollable: true,

sortable: true,

toolbar: ["save", "cancel"],

columns: [

{ field: "Name", width: "60px" },

{ field: "URL", width: "350px" },

{ field: "Title", width: "150px" },

{ field: "FTP", width: "150px" },

// { field: "Date", width: "150px" },

// { field: "Status", width: "100px" },

{field: "Status", width:"150px", template: function(container, options) {

$('<input name="' + options.field + '"/>').appendTo(container).kendoComboBox([

{text: "Item1", value: "1"},

{text: "Item2", value: "2"}

]);

}

},

{ field: "Remarks", width: "50px",template:('<a href="http://www.xyz.com?eid=#=ID#" target="_blank">#=Remarks#</a>')},

{ command: "destroy", title: "Delete", width: "100px" }],

editable: true

});

</script>

</div>

</body>

</html>

We just want to implement the comboBox, grid can also update the data onchange of combobox. I tried to implement it on this style (please look below.), Using this code we can not able to update or save the data into database.

template: ('<select id="combobox" name="Status"/><option value="#=Status#">#=Status#</option><option value="Added">Added</option><option value="Rejected">Rejected</option></select>')

And it also not same as Kendo ComboBox. Please provide me some information about this.

Thanks

Pps

Grid

answered on 16 Mar 2012

1 answer

296 views

ComboBox in in-line editing in Grid

Hi All,

Does anyone here successfully tried in in-line editing where combobox is used?

Thank you

Grid

answered on 16 Mar 2012

1 answer

203 views

Upload issues in IE

I have a kendo upload on my page and it works fine in firefox but when i test in IE i get

'{"Unexpected end of MIME multipart stream. MIME multipart message is not complete."}'

my server handler is:

[WebInvoke(Method = "POST", UriTemplate = "/{id}")]

public void Upload(HttpRequestMessage request, string id)

{

var task = request.Content.ReadAsMultipartAsync();

task.Wait();

and it fails at the Read part bu as i say it works fine with FF any ideas?

Upload

answered on 16 Mar 2012

3 answers

1.4K+ views

Grid Column width issue

Hi,

Can we specify width for individual columns in column definition? I tried giving width in definition this way:

_SearchColumns = [{
            field: "docId",
            title: "DOC ID",
           width: "100px"
        },{
            field: "docType",
            title: "DOC TYPE",
           width: "80px"
        }]

But, it is working only when i give scrollable true. I dont want to give scrollable true. Just want to adjust the column widths as there are so many columns in the grid.Also when the width is getting applied, the text is getting cropped. Is there any option to resize the column so that the text becomes visible? Please suggest.

Thanks,
Khushali

Grid

answered on 16 Mar 2012

2 answers

414 views

Change default text in grid filter menu

Hello,

How I can replace the default text in the filter menu? i.e. 'and', 'or', 'is equal to', etc, to: 'y', 'o', 'igual a', etc (spanish).
Thanks

Grid

answered on 16 Mar 2012

1 answer

6.5K+ views

Datasource "success" event?

I'd like to display a message when the changes of a datasource are successfully saved in database, is there a 'success' event as the 'error' event?

Data Source

answered on 16 Mar 2012

0 answers

58 views

How to set height of the grid component according to number of records on it?

i have one grid with the following setting height :500px , pageSize: 10 scrollable: false & pageable: true

That grid contains 13 records.

means

first page contains 10 records and second page contains 3 records but on second page after 3 record , it displaying blanks area or white spaces on it.

is it possible to set automatically or dynamically height of grid according to number of existing records?

Please assist me to resolve this issue.

Thanks in Advance.

Grid

asked on 16 Mar 2012

1 answer

298 views

Vertical Menu

Hi Is there a way to make the menu vertical?

Thanks~

Menu

answered on 16 Mar 2012

1 answer

165 views

Neet to replicate jQuery draggable "snap to" demo

Hello,

We need to replicate the snap to boxes functionality that is available here:
http://jqueryui.com/demos/draggable/#snap-to

Does anybody have any demo to do this with Kendo?

We can do it with jQuery, but the problem is that it won't drag on the iPad and the Kendo one does work on the iPad.

Or what is it in Kendo, that makes the jQuery draggableobject work on mobile?

Thanks!

Drag and Drop

answered on 16 Mar 2012

1 answer

197 views

Refresh detail grid

I have a master/detail grid, editing rows is done by displaying a kendo window. When I close it I call myDataSource.fetch(). It works fine for the master grid/datasource (modifications done in the window are displayed in the grid); but it doesn't work when I edit a detail row (by calling myDetailDataSource.fetch()). Is it a bug or a normal behaviour?
(detail data can be refreshed by calling myDataSource.fetch() but in this case I lose the expanded row...)

Grid

answered on 16 Mar 2012