Telerik Forums
Kendo UI for jQuery Forum
5 answers
522 views
Hello, I want to make a Stacked Bar/Column Chart in ASP MVC.
I can't reproduce the example: http://demos.kendoui.com/dataviz/bar-charts/grouped-stacked-bar.html with Binding.
Then I modified the example in: http://demos.kendoui.com/dataviz/bar-charts/grouped-data.html adding Stack(true) in the series definition.
@model IEnumerable<SampleProject.GraphValueModel>
 
@(Html.Kendo().Chart(Model)
        .Name("chart")
        .Title(title => title.Position(ChartTitlePosition.Top).Text("Some Customers"))
        .DataSource(dataSource => dataSource
            .Read(read => read.Action("ChartForAnything", "Home"))
            .Group(group => group.Add(model => model.ColumnOrGroupName))
            .Sort(sort => sort.Add(model => model.AxisXValue).Ascending())
        )
        .Series(series => {
            series.Column(model => model.IndexValue, model => model.Color)
                .Name("close")
                .GroupNameTemplate("#= group.value #").Stack(true).Labels(label => { label.Position(ChartBarLabelsPosition.Center).Visible(true).Background("Transparent").Format("p1").Color("#FFFFFF"); });
        })
        .Legend(legend => legend
                .Position(ChartLegendPosition.Top)
            )
        .ValueAxis(axis => axis.Numeric()
            .Labels(labels => labels.Format("p2").Skip(1))
            .Axis.Max = 1.0f)
            .CategoryAxis(axis => axis
            .Categories(model => model.AxisXValue)
            .Labels(labels => labels.Format("MMM"))
        ))
The model is:
public class GraphValueModel
{
        public DateTime AxisXValue { get; set; }
        public string SerieName { get; set; }
        public object IndexValue { get; set; }
        public string Color { get; set; }
        public string ColumnOrGroupName { get; set; }
}
Everything is working, but that is the correct approach?

I have a issue with the color of the Legend Item, maybe because the Item is a Group.

The result is:
http://s8.postimage.org/4udwdfixh/Legend_Item_Color.png

Iliana Dyankova
Telerik team
 answered on 12 Feb 2014
1 answer
100 views
I've been exploring the use of a scrollview on the default page of our app. I'm trying to scale the image to 100% of the device width. This can easily be done, however, the height is the hang up. Either my image gets cut off and pager is behind the image if my data-content-height="" is set too low, or the pager appears too low in the screen. There has to be an easier way to do this. I have experimented with using @media queries, but it seems to be a bit quirky and to make it perfect for every device is a very intensive task. Is there a good example of how this is done out there?
Alexander Valchev
Telerik team
 answered on 12 Feb 2014
2 answers
123 views
Hello
I have a question  about code extraction and license.

I'm using MVC complete, but on server side I'm not using any wrappers. Just code related to parsing request e.g. from grid. Nothing to generate javascript.

Because of that I would like to extract code related to that part like:
DataSourceRequest,
Extension -> ToDataSourceResult

I would also like extend extensions to support async (ToDataSourceResultAsync) for entity framework 6+

I know there is behind a bit more classes and methods.

My question is if I can do that without breaking license. And if yes, is there any place I can put such extracted code to share with other licensed Kendo users.

Kind Regards
Marcin
Deni
Telerik team
 answered on 12 Feb 2014
1 answer
357 views
Is there any way we can resize the gauge with css media queries for our responsive websites?
Iliana Dyankova
Telerik team
 answered on 12 Feb 2014
5 answers
159 views
I've implemented a list view that works great on the Device Simulator and Work Great on All Android devices and Iphones. But when I'm testing it on an Ipad it's broken.

So when I click in the search box the keyboard shifts the window up and the user can't type in the search box. Is there a fix for this? 

Here is the HTML for my List View:

<!-- Best in KLAS - Vendor View. -->
<div id="best-in-klas-vendors-view"
       data-role="view"
      data-layout="drawer-layout"
      data-model="klas.bestInKlasVendorsViewModel"
      data-show="klas.bestInKlasVendorsViewModel.getVendors"
     data-title="Vendors">
<ul id="vendors-list-view"></ul>
</div>



My script for initializing the Kendo Mobile List View:

$vendorsListView.kendoMobileListView({
template: $('#best-in-klas-vendors-template').text(),
dataSource: new kendo.data.DataSource({
type: 'json',
transport: {
read: vendorsUrl
}
}),
filterable: {
field: 'SearchField',
operator: 'contains'
},
click: function (e) {
 ..
}
});

Kiril Nikolov
Telerik team
 answered on 12 Feb 2014
3 answers
451 views
Hi,

I have a field with all values as null. 
The resulting aggregates as calculated by the datasource client side  and returned by calling aggregates() shows 0 for average, max and sum, but for min it returns null.

Is this a bug as my expectation is that if max, average and sum all default to 0 for when all null values then min should too?

Thanks
Euan
Rosen
Telerik team
 answered on 12 Feb 2014
1 answer
159 views
Hello,

I've been trying to implement a Recurrence Editor without using the scheduler control. 

1. Is it possible to map the recurrence editor with a Model to fill the properties and parse to an recurrence rule on the server? 

Is there also any documentation for working with this control without using the Scheduler? 
Vladimir Iliev
Telerik team
 answered on 12 Feb 2014
1 answer
80 views
Hi,

I am having problem in editor template in chrome and IE but works fine with Firefox.

Please see the attachement
Dimo
Telerik team
 answered on 12 Feb 2014
1 answer
203 views
With the code that follows, I am able to edit any record, but I cannot add a new record.  The popup window never appears and I get a javascript error "0x800a1391 - JavaScript runtime error: SupplierLocation is undefined".  

(grid code)

@(Html.Kendo().Grid<FastTrack.MVC.Models.ContractorLoadTicketModel>().Name("gridUnreconciledContractor").Columns(c =>
        {
            c.Bound(m => m.SupplierLocation).ClientTemplate("#= SupplierLocation.SupplierName #").Title("Supplier");
            c.Bound(m => m.SupplierLocation.LocationName).Title("Origin");
            c.Bound(m => m.TicketNumber).Title("Ticket #");
            c.Bound(m => m.ReceivedDate).Title("Date").Format("{0:MM/dd/yy}").HtmlAttributes(new { style = "text-align:right" });
            c.Bound(m => m.ProjectMaterial.MaterialName).Title("Material");
            c.Bound(m => m.Hauler.HaulerName).Title("Hauler");
            c.Bound(m => m.TruckNum).Title("Truck #").Width(75)
                .ClientFooterTemplate("Loads: #=count#")
                .FooterHtmlAttributes(new { style = "text-align:right" });
            c.Bound(m => m.Quantity).Title("Quantity").Format("{0:n2}").HtmlAttributes(new { style = "text-align:right" })
                .ClientFooterTemplate("Total: #=kendo.toString(sum, 'n2') #")
                .FooterHtmlAttributes(new { style = "text-align:right" });
        })
        .DataSource(d => d
            .Ajax()
            .ServerOperation(false)
            .Read(read => read.Action("GetUnreconciledContractorTickets", "TicketReconcile").Data("paramProjectKey"))
            .Create(update => update.Action("SaveTicket", "TicketReconcile"))
            .Update(update => update.Action("SaveTicket", "TicketReconcile"))
            .Destroy(update => update.Action("DeleteTicket", "TicketReconcile"))
            .Events(events => events.Sync("contractorTicketSaved"))
            .Aggregates(a =>
                {
                    a.Add(m => m.TruckNum).Count();
                    a.Add(m => m.Quantity).Sum();
                })
            .Model(model => model.Id(m => m.TicketKey))
        )
        .ToolBar(toolbar =>
        {
            toolbar.Create();
        }

(model)

public class ContractorLoadTicketModel
    {
        public int TicketKey { get; set; }
        public int ProjectKey { get; set; }
        [Display(Name="Supplier/Location")]
        public SupplierLocationModel SupplierLocation { get; set; }
        [Display(Name = "Ticket #")]
        public int TicketNumber { get; set; }
        [Display(Name = "Material")]
        public ProjectMaterialModel ProjectMaterial { get; set; }
        public HaulerModel Hauler { get; set; }
        [Display(Name = "Truck #")]
        public string TruckNum { get; set; }
        [Display(Name = "Date")]
        public System.DateTime ReceivedDate { get; set; }
        [Display(Name = "Date/Time")]
        public System.DateTime ReceivedDateTime { get; set; }
        public Nullable<decimal> Latitude { get; set; }
        public Nullable<decimal> Longitude { get; set; }
        public System.DateTime UploadTime { get; set; }
        public string EnteredByUser { get; set; }
        public string DeviceID { get; set; }
        public decimal Quantity { get; set; }
        public string Reconciled { get; set; }
        public bool HasImage { get; set; }
        public bool HasNote { get; set; }

        public ContractorLoadTicketModel()
        {
            SupplierLocation = new SupplierLocationModel();
            ProjectMaterial = new ProjectMaterialModel();
            Hauler = new HaulerModel();
        }
    }

(template)

@model FastTrack.MVC.Models.ContractorLoadTicketModel

@Html.HiddenFor(model => model.TicketKey)
@Html.HiddenFor(model => model.ProjectKey)

<div class="editor-label" >
    @Html.LabelFor(model => model.SupplierLocation)
</div>
<div class="editor-field">
    @(Html.Kendo().DropDownListFor(model => model.SupplierLocation).HtmlAttributes(new { style = "width:75%" })
.DataTextField("SupplierLocation")
.DataValueField("OriginKey")
.DataSource(d => d
    .Read("GetSupplierLocations", "DatabaseUtility")
    )
    )    @Html.ValidationMessageFor(model => model.SupplierLocation)
</div>

<div class="editor-label">
    @Html.LabelFor(model => model.ProjectMaterial)
</div>
<div class="editor-field">
    @(Html.Kendo().DropDownListFor(model => model.ProjectMaterial).HtmlAttributes(new { style = "width:75%" })
.DataTextField("MaterialName")
.DataValueField("MaterialKey")
.DataSource(d => d.Read(read => read.Action("GetProjectMaterials", "DatabaseUtility").Data("paramProjectKey")))
    )
    @Html.ValidationMessageFor(model => model.ProjectMaterial)
</div>

<div class="editor-label">
    @Html.LabelFor(model => model.Hauler)
</div>
<div class="editor-field">
    @(Html.Kendo().DropDownListFor(model => model.Hauler).HtmlAttributes(new { style = "width:75%" })
.DataTextField("HaulerName")
.DataValueField("HaulerKey")
.DataSource(d => d.Read(read => read.Action("GetHaulers", "DatabaseUtility")))
    )
    @Html.ValidationMessageFor(model => model.Hauler)
</div>

<div class="editor-label">
    @Html.LabelFor(model => model.TicketNumber)
</div>
<div class="editor-field">
   @Html.Kendo().NumericTextBoxFor(model => model.TicketNumber).Format("####").HtmlAttributes(new { style = "width:75%" })
    @Html.ValidationMessageFor(model => model.TicketNumber)
</div>

<div class="editor-label">
    @Html.LabelFor(model => model.ReceivedDateTime)
</div>
<div class="editor-field">
    @Html.EditorFor(model => model.ReceivedDateTime)
    @Html.ValidationMessageFor(model => model.ReceivedDateTime)
</div>

<div class="editor-label">
    @Html.LabelFor(model => model.TruckNum)
</div>
<div class="editor-field">
    @Html.EditorFor(model => model.TruckNum, new { style = "width:75%" })
    @Html.ValidationMessageFor(model => model.TruckNum)
</div>

<div class="editor-label">
    @Html.LabelFor(model => model.Quantity)
</div>
<div class="editor-field">
   @Html.Kendo().NumericTextBoxFor(model => model.Quantity).Decimals(2).HtmlAttributes(new { style = "width:75%" })
    @Html.ValidationMessageFor(model => model.Quantity)
</div>

<div class="editor-label">
    @Html.LabelFor(model => model.Latitude)
</div>
<div class="editor-field">
    @Html.Kendo().NumericTextBoxFor(model => model.Latitude).Decimals(8).Format("##.########").HtmlAttributes(new { style = "width:75%" })
    @Html.ValidationMessageFor(model => model.Latitude)
</div>

<div class="editor-label">
    @Html.LabelFor(model => model.Longitude)
</div>
<div class="editor-field">
    @Html.Kendo().NumericTextBoxFor(model => model.Longitude).Decimals(8).Format("##.########").HtmlAttributes(new { style = "width:75%" })
    @Html.ValidationMessageFor(model => model.Longitude)
</div>







Daniel
Telerik team
 answered on 12 Feb 2014
1 answer
340 views
I just upgraded my kendo ui to the latest version, however the line below the window title is lost. After some investigation, I found it's because the "margin-top" set to "-30px" on the kendo window title bar.  I made a fix by defining the following in my style sheet, but is this the right way to fix this issue?  Is there a way to customize how the margin-top is defined. 
.k-window-titlebar.k-header {<br>  margin-top:-31px<br>}
Iliana Dyankova
Telerik team
 answered on 12 Feb 2014
Narrow your results
Selected tags
Tags
+138 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?