Telerik Forums
Kendo UI for jQuery Forum
1 answer
149 views
Hi,

We have a grid with a lot of columns - inline editing. Some of these columns have custom validations. For example we have 3 date fields with custom validations attached to them.
If a validation fails then it will show the message next to the date column. But the problem is when this happens and we scroll to the right the grid columns become unaligned.
ie. the headers don't stay above the column values when we scroll to the right - perhaps to accomodate the validation messages.

1) Is there a way to rectify the above situation?
2) If it is not possible to fix the above, what is the name of the class that needs to be changed to reduce the left and right padding for the validation message - this is more than is needed currently - if we reduce this the grid might look a little better.

Thanks,

SJ
Daniel
Telerik team
 answered on 23 Jul 2013
3 answers
156 views
Hi!

On the Settings screen of my app, which has a left Drawer for the main menu,  I've put a ListView with text inputs inside.
The thing is: if you touch inside the input and try to scroll (i.e., touch and move), you'll be able to push the view to the left.

Noticed this because when you focus the text input for editing, the screen moves so the input is centered.

I'm testing on iOS.

Thanks in advance.
Petyo
Telerik team
 answered on 23 Jul 2013
3 answers
113 views
Hi!

In my application, I have a ListView that uses a DataSource with grouping.

After I updated to version 2013.2.716, the links are only created correctly if I put the class and the role on the a tag. Without them, the link just breaks the navigation.
However, if I remove the grouping from the DataSource, the item becomes clickable and works as expected, even without specifying class and role.

Here is my template:
<script id="list-indicator-template" type="text/x-kendo-template">
    <a href="views/valuesChart.html?IndicatorId=#: IndicatorId #&Attribute=#: Attribute #" class="km-listview-link" data-role="listview-link">
        #: Attribute #
        <span class="attribute-value">#: kendo.toString(Value, "n2") #</span>
    </a>
</script>
Am I missing something here? I don't think so.

Thanks!
Kiril Nikolov
Telerik team
 answered on 23 Jul 2013
2 answers
154 views

Hello,

 

We are looking for an expert who can help us customize Kendo UI framework to fit our custom build charts images. If you have experience working with Kendo UI then please email us back admin at FirePips .com

 

We will provide more details via email.

 

Regards

Victor

Sydney, Australia 

Dimo
Telerik team
 answered on 23 Jul 2013
3 answers
398 views
My chart looks fairly good. 2 questions though. (See attached screen shot)

1) How can I make the Series labels only appear when the mouse hovers?
2) How do I format the Category Axis (Date) to "MMM d". My attempt below doesn't do anything to the date displayed.

Html.Kendo().Chart<AccountPerformance>(Model.Results)
    .Name("chart")
    .Title("Market Value")
    .Legend(legend => legend.Visible(false))
    .Series(series =>
            series.Line(model => model.Metrics.MarketValue)
                    .Name(Model.ColumnTitle)
                    .Labels(false)
    )
    .ValueAxis(axis => axis.Numeric()
        .Labels(labels => labels.Format("{0:C0}")))
    .CategoryAxis(axis => axis
        .Categories(model => model.ObservationDate)
        .Labels(labels =>
            {
                labels.Format("MMM d");
                labels.Rotation(45);
            } ))
    .Render();


Ian
Top achievements
Rank 2
 answered on 22 Jul 2013
3 answers
947 views
I am trying to put two charts, 320px width each, inside a Window and have them beside each other like in the screen shot.

Putting the charts into <div>s set at that width with a float doesn't work, the charts end up still stacked on top of each other:

Html.Kendo().Window()
    .Name(windowId)
    .Width(650)
    .Title(Model.ChartTitle)
    .Content(@<text>
 
                  <div style="width: 320px;">
                              CHART
                 </div>
 
                  <div style="width: 320px; float:right">
                              CHART
                 </div>
Ian
Top achievements
Rank 2
 answered on 22 Jul 2013
4 answers
101 views
Hi,

I run into a problem with the sample code below and I am not sure what causes it.  The problem is that the "temperatureLabel" gets display only once inside the for loop in the "myTemplate" template. 


var viewModel = kendo.observable({temperatureLabel: "Temperature", mydata:[]});
$.ajax({
                    url: url,
                    context: this,
                    type: "GET",
                    success: function(data) {
                        this.viewModel.set("mydata", data);
                        kendo.bind($("#view"), viewModel, kendo.mobile.ui); 
                    },
                    error: function(xhr, statusText, errorThrown) {
                       console.log(errorThrown);
                    },
                    timeout: 10000
 });

<div id="view">
<ul id="taf-panelbar" data-bind="source: mydata" data-template="myTemplate"></ul>
</div>

<script id="myTemplate" type="text/x-kendo-template">
          # for (var i = 0; i < forecast.length; i++) { #
                <li>
               <div>
               <table style="border: 1px solid lightGray; border-radius:6px;">
                    <tr>
                        <td class="label"><span data-bind="text:temperatureLabel></span></td>
                        <td>:</td>
                        <td style="text-align:left;"><span>#=forecast[i].temperature#</span></td>
                    </tr> 
               </table>
               </div>
               </li>
          # }#
</script>

Can someone shed some lights on this?

Thanks,
Kee
Kee
Top achievements
Rank 1
 answered on 22 Jul 2013
1 answer
300 views
Hi - I have a page with 4 charts and 3 splitters.  One splitter is vertical between the 2 charts on the top and the 2 charts on the bottom.  There are also 2 horizontal splitters - 1 between the charts on the top and 1 between the charts on the bottom.

My problem is that when the page loads, I only see the top 2 charts and 2 of the splitters correctly.  It looks like the third splitter is partially there.

I've attached a document with two screen shots.  The top screen shot has a red box around the bit of the splitter I can see.  When I move it, the other two charts render as shown in the bottom screen shot

What do I have to do to get all 4 charts to render when the page loads?

Here is the code creating the splitters:
ksAllCharts = $("#AllCharts").kendoSplitter({
          orientation: "vertical",
          panes: [
              { size: "40px", scrollable: false, resizable: false },
              { size: "300px", scrollable: false },
              { size: "100%", scrollable: true }
          ],
          layoutChange: onAllChartsLayoutChange
      }).data("kendoSplitter");
 
      ksCharts1 = $("#charts1").css("height", "100%").kendoSplitter({
          orientation: "horizontal",
          panes: [
              { size: "50%", scrollable: false },
              { size: "50%", scrollable: false }
          ],
          layoutChange: onChartsLayoutChange
      }).data("kendoSplitter");
 
      ksCharts2 = $("#charts2").css("height", "100%").kendoSplitter({
          orientation: "horizontal",
          panes: [
 
              {size: "50%", scrollable: false },
              { size: "50%", scrollable: false }
          ],
          layoutChange: onChartsLayoutChange
      }).data("kendoSplitter");


And the code for the page layout:
<ul id="panelBar">
    <li>Testing a new page
        <div id="comparativeDashboardPanelContents">
            <div id="AllCharts">
                <div>
                    <h1 class="top-header">testing a new page</h1>
                </div>
                <div id="chartsPane1">
                <h2 class="top-header">chart area 1</h2>
                    <div id="charts1">
                        <div id="OFPBySchool"></div>
                        <div id="OFStuPBySchool"></div>
                    </div>
                </div>
                <div id="chartsPane2">
                <h2 class="top-header">chart area 2</h2>
                    <div id="charts2">
                        <div id="StuCountsRiskBuckets"></div>
                        <div id="SchoolCrosstab"></div>                  
                    </div>
                </div>
                 
            </div>
        </div>
    </li>
</ul>

Thanks for any help, I'm really new to this.

Lisa
Dimo
Telerik team
 answered on 22 Jul 2013
1 answer
206 views
Hello,

It seems like in one of the recent releases the RequestStart event changed so that it now fires for the Insert and Update events as well as the read event.  We have logic in our application that it supposed to run against a read event to warn the user if they have unsaved changes, but this change has made this warning fire even when the user is saving their changes.  Is it possible to find out the request type in RequestStart?  I know this is available in the RequestEnd method, but at that point, it's too late for our logic to run.  Or is there another way to handle this?

Thanks for the help!

Regards,
Brian
Dimiter Madjarov
Telerik team
 answered on 22 Jul 2013
1 answer
80 views
Your example of pie chart remote data binding works great when the web service is hosted in the same place as the HTML, but it seems to be erratic if the web service is hosted somewhere else.

What I did was create a WCF service that returns a JSON object exactly like your example web service, and then call it with your exact HTML.

Reproducing the error is simple:  take  the pie chart remote data binding example and change the web service address so it's hosted in a domain different to the HTML. Obviously, you need to change to JSONP and add the callback function.

Thanks.
Vaughn Myers
Top achievements
Rank 1
 answered on 22 Jul 2013
Narrow your results
Selected tags
Tags
Grid
General Discussions
Charts
Data Source
Scheduler
DropDownList
TreeView
MVVM
Editor
Window
Date/Time Pickers
Spreadsheet
Upload
ListView (Mobile)
ComboBox
TabStrip
MultiSelect
AutoComplete
ListView
Menu
Templates
Gantt
Validation
TreeList
Diagram
NumericTextBox
Splitter
PanelBar
Application
Map
Drag and Drop
ToolTip
Calendar
PivotGrid
ScrollView (Mobile)
Toolbar
TabStrip (Mobile)
Slider
Button (Mobile)
SPA
Filter
Drawing API
Drawer (Mobile)
Globalization
Gauges
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
MultiColumnComboBox
Chat
DateRangePicker
Dialog
Checkbox
Timeline
Drawer
DateInput
ProgressBar
MediaPlayer
ImageEditor
OrgChart
TextBox
Effects
Accessibility
ScrollView
PivotGridV2
BulletChart
Licensing
QRCode
ResponsivePanel
Switch
Wizard
CheckBoxGroup
TextArea
Barcode
Collapsible
Localization
MultiViewCalendar
Touch
Breadcrumb
RadioButton
Stepper
Card
ExpansionPanel
Rating
RadioGroup
Badge
Captcha
Heatmap
AppBar
Loader
Security
Popover
DockManager
FloatingActionButton
TaskBoard
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
+? 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?