Telerik Forums
Kendo UI for jQuery Forum
6 answers
163 views
Hi Guys,

Need your help. I followed the example here http://demos.kendoui.com/mobile/scrollview/index.html#/ but unable to display the data in the mvvm.
I think i didn't setup the template the correctly? was able to setup a mvvm bind to listview successfully though.
Thanks.

var feedsModel= kendo.observable({
    feeds:[
{posttitle: "title1",
postcontent: "content1"},
{posttitle: "title2",
postcontent: "content2"},
],
    selectedpost:"none",
});
 <div data-role="view" id="post" data-layout="post-layout" data-title="Post" data-stretch="true" data-model="feedsmodel"></div>
 <div data-role="scrollview" 
        data-source="feeds" 
        data-template="scrollview-binding-template"
        data-content-height="100%"
        data-enable-pager="false">
    </div>
<script id="scrollview-binding-template" type="text/x-kendo-template">    <div> <p class="title">#: posttitle #</p></div></script>
Adrian
Top achievements
Rank 1
 answered on 11 Oct 2013
1 answer
33 views
I'm using the javascript version of the KendoUI Editor. I've tried loading the editor with this in the text field:
<img src="someimagehere.png" alt="" />

After the editor loads, the html says the field has this:
<img alt="" />

This only happens when I'm working in IE8. What's happening?
Dimo
Telerik team
 answered on 11 Oct 2013
1 answer
170 views
Hi,

In a MVC4 application I am working, I have some menu links, clicking on these links, I load the relevant page as an ajax partial view below the menu links.
One of the partial views contains a splitter. When I load this  partial view containing splitter and navigate to other partial views clicking on other links, and if I come back to the view with the splitter partial view - on window resize the scripts throw an error saying that 'offsetWidth' is null. This happens on IE 9.0 only

Environment
Browser: IE 9.0
Kendo Version: 2013.2.918.340

I have put up a simple mvc4 application demonstrating that.
Steps to reproduce :
1) Click on the link 'Load splitter view below' (Loads a view with splitter beneath the link)
2) Click on the link 'Load non splitter view below' (Replaces the splitter view with a non splitter view)
3) Click on the link 'Load splitter view below' (Loads the splitter view again)
4) Resize the browser window, then the script breaks saying 'offsetWidth' is null. Resizing the window is triggering resize event on splitter, where it is breaking

Can you please see if this is a real issue or if I am missing out anything here ?
Dimo
Telerik team
 answered on 11 Oct 2013
1 answer
190 views
Hi All,

I'm new to KendoUI so please bear with me. I've a Kendo gird on a view as below:

(I've taken out the extra CRUD lines for clarity as I've not got as far as implementing them yet).
@using Kendo.Mvc.UI
@using MvcApplication2.Models
 
 
@{
    ViewBag.Title = "Index";
}
 
<h2>Index</h2>
 
@(Html.Kendo().Grid<MerchantStore>()
    .Name("grid")
    .Columns(columns =>
    {
        columns.Bound(p => p.MerchantStoreId);
        columns.Bound(p => p.Name);
        columns.Bound(p => p.Address1);
        columns.Bound(p => p.TelephoneNumber);
        columns.Command(command => { command.Edit(); command.Destroy(); });
    })
    .ToolBar(toolbar => toolbar.Create())
    .Editable(editable => editable.Mode(GridEditMode.InLine))
    .Pageable()
    .Sortable()
    .Scrollable()
   // .HtmlAttributes(new { style = "height:1430px;" })
    .DataSource(dataSource => dataSource
        .Ajax()
        .PageSize(20)
        .Events(events => events.Error("error_handler"))
        .Model(model => model.Id(p => p.MerchantStoreId))
        .Read(read => read.Action("Read", "Home"))
        
    )
)
<script type="text/javascript">
    function error_handler(e) {   
        if (e.errors) {
            var message = "Errors:\n";
            $.each(e.errors, function (key, value) {
                if ('errors' in value) {
                    $.each(value.errors, function() {
                        message += this + "\n";
                    });
                }
            });       
            alert(message);
        }
    }
</script>
I'm trying to hook up the controller to return a json result provided by a wcf webservices. As below:

public ActionResult Read([DataSourceRequest]DataSourceRequest request)
       {
           var client = new WebClient();
            
           
           return View("Index", Json(
               client.DownloadString("http://localhost:11462/Service1.svc/rest/ListMerchantStore" +
                                     "?merchantId=10000"), JsonRequestBehavior.AllowGet));
       }
but I just get an empty grid. The json looks like:

{"d":[{"__type":"MerchantStoreData:#WcfServiceLibrary1","Address1":"Add1","Address2":null,"Address3":null,"CountryId":826,"CountyState":"","Deleted":false,"EmailAddress":null,"MerchantId":10000,"MerchantIndustryId":1001,"MerchantStoreId":10213,"MerchantStoreKey":"654321","Name":"TEST","PostZipCode":null,"StatusId":0,"TelephoneNumber":null,"TownCity":"City"},{"__type":"MerchantStoreData:#WcfServiceLibrary1","Address1":"Add1","Address2":"Add2","Address3":"Add3","CountryId":826,"CountyState":"","Deleted":false,"EmailAddress":"a@a.a","MerchantId":10000,"MerchantIndustryId":1001,"MerchantStoreId":10214,"MerchantStoreKey":"654321","Name":"TEST","PostZipCode":"","StatusId":1,"TelephoneNumber":"123456","TownCity":"City"}]}

Please can someone kindly point out where i'm going wrong.

Many Thanks
Alexander Popov
Telerik team
 answered on 11 Oct 2013
2 answers
317 views
I've distilled the problem into a jsfiddle here: http://jsfiddle.net/dTBN6/6/

You can reproduce the problem by doing the following steps :
  1. Click the "To page 2" button
  2. Resize your window so content is long enough to allow scrolling
  3. Scroll down a bit
  4. Open drawer and go back to page 1
  5. Click the "To page 2" button again
  6. Attempt to scroll - the view's scrolling is locked
  7. Open drawer. Then close it.
  8. Attempt to scroll - it works
  9. Repeat from step 4
If you access page 2 via the link in the drawer, scrolling does not lock up.

What gets triggered when the drawer is shown / hidden that causes the scrolling to unlock?
Can I trigger this manually in page two's "show" event handler?
Is there anyway to fix this?
kbelisle
Top achievements
Rank 1
 answered on 11 Oct 2013
1 answer
281 views
Hello
I have the following drawer
<!--left-drawer-->
        <div data-role="drawer" id="left-drawer" data-title="Global Menu">
            <header data-role="header">
                <div data-role="navbar">
                    <span data-role="view-title"></span>
                </div>
            </header>
            <ul data-role="listview" data-type="group">
                <li>Global Menu
                    <ul>
                        <li data-icon="share"><a href="#drawer-home" data-transition="none">Inbox</a></li>
                        <li data-icon="share"><a href="#drawer-starred" data-transition="none">Starred Items</a></li>
                    </ul>
                </li>
                <li>Sub Menu
                    <ul id="ResultDiv2">
                    </ul>
                </li>
                 
            </ul>
        </div>
        <!--//left-drawer-->
 
        <div data-role="view" id="about" data-layout="drawer-layout" data-title="About">
            about dummy text
        </div>
 
        <script>
            new kendo.mobile.Application();
        </script>
When you bind the drawer from inside Document.Ready everything is working fine and the design appears correctly, but if you bind the drawer on any event like click then the design will not appear correctly.

Here is my code
$(document).ready(function () {
    After();
});
 
function After() {
    var template = kendo.template('<li data-icon="share" onclick="After();"><a href="#:url#" data-transition="none"><span></span>#:name#</a></li>');
    var data = [
                { url: '#about', name: 'Menu' },
                { url: '#about', name: 'Customer' },
                { url: '#about', name: 'Generate again'}];
    var result = kendo.render(template, data);
    //alert(result);
    $("#ResultDiv2").append(result);
     
}

you can check that on the following website
IN4ELECTRONICS

Regards
Alexander Valchev
Telerik team
 answered on 11 Oct 2013
4 answers
80 views
We've got quite a significant investment in Knockout templates and I'm wondering if anyone had figured out a way to be able to use Knockout templates in place of the regular Kendo templates? I know we can re-do them, but we want to re-use if at all possible, and would like to be able to stick with knockout for elsewhere in the UI.

In case no-one has any solid experience on this, whacky ideas would also be gratefully received - we're willing to experiment.
Richard
Top achievements
Rank 1
 answered on 11 Oct 2013
1 answer
94 views
I have been reading a number of posts here and still am struggling with the proper method for binding series to the "columns" of a datasource.    

The issue I am running up against is that I don't have control over the datasource (generic webservice call), but I need to be able to put it into the proper chart structure.

Assume my web service call returns the following:

rows: [
    { Dept: "Shoes", Q1: 100, Q2: 200, Q3: 220, Q4: 180 },
    { Dept: "Shirts", Q1: 140, Q2: 160, Q3: 390, Q4: 200 },
    { Dept: "Pants", Q1: 180, Q2: 190, Q3: 400, Q4: 320 },
    { Dept: "Tops", Q1: 520, Q2: 600, Q3: 425, Q4: 570 }
]

What I am looking for is to create a line chart where the each department is a category and the series is Q1 - Q4.   The problem is, I don't know in advance that I will get for the "columns" (i.e Q1 - Q4).   It might be a range of years from 2005 - 2013, or it may be a set of months Jan - Dec.    

Is there a way to do this generically?    
T. Tsonev
Telerik team
 answered on 11 Oct 2013
7 answers
1.0K+ views
Using the template property of the AutoComplete,  I would like to somehow display a table that contains the results of the json query.

Like in your standard ComboBox control.  Is there an easy way to accomplish this.

Thanks
Georgi Krustev
Telerik team
 answered on 11 Oct 2013
3 answers
272 views
I am using the kendo grid to display data. It also needs to be editable (inline editing).
I know how to add other controls to the grid using templates when it is in inline edit mode.
How do I add the multi-select control to the Grid in inline edit mode/

This is the multi-select control I need to have in the Grid:

http://demos.kendoui.com/web/multiselect/index.html

Thanks,
Anthony
Iliana Dyankova
Telerik team
 answered on 11 Oct 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
Drawer (Mobile)
Drawing API
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?