Questions on Kendo UI for jQuery Forum

1 answer

363 views

Using Glyphicons

Hi,

I have recently purchased the glyphicons PRO icon set (http://glyphicons.com/) and I am now trying to add the icons to my KendoUI Mobile app. I've tried to add them using the instructions laid out in Creating Custom Icons doc (http://docs.kendoui.com/getting-started/mobile/tabstrip) with the png icons but the icons look stretched and appear in different sizes to each other.

I've noticed that the default icons for KendoUI are in a png file with an svg mask file used to extract each icon from the file. Glyphicons comes with an svg file which contains all the icons. I was wandering how to extract the Glyphicon icons in the same way as KendoUI extracts the default icons.

How are the default icons extracted and added to allow them to be referenced through the data-icon attribute? How can I extract the Glyphicon icons from the svg file and reference them through the data-icon attribute?

Thanks,
Thomas

TabStrip (Mobile)

answered on 10 Oct 2012

1 answer

276 views

Error Object doesn't support property or method '_observe' using the kendo grid

Hello, I'm having the following problem to implement the kendo grid:

This is my code in client side:

   $(document).ready(function () { 
      var dataSource = kendo.data.DataSource({             
        transport: {                 
            read: {                     
                url: '@Url.Action("GetAll", "Company")',                     
                dataType:"json"                
            },             
            schema: {                 
                data: "Companies",                 
                total: "TotalCount",                
                model: {                                      
                    id: 'CompanyID',                     
                    fields: {                         
                        CompanyID:{                             
                            type: 'number',                             
                            nullable: true,                             
                            editable:false                         
                        },                         
                        Name:{                                              
                            type: 'string'                         
                        },                         
                        Rif:{                                              
                            type: 'string'                           
                        },                         
                        Telephone:{                             
                            type: 'string'                         
                        },                         
                        FisicalAddress:{                                             
                            type: 'string'                         
                        }                     
                    }               
                }             
            },             
            pageSize: 1         
        });         

        $("#grid").kendoGrid({             
            dataSource: dataSource,             
            height: 250,             
            scrollable: true,             
            sortable: true,             
            filterable: true,             
            pageable: {                 
            input: false,                 
            numeric: true             
          },             
            columns: [ { field: "CompanyID",  title: "#",  width: 150 },
                       { field: "Name", title: "Name", width: 150   },                            
                       { field: "Rif", width: 150 },
                       { field: "Telephone", title: "Telephone"},
                       {  field: "FisicalAddress", width: 300 }]
    });
});

and this is my code in server side:

public JsonResult GetAll(
{            
    var companies = _companyService.GetAll().Select(c => new { c.CompanyID, c.Name, c.Rif, c.Telephone, c.FiscalAddress});
     return Json(new { Companies = companies, TotalCount = companies.Count()},JsonRequestBehavior.AllowGet);
}


Error description in file kendo.web.min.js or kendo.data.min.js

Microsoft JScript runtime error: Object doesn't support property or method '_observe'



Any idea what may be happening? Thank you for help

Grid

answered on 10 Oct 2012

3 answers

132 views

Costum popup editor can't show

i want to make popup editor with additional field, look it :
script grid kendo :

....

editable: { mode: "popup", template: kendo.template($("#popup_editor").html()) },

height: 450, filterable: true, sortable: true, pageable: true,

toolbar: [{text: "Add data", name: "create"}],

columns: [

{ field: "name",title: "Name", filterable: true },

{ field: "dtcreate",title: "Date create", filterable: true },

{ command: [{text:"Edit", name:"edit"}, {text:"Delete",name:"destroy"}], title: " ", width: "160px" }

]

script form popup :

<script id="popup_editor" type="text/x-kendo-template">

<div class="k-edit-label"><label for="name">Name</label></div>

<input type="text" class="k-input k-textbox" name="name" data-bind="value:name">

<div class="k-edit-label"><label for="publish">Publish</label></div>

<input type="text" class="k-input k-textbox" name="publish" data-bind="value:publish">

<div class="k-edit-label"><label for="dtcreate">Date Create</label></div>

<input type="text" name="dtcreate" data-type="date" data-bind="value:dtcreate" data-role="datepicker" />

</script>

So the problem is popup editor can't showed, why?

Thank,

Grid

answered on 10 Oct 2012

6 answers

590 views

Google maps + Kendo UI

We are running into an issue with Google Maps and Kendo UI where the pinch to zoom stops working correctly and as you move the map the tiles stop loading. Leaving my same code if I remove Kendo UI everything works correctly. Has anyone ran into this issue? If so do you have any work arounds?

General Discussions

answered on 10 Oct 2012

1 answer

215 views

Move grid rows between two grids?

Does anyone know of an example where you can move rows between two grids (left/right)? In the attached image I've got two select boxes but I want to turn them into grids with a row event that moves them left or right. Any pointers would be greatly appreciated.

Grid

answered on 10 Oct 2012

1 answer

129 views

Feature in Bubble Chart

Hi,

I have downloaded kendoui.trial.2012.2.710. I went to the examples of Bubble Chart.

Can we have the below features if we buy it?

Selection Tool
Zoom In/Out in the selected area from the chart
Drag the area (like in Google Map).

Charts

answered on 10 Oct 2012

4 answers

128 views

Navigate event

In the navigate event how do you tell what month the user naviagted to?

Calendar

answered on 10 Oct 2012

1 answer

97 views

Make date bold in datetime picker

Hi,

Is there a way I could make the date part from the date time picker bold?

I have attached an image with what I would like to do.

Thank you,

DatePicker

answered on 10 Oct 2012

0 answers

91 views

Icons in a Grid are old after sorting

Hi,

I have a column in the grid that contains icons.These icons are updated properly on a button click , the latter is outside the grid.
However if I now sort the grid, the icons are not updated. I used the below code to update an Icon in a button click event.

$("#Img_" + ModId).attr("src", $.url("Content/images/Active.png"))

Is this a problem with my code or sort function ? Please let me know.

Grid