Telerik Forums
Kendo UI for jQuery Forum
1 answer
105 views
Good morning.

I have a trouble using Kendo to make indexed list with local data for over a week.
The Kendo Music Store shows it, but it is for the remote data source. What I want is using local data.
I managed to make one, but it doesn't work. Only after resizing once, it works.
I tried to find a solution and stayed up all night over a week, but did not find it.
So, I put a point on the library files (kendo.min.js, etc).. as the one used in Kendo Music Store is not a recent one.
So I tried to use the older versions of kendo js files, but I can't find them neither.

I hope the master kendo programmers help me with this, and especially with the indexed list with local data problem.
Thank you.
Alexander Valchev
Telerik team
 answered on 12 Aug 2013
1 answer
162 views
Good morning.

I have a trouble using Kendo to make indexed list with local data for over a week.
The Kendo Music Store shows it, but it is for the remote data source. What I want is using local data.
I managed to make one, but it doesn't work. Only after resizing once, it works.
I tried to find a solution and stayed up all night over a week, but did not find it.
So, I put a point on the library files (kendo.min.js, etc).. as the one used in Kendo Music Store is not a recent one.
So I tried to use the older versions of kendo js files, but I can't find them neither.

I hope the master kendo programmers help me with this, and especially with the indexed list with local data problem.
Thank you.
Alexander Valchev
Telerik team
 answered on 12 Aug 2013
1 answer
146 views
Is kendo UI compatible with jquery mobile?
I want to use a date widget(mobile friendly, I know we have one in kendo as well), but it uses jquery mobile 1.3.2
I see a weired behavior, right after the login, i get redirected to the IIS7 welcome.png image.  So basically i cannot access my website.

Thanks
Kiril Nikolov
Telerik team
 answered on 12 Aug 2013
1 answer
262 views
When there are multiple category axes and negative values are present on a column chart, the axis labels collapse down to one line rather than being stacked as normal.  For example:

element.kendoChart({
seriesDefaults: {
type: "column"
},
series: [{
name: "Sales",
data: [10, 20, -0.5, 0, 100, 0],
}],
valueAxis: [{
majorGridLines: { visible: false },
title: { text: "Sales" },
}],
categoryAxis: [{
categories: ["Order", "Invoice", "Credit Memo", "Order", "Invoice", "Credit Memo"],
majorGridLines: { visible: false },
}, {
categories: ["Item", "Resources"],
line: { visible: false },
majorGridLines: { visible: false },
title: { text: "Type & Document Type" },
}],
});

Note that the 2 category axes labels simply collapse on top of one another with the words "Item" and "Invoice" on top of one another and the words "Resources" and "Invoice" on top of one another.  If I change the 3rd value in the series data from -0.5 to just 0.5, then the problem goes away and the 2 category axes are displayed correctly, one above the other.

This behavior seems like a bug since the axes are displayed correctly when the chart contains just positive values, but not if a negative value is present.  Is there some setting I'm missing?

Regards,
Hughes
Iliana Dyankova
Telerik team
 answered on 12 Aug 2013
1 answer
168 views
Does the DS have any way for me to capture and handle jsonp errors?

Is there a best practice?

I've tried this, but nothing happens (no alerts)

dataSource: new kendo.data.DataSource({
                    serverFiltering: true,
                    transport: {
                        read: {
                            url: function (e) {
                                var value = $("#activityTypeBox").data("kendoDropDownList").value();
 
                                if (value != "") {
                                    return "http://site/api/activities/getByType/id/" + value + "/format/jsonp"
                                }
                            },
                            dataType: "jsonp",
                            jsonpCallback: 'myCallback'
                        },
                        parameterMap: function (data, type) {
 
                        }
                    },
                    schema: {
                        errors: "error" // ex: twitter's response is { "error": "Invalid query" }
                    },
                    error: function (e) {
                        alert("Problem populating the curriculum db activities based on that type");
                    }
                })

Atanas Korchev
Telerik team
 answered on 12 Aug 2013
2 answers
177 views
Hi,

I'm trying to bind the grid with a call from WebApi controller based on the project described in this blog post http://www.kendoui.com/blogs/teamblog/posts/12-11-29/the_facts_on_using_kendo_ui_with_asp_net_webapi.aspx . It's actually hitting the method in ApiContoller but the dataRequest is coming as null from and it's never hitting the ModelBinder code.

Code snippets from cshtml and controller are below:
cshtml:
  @(Html.Kendo().Grid<ABC>()
                          .Name("grdEngagements" + Model.UniqueId)
                          .HtmlAttributes(new { Class = "telerikGrid" })
                          .AutoBind(Model.GridAutoBind)
                          .Columns(columns =>
                              {
                                  columns.Bound(p => p.Prop1).HeaderTemplate("Header").Width(80);
                                  columns.Bound(p => p.Prop2).Width(280);
                                  columns.Bound(p => p.Prop3);
                              })
                          .Pageable(p => p.Messages(m => m.Display("{0} to {1} of {2}")))
                          .Sortable()
                          .Scrollable()
                          .Events(e => e.DataBound("gridNoDataMsgDisplay"))
                          .DataSource(dataSource => dataSource
                                                        .Ajax()
                                                        .Model(model => model.Id(p => p.EntityId))
                                                        .Sort(s => s.Add(t => t.Prop3).Descending())
                                                        .Read(read => read
                                                                          .Action("ApiControllerAction", "ApiController")
                                                                          .Type(HttpVerbs.Get).Data("grdEngagementsAjaxReadAdditionalFilterData" + Model.UniqueId))
                          ))

Controller

 //see telerik sample app Grid CustomAjaxBinding for details on how this works
        public JsonResult ApiControllerAction([ModelBinder(typeof(ModelBinders.DataSourceRequestModelBinder))] DataSourceRequest dataSourceRequest, string searchText, bool includeAll)
        {
            var request = dataSourceRequest.ToDataRequest();  // blows up at this point because dataSourceRequest is null
            var sortText = GetSortString(request.Sorts);
            return service.GetABC(request, searchText, sortText, includeAll)
                .ToKendoJsonResult<ABCServer, ABC>();
        }
Manoj
Top achievements
Rank 1
 answered on 12 Aug 2013
1 answer
132 views
Hey guys,
I'm new to Kendo UI. This is basically my first post on forum. I'm on trial version now. I have  a few questions about customizing of column charts.

This is the database in MS SQL that I'm mapping.
[url=http://ifotos.pl/zobacz/1png_neepeqr.png/][img]http://s6.ifotos.pl/mini/1png_neepeqr.png[/img][/url]
This is my controller:
public ActionResult Index()
{
IList<CzasPracyMaszyn> CzasPracyMaszyn = _repository.GetCzasPracyMaszyn();
return View(CzasPracyMaszyn);
}
 
My model:
public class CzasPracyMaszyn
{
public virtual int ID { get; set; }
public virtual string STANOWISKO { get; set; }
public virtual int CZASPRACY { get; set; }
}

and my view:
@model IEnumerable<CMMS_Aplixcom_alfa.Models.CzasPracyMaszyn>

@(Html.Kendo().Chart(Model)
      .Name("aa")
        .Title("aaa")
      .Series(series => {
          series.Column(model => model.CZASPRACY).Name("Czas Pracy");
      })
      .CategoryAxis(axis => axis
          .Categories(model => model.STANOWISKO)
 
        )
)
This is the chart I'm getting.
[url=http://ifotos.pl/zobacz/2png_neepeqa.png/][img]http://s6.ifotos.pl/mini/2png_neepeqa.png[/img][/url]

Now I am able to turn of/ turn on Columns using the box on the right. But I would like to do that for each record in the database separately.




Iliana Dyankova
Telerik team
 answered on 12 Aug 2013
15 answers
136 views
Hello,

The loading image don't stop when endless scrolling is used: http://jsbin.com/eqisip/17/edit

I know that  something changed in the behaviour. But how can I get this smooth?
And in some cases my list has 2 items. Then I also see the loading image.

Thanks,
Martin
Petyo
Telerik team
 answered on 12 Aug 2013
1 answer
527 views
Context: MVC 4 in VS 2102 with Update 3.  Kendo Version: 2013.1.319

I'm developing a Query Wizard web-page. The Index method of the "WorkOrder" controller generates the initial page with the search Criteria (partial view) showing standard filter parameters and a Search button. The search button activates JS which then uses the parameters in the Criteria to download a QueryInfo object (using getJSON). This object represents a stored query in our database. The business layer caches this QueryInfo object in the Session cache. Then, the JS loads the Kendo Grid by loading a partial view into an empty div element (using .load()).

Here is the .cshtml for the Grid:
@model AssetPoint.TabWare.Central.Query.QueryInfo

@(Html.Kendo().Grid<System.Data.DataRowView>()
    .Name("QwGrid")
    .HtmlAttributes(new { style = "height:430px;" })
    .Pageable(pager => pager.Messages(messages => messages.Empty("No data")))
    .Sortable()
    .Scrollable()
    .Filterable()
    .Columns(columns =>
    {
        foreach (AssetPoint.TabWare.Central.Query.IQwInquiryColumn column in Model.ColumnsUsed)
        {
            var gridCol = columns.Bound(column.Name)
                .Title(column.LabelText)
                .Width(InquiryColumn.ComputeWidth(column));
            if (InquiryColumn.HasFormat(column))
                gridCol.Format(InquiryColumn.GetFormat(column));
        }
    })
    .Resizable(b => b.Columns(true))
    .DataSource(dataSource => dataSource
        .Ajax()
        .Read(read => read
            // Set the action method which will return the data in JSON format
            .Action("GetResultsData", "WorkOrder", new { area = "QueryWizard" }) 
            // Specify the JavaScript function which will return the parameter data
            .Data("getParameters") 
        )
        .ServerOperation(true)
    )
)
As you can see, from the dataSource, we have a GetResultsData method which returns the resulting DataTable as a Json object. My plan was to the call the 'refresh()' method on the kendoGrid object's dataSource in the load success function.

My first problem was the when I accessed the 'QwGrid' element after the load, it was not a kendoGrid object, so I tried calling the kendoGrid() method on the element. This does transform the <div>  element into a kendoGrid object

Here is pertinent JS which is located in the very last element before the </body> element, in a
<script type="text/javascript"> $(document).ready(function () {}); </script> block :
function fillGrid()
{
    // get grid definition for currently selected query
    $('#QwResults').load('@Url.Action("Grid","WorkOrder", new { area = "QueryWizard" } )', 
     function (response, status, xhr)
     {
        if (status == "error")
        {
              alert("An error occurred while loading the Grid control.");
        }
        else
        {
            alert("A Grid definition was returned.");

            // bind data to grid
            var grid = $('#QwGrid').kendoGrid();
    
            if (grid != undefined)
            {
                grid.dataSource.fetch();
            }
        }
    });

    window.Parameters = {
        WorkOrder: $("#WorkOrder").val(),
        Description: $("#Description").val(),
        Equipment: $("#Equipment").val(),
        InquiryName: queryInfo.InquiryName,
        Query: queryInfo.Name,
        Criteria: {}
    };

    if (queryInfo.AskAtExecution)
    {
        //    Walk down the inputs in the window, grabbing their names
        //    and values to provide as criteria.  
        $('#window input[data-QW-field]').filter(function () {
            var x = $(this);
            window.Parameters.Criteria[x.attr("data-QW-field")] = x.val().toString();
        });
    }
}

function getParameters(data)
{
     return window.Parameters;
}
Console Errors (in Chrome):
1. Uncaught ReferenceError: getParameters is not defined
2. Uncaught TypeError: Cannot call method 'fetch' of undefined WorkOrder:261

Questions:
1. Why is the getParameters method that I am providing not found?

2. Why is the datasource undefined in the kendoGrid object?

3. Is there a better way to do this? Note: Each query has it's own set of columns and the results are delivered in a DataTable.

Thanks,
Russ
Atanas Korchev
Telerik team
 answered on 12 Aug 2013
3 answers
968 views


 

 

 
Hi, 
 Is possible to set selected values of the multiselect which are not part of the current multiselect client values:  currently, bounded data  of the multilist


When working  with datatasource  which is OData Service, not all data is brought to the client.(All the data is found on the server).  But we still need to mark the selected values of the
multilist. Part of them is not on the client currently

Thanks,

 
Atanas Korchev
Telerik team
 answered on 12 Aug 2013
Narrow your results
Selected tags
Tags
Grid
General Discussions
Charts
Data Source
Scheduler
DropDownList
TreeView
MVVM
Editor
Window
DatePicker
Spreadsheet
Upload
ListView (Mobile)
ComboBox
TabStrip
MultiSelect
AutoComplete
ListView
Menu
Templates
Gantt
Validation
TreeList
Diagram
NumericTextBox
Splitter
PanelBar
Drag and Drop
Application
Map
ToolTip
Calendar
PivotGrid
ScrollView (Mobile)
Toolbar
TabStrip (Mobile)
Slider
Button (Mobile)
Filter
SPA
Drawing API
Drawer (Mobile)
Globalization
LinearGauge
Sortable
ModalView
Hierarchical Data Source
Button
FileManager
MaskedTextBox
View
Form
NavBar
Notification
Switch (Mobile)
SplitView
ListBox
DropDownTree
PDFViewer
Sparkline
ActionSheet
TileLayout
PopOver (Mobile)
TreeMap
ButtonGroup
ColorPicker
Pager
Styling
Chat
MultiColumnComboBox
Dialog
DateRangePicker
Checkbox
Timeline
Drawer
DateInput
ProgressBar
MediaPlayer
ImageEditor
TextBox
OrgChart
Accessibility
Effects
PivotGridV2
Licensing
ScrollView
Switch
TextArea
BulletChart
QRCode
ResponsivePanel
Wizard
CheckBoxGroup
Localization
Barcode
Breadcrumb
Collapsible
MultiViewCalendar
Touch
RadioButton
Stepper
Card
ExpansionPanel
Rating
RadioGroup
Badge
Captcha
Heatmap
AppBar
Loader
Security
TaskBoard
Popover
DockManager
TimePicker
FloatingActionButton
CircularGauge
ColorGradient
ColorPalette
DropDownButton
TimeDurationPicker
ToggleButton
BottomNavigation
Ripple
SkeletonContainer
Avatar
Circular ProgressBar
FlatColorPicker
SplitButton
Signature
Chip
ChipList
VS Code Extension
AIPrompt
PropertyGrid
Sankey
Chart Wizard
OTP Input
SpeechToTextButton
InlineAIPrompt
StockChart
ContextMenu
DateTimePicker
RadialGauge
ArcGauge
AICodingAssistant
SmartPasteButton
PromptBox
SegmentedControl
LLM Kit
+? more
Top users last month
Simon
Top achievements
Rank 2
Iron
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Marco
Top achievements
Rank 4
Iron
Iron
Iron
Grant
Top achievements
Rank 3
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Simon
Top achievements
Rank 2
Iron
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Marco
Top achievements
Rank 4
Iron
Iron
Iron
Grant
Top achievements
Rank 3
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?