Telerik Forums
Kendo UI for jQuery Forum
2 answers
216 views
Hi,

i'm new using kendo ui ... and i try to use tabstrip (loading content using ajax).

Here's my example:
<body>
    <div id="kub-tabstrip">
        <ul>
            <li class="k-state-active">Willkommen</li>
        </ul>
    </div>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#kub-tabstrip").kendoTabStrip({
                contentUrls: [
                    '/Home/WelcomeDisplay'
                ]
            });
        });   
    </script>
     
    <a href="#" onclick="addTab()">neuer Tab</a>
</body>
Really easy ... and works.

I try to add a tab using javascript like this ...

01.<a href="#" onclick="addTab()">neuer Tab</a>
02.<script type="text/javascript">
03.        function addTab() {
04.            var tabStrip = $("#kub-tabstrip").kendoTabStrip().data("kendoTabStrip");
05.            tabStrip.append({
06.                text: "neuer Tab",
07.                contentUrl: "/Seminar/Index"
08.            });
09.            var index = tabStrip.tabGroup.children("li").length;
10.            tabStrip.select(index - 1);
11.        }
12.    </script>
This also seems to work. The new tab will be created and content is loaded.
My Problem occurs when i click on first tab. Then on my page the content of fist tab and second tab is rendered in first tab.
(looked like shown in screenshots).

I try this on IE and Chrome with sameresult.

Head of my html-demo-file ...

01.<!DOCTYPE html>
02.<html lang="de-DE">
03.<head>
04.    <title></title>
05.    <link href="Content/kendo/2012.3.1315/kendo.common.min.css" rel="stylesheet" type="text/css" />
06.    <link href="Content/kendo/2012.3.1315/kendo.silver.min.css" rel="stylesheet" type="text/css" />
07.    <script src="Scripts/kendo/2012.3.1315/jquery.min.js" type="text/javascript"></script>
08.    <script src="Scripts/kendo/2012.3.1315/kendo.web.min.js" type="text/javascript"></script>
09.    <script src="Scripts/kendo/2012.3.1315/cultures/kendo.culture.de-DE.min.js" type="text/javascript"></script>
10.</head>
Where is my error ?
What i'm doing wrong ?

Regards.

Jürgen Meyer




Juergen
Top achievements
Rank 1
 answered on 06 Nov 2013
2 answers
188 views
I am currently implementing a StockChart in razor.

I was able to get the chart binding nicely to a single series, but I am having trouble working out how to bind the chart to a dynamic number of series.

For example,  consider a series which is a list of objects (foo) having a date and decimal property. 

If I have x number of series, so something like List<List<foo>>data. How do I bind this to the chart?
Aaron
Top achievements
Rank 2
 answered on 05 Nov 2013
7 answers
784 views
I have a plain ASP.NET/HTML solution (no MVC or wrappers), and I use PageMethods that are called by the read, create, update, destroy (from dataSource).
Like this (only create shown, the others are same except the webmethod):
                var dataSource = new kendo.data.DataSource({
                    batch: true,
                    transport: {
                        read: {
                            type: "POST",
                            url: "default.aspx/GetUserInfos",
                            contentType: "application/json; charset=utf-8",
                            dataType: "json"
                        },
                      .... .... ....

And it seem to work most of the time, but if I open the grid (which gets values from server), add a row, save changes (causes update on server), delete the new row and saves changes again, no server call is made. Its like I need to tell the grid that now the new row is permanent.

I also get a crach in some dynamic javascript method if I add a row, save change and then press Cancel toolbar button (at this stage cancel should not do anything, since everything is recently saved to server).

By the way, I had to modify parameterMap like this to get the arguments to be unpacked correctly by ASP.NET
 
parameterMap: function (data, type) {
     if (type == "read")
         return { users: kendo.stringify(data.models) };
     else
         return "{ users:" + kendo.stringify(data.models) + "}"; // sent as argument to ASP.NET, needs to be a string of JSON
 }

Magnus
Top achievements
Rank 1
 answered on 05 Nov 2013
2 answers
304 views
Hey there.

I've got a basic TreeView working. I'm using remote json data for the initial TreeView. What I need to do, is have the children added to the tree when the user clicks on the parent node. I'll need to make another call to the server for this next set of data since the node clicked contains a property I need in order to construct data property  required for the next rest call.

Do you have any example of how this is done using binding to remote data?

Thanks!
Keith
Top achievements
Rank 2
Iron
Veteran
 answered on 05 Nov 2013
1 answer
87 views
Is there any chance we will see some basic support for understanding Kendo UI Templates through JustCode in the future? It is a bit irritating that it is the only templating engine that Visual Studio cannot even comprehend.
Zdravko
Telerik team
 answered on 05 Nov 2013
1 answer
106 views
I have strange problem when aggregating my sale data by Location and displaying it on the chart by date.I have let's say 25 Sales Amount in two locations across different dates. Location A has 10 days when minimum 1 sale happened, location B has 15 days. I want to display line graph for last month for those two locations displaying the day and the amount of the sale. The days with no sale should just interpolate.The expected result is two lines each with different days and different amount. But What I get is two lines but( each with 9 dates) always paired together. It displays incorrect day and the amount of the sale that day. The data from the server are however correct , and so is correct the graph if only one location is displayed.The problem seems to be when the two lines have different dates.here is the relevant code:

function makeChartData(transport, field){
        var chart_data = new kendo.data.DataSource({
            transport: transport,
            group: {
                field: field
            }
        });
        return chart_data;
    }
 
    var chart_data = makeChartData(transport, "Location_Name");
 
    function createSalesChart() {
        return $("#overview-chart").height(400).width(490).kendoChart({
            dataSource: chart_data,
            autoBind: false,
            seriesDefaults: { type: "line", stack: false, missingValues: "interpolate" },
            series: [
                {
                    field: "Gross_Total",
                    name: "Gross Total",
                    categoryField: "Date"
                }
            ],
            categoryAxis: {
                field: "Date",
                baseUnit: "days",
                type: "date",
                labels: {
                    dateFormats: {
                        days:"M-d"
                    },
                    step: 7
                },
 
            },
            valueAxis: {
                name: "currency",
                labels: { format: currency_prefix+"{0}"+currency_suffix },
            },
            legend: { position: "bottom" },
            tooltip: { visible: true, format: "0" },
            plotArea:{
                background: "#FFF"
            }
        });
    }
T. Tsonev
Telerik team
 answered on 05 Nov 2013
2 answers
312 views
We have a checkbox treeview representing the company's organizational structure.
Next to the treeview, is a datagrid displaying information about the subordinates within the list of selected persons within the treeview.

A stored procedure handles all the logic for which records should be returned.
It accepts a one-column table parameter that should have one record with the id of each person selected in the treeview.

So, we need help on how to have a check/uncheck in the treeview trigger a reload of the grid.
And we want to be able to preserve the DataSourceRequest functionality handling sorting/filtering/paging/... as well.

Can someone please help us with a general idea and/or some code snippets to point us in the proper direction?
Even a very basic dropdownlist communicating to a grid would be sufficient.  We are familiar enough with jquery to bind all the nuances of the checkboxes within the treeview.

Thank you,
Joe


Petur Subev
Telerik team
 answered on 05 Nov 2013
1 answer
123 views
Hello, I write in the form of content but he is printing on the outside of the browser panel bar, why is he doing this?

Navigator
http://imageshack.us/f/545/uv53.png/

Code C#
http://imageshack.us/photo/my-images/199/tec4.jpg/
Petur Subev
Telerik team
 answered on 05 Nov 2013
1 answer
142 views
Hi all,

am facing issues with the datasource..am trying to populate data from a REST service which gives me json response.When i directly copy paste the service response in a js file and mention it in the URL attribute it works fine,but when i directly mention the REST url its not loading the result.I am using the coffe shop application which was there on github.As i am new to kendo i am unable to solve this issue...it would be great if somebody could help me.

thanks in advance,
keran.
Kiril Nikolov
Telerik team
 answered on 05 Nov 2013
1 answer
5.0K+ views
I'm interested in the most efficient way to replace a dataSource for a named dropdownlist (ex: $("#DDL1"). The control is referenced throughout the application therefore I just want to change the datasource.

I want to change the dataSource details inline like so:
$("#DDL1").kendoDropDownList({ dataSource: _urlStates, dataTextField: "attributes.States", dataValueField: "attributes.States" }).data("kendoDropDownList");
But I'm overlooking something...

Thanks in advance!
Alexander Valchev
Telerik team
 answered on 05 Nov 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
Application
Drag and Drop
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
+? more
Top users last month
Hiba
Top achievements
Rank 1
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Max
Top achievements
Rank 1
Veteran
Iron
Alina
Top achievements
Rank 1
Rakhee
Top achievements
Rank 1
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Hiba
Top achievements
Rank 1
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Max
Top achievements
Rank 1
Veteran
Iron
Alina
Top achievements
Rank 1
Rakhee
Top achievements
Rank 1
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?