Telerik Forums
Kendo UI for jQuery Forum
1 answer
138 views

Hi, 

On the Grid, normally,  messages: { display: "Showing {0}-{1} from {2} data items"}  shows on the right side of the footer. When the Grid is limited on width (when re-sizing the window), the messages disappears. 

The question here is that: is that possible to display the messages on the second row below of the footers (with first, last , buttons and page number , etc)? we just want to have the messages show up on the grid regardless of the width of the grid.

 

thanks,

 

Pauline

Preslav
Telerik team
 answered on 28 Mar 2017
1 answer
849 views

Hi,

I am getting the Data from an API where, I get only the first 2 page data At a time.

That is total 50 row records, and I will be showing 25 each in both the pages.

Now the issue is When I get my first 50 records from the API, I know total there are 147 Items, that is I will get all the data only after 3 web api calls.

Now I do not want all the records from the API before the user click on any page.

So after my first call. that I got 2 pages of grid( 25 + 25 = 50), but I know there are four more pages to get all 147 data.

So can I display the rest four more pagination, on click of that pagination can i get relevant data from API.

It looks complicated to explain and to implement.

Is it possible to implement this scenario with Kendo grid, or can I go ahead with a custom grid implementations. Thanks for your time

 

Stefan
Telerik team
 answered on 28 Mar 2017
1 answer
194 views
I'm using Kendo UI Grid with XML as DataSource. I want to transfer additional data in the XML as the grid data.

My dataSource schema looks like this

schema: {
type: "xml",
id: "field 1",
data: "/data/dataset",
total: "/total/text()",
model: {
fields: {
field1: "field1/text()",
field2: "field2/text()"
}
}
}

My XML like this:

<total>1</total><data><dataset><field1>test</field1><field2>test</field2></dataset></data>

No i want to transfer additional data like this:

<total>1</total><data><dataset><field1>test</field1><field2>test</field2></dataset></data><additionaldata>test</additionaldata>

and i want to have access on it it in the "dataBound" event. Is it possible and if how? I hope someone can help me.
Preslav
Telerik team
 answered on 28 Mar 2017
1 answer
129 views

Hello, we recently encountered an issue when using the scheduler in Google Chrome. It seems as certain zoom percentages on Google Chrome prevents certain cells from being selected in the monthview component of the scheduler. Providing a dojo-example here. And instructions below.

  1. Set your browsers zoom to 67%
  2. Try to select 2014-10-15

The specific day (and the entire week in fact) can not be selected (see attached image)

Ivan Danchev
Telerik team
 answered on 28 Mar 2017
1 answer
410 views

Hello, I have read through the documentation many times and believe I can accomplish what I want to do.  In fact, I have created a Dojo doing exactly what I want:

http://dojo.telerik.com/UDoZU

However, when I attempt to do this in my own software, I cannot even change the method request type from GET to POST.

I am attempting to create a Kendo Window and insert data inside of it from an API endpoint.  I need to set custom request headers for my data call in order to make the request.  So far, I've tried:

var window = document.createElement('div');
        $(window).kendoWindow();
        var dialog = $(window).data("kendoWindow");

        dialog.refresh({
            url: uri_UIManagement + 'Container/GetBuiltContainer' + urlString,
            type: 'POST',
            headers: headers,
            beforeSend: function (xhr) {
                debugger;
            }
        });

 

myWindow.kendoWindow({
            width: "600px",
            title: "About Alvar Aalto",
            content: {
                url: uri_UIManagement + 'Container/GetBuiltContainer' + urlString,
                type: "POST"
            },
            visible: false,
            actions: [
                "Pin",
                "Minimize",
                "Maximize",
                "Close"
            ]
        }).data("kendoWindow").center().open();

 

myWindow.data('kendoWindow').refresh({
            url: uri_UIManagement + 'Container/GetBuiltContainer' + urlString,
            type: 'POST',
            headers: headers,
            beforeSend: function (xhr) {
                debugger;
            }
        });

 

NONE of these methods allow me to hit the breakpoint I have set inside of beforeSend.  They don't even change the request type from GET to POST.  I can accomplish all of these things inside of the Kendo Dojo.  What am I missing?

Ianko
Telerik team
 answered on 28 Mar 2017
1 answer
350 views
 When the popup is open, hovering on another menu item automatically opens it. How do I make it so it actually opens on click event?
Ivan Danchev
Telerik team
 answered on 28 Mar 2017
2 answers
251 views

Hi, 

I have a small problem with SVG images in the tabstrip-item. Is it possible to give the imageUrl a additional css class?

Because the SVG-Image has a native size of 64x64 which is much too large for me - I would like to define the size over a css-class instead of create a smaller version.

 

Thank you and best regards!

Dennis
Top achievements
Rank 1
 answered on 28 Mar 2017
4 answers
510 views

Hello,

I am from the Czech Republic and we use daylight savings time. Time is changing on 26th March, 2:00 AM. When I create an event in Scheduler and the event crosses the moment when the time is changing, e.g. event lasting from 25th March 5:00 PM to 26th March 5:00 PM, events in the Scheduler renders incorrectly and I get an exception:

Object doesn't support the method innerRect.

The exception is from _positionEvent function.

Interestingly, this problem occurs only when the event lasts exactly 24 hours. When it crosses the changing time moment, but lasts 25 or 23 hours, Scheduler works as expected.

 

Thanks for replies,

Boris

Veselin Tsvetanov
Telerik team
 answered on 28 Mar 2017
2 answers
430 views

Hi,

We just upgraded to the new version of Kendo and are struggling a bit with the new themes. FYI we're using the kendo.silver theme.

The grid works fine in general, but the filter icon seems to want to take up way more space than necessary; the column title is often truncated and then 3 dots added to show that there's more. It's hard to explain but see the attached screenshot. The column name is actually "ID" which should easily fit in the space, but you have to make the column really wide for some reason to get it to show otherwise it displays as "I...".

I tried to edit the CSS manually (I did find a large margin in "k-with-icon") but I'm not good with CSS and only made things worse - the column title went on a separate line from the filter icon. Anyone have ideas on how I can fix this? I really don't want to have to go edit every page in our system to increase the column widths; they looked perfect with the old styles.

Thanks!

Nathan

Nathan
Top achievements
Rank 1
 answered on 27 Mar 2017
6 answers
231 views

I am using css to increase the numeration but when I export to PDF the number doesn't appear.

Example

1 Section

1.1 Subsection

1.1.1 Standards

by in the PDF their appear like that:

0 Section

0.0 Subsection

0.0.0 Standards

 

this is the code I used

<!DOCTYPE html>
<html>
<head>
    
    <style>html { font-size: 14px; font-family: Arial, Helvetica, sans-serif; }</style>
    <title></title>
    
  
    <script src="https://kendo.cdn.telerik.com/2017.1.223/js/jquery.min.js"></script>
    <script src="https://kendo.cdn.telerik.com/2017.1.223/js/jszip.min.js"></script>
    <script src="https://kendo.cdn.telerik.com/2017.1.223/js/kendo.all.min.js"></script>
</head>
<body>
<div id="example" class="content-wrapper">
 
      <div class="box wide hidden-on-narrow">
          <h4>Export page content</h4>
          <div class="box-col">
              <button class='export-pdf k-button'>Export as PDF</button>
          </div>
      </div>
            
    <main>
        <section class="row foodSect">
          <div class="section">
<h1 class="col-md-5">FOOD TRACEABILITY</h1>

<!-- SUBSECTION 2.1-->
<div class="col-md-12 subsections">
<h2 class="col-md-4">FOOD TRACEABILITY</h2>

<!-- STANDARDS 2.1.1-->
<div class="col-md-12 standards">
<h3 class="col-md-5">Traceability Systems for Receiving Food </h3>
</div><!-- end standards 2.1.1-->
</div><!-- end subsection 2.1-->
</div>
        </section>
    </main>

<style>
    
 .foodSect {counter-reset: section;}

  .foodSect h1 {counter-reset: subsection;}

.foodSect h2 {counter-reset: standards;}

.foodSect h3 {
font-size: 0.944em;
margin: 9px auto;
padding-left: 30px;
float: left;
}

.foodSect h1:before {
counter-increment: section;
    content: counter(section) " ";
}

.foodSect h2:before {
counter-increment: subsection;
    content: counter(section) "." counter(subsection) " ";
}

.foodSect h3:before {
counter-increment: standards;
    content: counter(section) "." counter(subsection) "." counter(standards) " ";
}
</style>

<script>
    // Import DejaVu Sans font for embedding

    // NOTE: Only required if the Kendo UI stylesheets are loaded
    // from a different origin, e.g. cdn.kendostatic.com
    kendo.pdf.defineFont({
        "DejaVu Sans"             : "https://kendo.cdn.telerik.com/2016.2.607/styles/fonts/DejaVu/DejaVuSans.ttf",
        "DejaVu Sans|Bold"        : "https://kendo.cdn.telerik.com/2016.2.607/styles/fonts/DejaVu/DejaVuSans-Bold.ttf",
        "DejaVu Sans|Bold|Italic" : "https://kendo.cdn.telerik.com/2016.2.607/styles/fonts/DejaVu/DejaVuSans-Oblique.ttf",
        "DejaVu Sans|Italic"      : "https://kendo.cdn.telerik.com/2016.2.607/styles/fonts/DejaVu/DejaVuSans-Oblique.ttf"
    });
</script>

<!-- Load Pako ZLIB library to enable PDF compression -->


<script>
$(document).ready(function() {

    $(".export-pdf").click(function() {
        // Convert the DOM element to a drawing using kendo.drawing.drawDOM
        kendo.drawing.drawDOM($("#example"),{
        multiPage: true,
              paperSize: [1100, 1430], 
              landscape:true,
              date:true,
              page:true,
              title: true,
              author:true,
              margin: {left: "1cm", top: "1cm", right: "1cm", bottom: "1cm"}
        })
        .then(function(group) {
            // Render the result as a PDF file
            return kendo.drawing.exportPDF(group);
        })
        .done(function(data) {
            // Save the PDF file
            kendo.saveAs({
                dataURI: data,
                fileName: "HR-Dashboard.pdf",
                proxyURL: "https://demos.telerik.com/kendo-ui/service/export"
            });
        });
    });

   });
</script>



</body>
</html>

Ivan Danchev
Telerik team
 answered on 27 Mar 2017
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
Map
Drag and Drop
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
Miljana
Top achievements
Rank 2
Iron
Iron
Joel
Top achievements
Rank 3
Bronze
Bronze
Bronze
Cynthia
Top achievements
Rank 1
John
Top achievements
Rank 1
Iron
Mozart
Top achievements
Rank 1
Iron
Veteran
Want to show your ninja superpower to fellow developers?
Top users last month
Miljana
Top achievements
Rank 2
Iron
Iron
Joel
Top achievements
Rank 3
Bronze
Bronze
Bronze
Cynthia
Top achievements
Rank 1
John
Top achievements
Rank 1
Iron
Mozart
Top achievements
Rank 1
Iron
Veteran
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?