Telerik Forums
Kendo UI for jQuery Forum
1 answer
47 views
Title says it ^

I want to use grids much like in the web examples: http://demos.kendoui.com/web/grid/index.html  only using Kendo Mobile, what is the right way to achieve this?
Yavor Georgiev
Telerik team
 answered on 16 Mar 2013
2 answers
427 views
From my backend it generate a treeview using a ul/li construction:

<ul id="treeView">
        <li data-uid="8f04cb75-1a2a-4c9b-95c6-4a44d963505c" data-parent="">Root
         <ul>        
<li data-uid="64ca06a9-72b3-4444-b951-f46e0378b26b" data-parent="8f04cb75-1a2a-4c9b-95c6-4a44d963505c" ">1.1
            <ul
        </li>
</ul>

However, when I take a look when after init the kendoui treeview, the data-uid's are all randomly recreated.

From there, I took a different approach and used the id attribute for the identifiying the node. However, when a node is drag & dropped the resulting node does not contain the id. Also when custom attributes are used for this purposes the Id of the node is gone.

This leave the treeview completely useless, since postingback to the server is impossible.

So the question is, howto preserve the id's??
David
Top achievements
Rank 1
 answered on 16 Mar 2013
5 answers
145 views
I am trying to have a editable grid, minimizing network traffic. The grid is only editied 1/20 page loads.
My data model is like this:
Items: ItemdID, ItemName
ItemSerials: ItemSerialID, ItemSerial, ItemID
Units: UnitID, ItemID, Unit
ItemRental: ItemRentalID, ItemID, ItemSerialID, UnitID, Quantity

There may be multiples serials, and Units for each Item.
The data comes from the backend as a Join: with the fields from all 4 tables.
I would like the grid to Show:
ItemName, SerialNumber, Units, Quantity
But need to save an ItemRental row.

Initially I had the table with an ItemID column, using a template which called a lookup function (getName(itemid)) which displayed the ItemName. In order for this to work, I had to pull the entire Items table into memory, so that the lookup function could use it.

The ItemSerials table is worse, as it has 100,000 serrals, but only a handful are applicable to each item. So in order to show SerialNumber, but have ItemSerialID as my value, I have to pull the whole table into memory too. Yes, for loading the drop-down-list I can use the selected item, and filter the fetched serials based on that, but in order to show SerialNumber, but have ItemSerialID  as my value field using template which alls function like the item name (getSerial(serialid), I need to have all in memory.

I would like to handle this by having all fields as part of my data model, then  only showing four mentioned, and hiding the Id columns. My drop downlist for ItemName woulld be on the item name field would then transport.read in all the items on creation of the first editor (dd list). The DDL would read in the whole Items table, be the editor for the ItemName column, but I would also need it to set the value in the ItemID column:  
I can get the itemID in my 'change' function for the DDL,  like this: e.sender.options.dataSource[e.sender.selectedIndex].ItemID, but then what do I do with it? How do I set the value of the hidden ItemID column?

Then another tricky part is when the Item is selected, I then need to cascade the DDL for the SerialNumber column based on ItemID, not on ItemName....

Is there a better way to solve this problem, and avoid pulling unecessary data into memory? I need to show employer bandwidth test in order to buy.

Thanks,
~S
Shea
Top achievements
Rank 1
 answered on 15 Mar 2013
0 answers
65 views
Hi guys,

1. Is there a way to adjust divs (height specifically) to the size of different mobile platforms using kendo? (perhaps a quicker way than with native js?) or with a css class maybe?

2. Essentially when the app starts up i want the divs to already be in the correct sizes. if I adjust programmatically, when is the best time to call the function? before the call to kendo? right after? the phonegap ready event? 


Gal
Top achievements
Rank 1
 asked on 15 Mar 2013
1 answer
129 views
Hi,

we want to use the grid with virtual scrolling enabled and aggregates in footers and group-footers. Our DataSource is a local Javascript array.

The Problem is:
The aggregate values change while scrolling down the grid. The values reflect the content of the visible selection. 

We want to freeze these aggregate values so they are the same as virtual scrolling would be disabled.

Is this possible?

The only solution that comes to my mind is that we fake server-side aggregates like in this example: http://jsfiddle.net/knWcJ/74/

But is there a simpler way?

Thanks for helping!

Tilo
Alexander Valchev
Telerik team
 answered on 15 Mar 2013
2 answers
75 views
Hey folks,

I was wondering if you might be able to explain why templates are behaving the way they are in our application since I'm a little lost on what is going wrong.  Using v2013.1.307, we are using the Routing component as well as Kendo Templates to create a SPA interface.  

With this in mind, we load the main views using a listview and templated li's, which works like a charm.  Everything loads and template data and inline script works as intended (alert is fired):

<li class="clearfix">
    <a href="\#/project/#: data.Id #">
        #
        var leadPhoto = data.parent().parent().photoFileNameForLead(data);
        alert("pl");
        if (leadPhoto) {#
            <img class="team-lead" data-bind="attr: {src: photoFileNameForLead}" />
        #} else {#
             <div class="team-lead icon-user">No Lead</div>
        #}#
        <header>
            ...
        </header>
    </a>
</li>
However, when clicking into the details for an item, the same exact template code appears as inline text within the html, so the template never gets picked up:

<article>
    <div class="resource-info">
        ...
    </div>
    <div class="resource-projects">
        <h3>Current Projects</h3>       
        <ul data-bind="source: getProjectsForActiveResource" data-template="resource-details-project"></ul>
        #
        alert("new resource");
        var leadPhoto = data.parent().parent().activeResource;       
        if (leadPhoto) {#
            <img class="team-lead" data-bind="attr: {src: photoFileNameForLead}" />
        #} else {#
             <div class="team-lead icon-user">No Lead</div>
        #}#
    </div>
    <button data-bind="click: saveActiveResource" class="save-button">Save</button>
</article>
So rather than seeing a distinct photo/decorate div and getting an alert, this just gets written directly into the document.

Is there a different behavior that we need to use in order to get these inline templates working in different scenarios?  The only difference I can see is that the second snippet is being loaded via the router > return a view, meanwhile the original <li> is being loaded by a Kendo component as individual templated items.  

Thanks!
-Evan
Evan Hutnick
Top achievements
Rank 1
 answered on 15 Mar 2013
1 answer
140 views
When using IE the resizable mouse cursor is not showing on my column headers because I also have filtering turned on.  In Chrome this is not a problem.

I went into kendo.common.min.css and set the .k-grid .k-resize-handle z-index to 99 to fix the problem.
Alexander Valchev
Telerik team
 answered on 15 Mar 2013
2 answers
199 views

I've got a complex ViewModel:
Ex:

public ExampleViewModel {
public string name {get;set;}
public string description {get;set;}
public List<ExampleViewModelSubItem> Items {get;set;}
// multiple other collections and properties.
}

So I have no problems getting a KendoUI DataSource reading from an MVC route

public JsonObject GetExample() {
return Json(getExample(), AllowJSONGet);
}

What I'm having issues with is how I should go about structuring the data source / pages.

If I had a simple ViewModel it would be easy, load the collection into a grid... Done.

But when I'm faced with a complex ViewModel (Object Graph) it's not quite so simple.

What I had in mind was to create a datasource that queries for the whole object and posts to the whole object.

And then widgets (grids for the lists) bound to each property of the Model.

IE the datasource for a grid might be: model.ObjectList or model.ObjectList.2ndObjectList

In regular MVC.net without the client side components it would be fairly simple.

Using Kendo controls makes it seemingly more complex.

My current plan of attack is to load the entire object graph as JSON into the page, handle client side, and hopefully post it back to the server.

Any suggestions for doing so would be great.

It looks like Kendo really wants to have an write method on the datasource that wants to pump the object back to the server immediatly, which is a problem when it's a grid and we don't want to submit the object until the user is done with their changes.

Thanks much.

Gary
Top achievements
Rank 1
 answered on 15 Mar 2013
1 answer
84 views
I'm starting to use the Kendo UI complete for ASP.NET MVC 4. 
I already created the database and the models that I need, but now I want to be able to handle (Index, Create, Delete, Details and Edit) the entities inside the content of each Tab. But I don't know how can I do this inside de tabstrip. (I started with the Internet Application template which has already a HomeController)

My code until now is:

/Views/Home/Index

@{
    ViewBag.Title = "Home Page";
}

@(Html.Kendo().TabStrip()
                .Name("tabstrip")
                .Items(items =>
                {
                    items.Add().Text("Students").Selected(true).LoadContentFrom("Index","Student"); //Add item with text "Students"
                    items.Add().Text("Teachers"); //Add item with text "Professores"
                    items.Add().Text("Schools"); //Add item with text "Escolas"
                })
)

/Controllers/StudentController

 public class StudentController : Controller
    {
        private MiniSIGEdb db = new MiniSIGEdb();

        //
        // GET: /Student/

        public ActionResult Index()
        {
            var students = db.Students.Include(s => s.Person).Include(s => s.School);
            return PartialView(students.ToList());
        }

        //
        // GET: /Student/Create

        public ActionResult Create()
        {
            ViewBag.Person_id = new SelectList(db.People, "id", "FirstName");
            ViewBag.School_id = new SelectList(db.Schools, "id", "City");
            return PartialView();
        }

        protected override void Dispose(bool disposing)
        {
            db.Dispose();
            base.Dispose(disposing);
        }
    }

/Views/Student/Index

@model IEnumerable<MiniSIGEweb.Models.Student>

@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>

<p>
    @Html.ActionLink("Create New", "Create")
</p>
<table>
    <tr>
        <th>
            @Html.DisplayNameFor(model => model.Course)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.Person.FirstName)
        </th>
        <th>
            @Html.DisplayNameFor(model => model.School.City)
        </th>
        <th></th>
    </tr>

@foreach (var item in Model) {
    <tr>
        <td>
            @Html.DisplayFor(modelItem => item.Course)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.Person.FirstName)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.School.City)
        </td>
        <td>
            @Html.ActionLink("Edit", "Edit", new { id=item.id }) |
            @Html.ActionLink("Details", "Details", new { id=item.id }) |
            @Html.ActionLink("Delete", "Delete", new { id=item.id })
        </td>
    </tr>
}

</table>


Until now I'm able to show de Index view (as partialview), but when I click in "Create New", the Create view is not rendered inside the tabstrip? How can I do this? 

Thanks in advance!
Daniel
Telerik team
 answered on 15 Mar 2013
2 answers
118 views
Hi,

As our project will require mixing currencies from various countries, I tried to use the "culture" configuration
when creating a NumericTextBox, such as follow:
$(this).kendoNumericTextBox({
    format: "c2",
    culture: "fr-BE"
});
I loaded the fr-BE culture JS file in my page.

The problem is when I try to type "10.42". (Belgian decimal character is a comma).
When I press the . on the numeric keypad, it adds both a dot and a comma, so it gives: "10.,42".

Whether I keep going like this, or I remove either the dot or the comma, it will automatically change to 1042.

Using kendo.culture("fr-BE") fixes the problem, but the question is, should I use kendo.culture() before creating each widget that uses a different culture ?
Or is that a bug ?

Thanks
Jean-François
Top achievements
Rank 1
 answered on 15 Mar 2013
Narrow your results
Selected tags
Tags
+? more
Top users last month
Jay
Top achievements
Rank 3
Iron
Iron
Iron
Benjamin
Top achievements
Rank 3
Bronze
Iron
Veteran
Radek
Top achievements
Rank 2
Iron
Iron
Iron
Bohdan
Top achievements
Rank 2
Iron
Iron
Richard
Top achievements
Rank 4
Bronze
Bronze
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Jay
Top achievements
Rank 3
Iron
Iron
Iron
Benjamin
Top achievements
Rank 3
Bronze
Iron
Veteran
Radek
Top achievements
Rank 2
Iron
Iron
Iron
Bohdan
Top achievements
Rank 2
Iron
Iron
Richard
Top achievements
Rank 4
Bronze
Bronze
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?