Telerik Forums
Kendo UI for jQuery Forum
2 answers
1.1K+ views
hi,

I am trying to follow the very simple validation example. I have this written:

    $(document).ready(function () {
        var validatable = $("#myform").kendoValidator().data("kendoValidator");
        $("#save").click(function () {
            if (validatable.validate()) {
                alert('Valid');
            } else {
                alert('Not valid');
            }
        });
    });

and html:

    <div id="myForm">
        <fieldset>
            <label for="Name">Name</label>      
            <input type="text" id="Name" name="Name" required/>
            <br/>
            <label for="Age">Age</label>     
            <input type="text" id="Age" name="Age">
            <br/>
            <label for="Phone">Phone</label>
            <input type="text" title="Phone Number" id="Phone" pattern="\d{10}" validationMessage="please enter a ten digit phone number"/>
            <br/>
            <button id="save" type="button" class="k-button"></button>
            <!--<input type="submit" id="Submit" value="Submit" @*onclick="checkValidation()"*@/>-->
        </fieldset>

it says that 'validatable' is not defined. But what's weird is when I step through the code in Firebug, it shows the proper return when I call manually $("#myform").kendoValidator().data("kendoValidator"). It seems only if I put it in a variable, that variable is undefined.

Can anyone help? maybe I am missing some JS references? Which ones do I need for this? please help.

thanks!
Drew
Top achievements
Rank 1
 answered on 24 Jan 2013
4 answers
550 views
I'm trying to use tab strip in standard display/value way. So I'm creating data which have two propertes name and value. I would like create tabs that will display name, but after select I will have access to value, to make some opertaions on value not on name.

Is it possible?
Marcin
Top achievements
Rank 1
Veteran
 answered on 24 Jan 2013
1 answer
142 views
  I wrote the code below, the data came to the web service but I couldn't see any chart on the page.The title can be seen on the page(Pie Chart Test), the createChart function is called but  datasource part does not work. If you can help, I would be glad.

Note: Json data is attached as data.json

       <script>
           
                function createChart() {
                    $("#chart").kendoChart({
                        theme: $(document).data("kendoSkin") || "default",
                        title: {
                            text: "Pie Chart Test"
                        },
                        legend: {
                            position: "bottom",
                                },
                        seriesDefaults: {
                            labels: {
                                visible: true,
                                format: "{0}%"
                            }
                        },
                     
                        categoryAxis: {
                            field: "ID"
                        },
                        dataSource: {
                            transport: {
                                read: {
                                    url: "Machine.asmx/GetDuration",
                                    dataType: "json"
                                }
                            },
                        },
                        series: [{
                            type: "pie",

                        }],
                       tooltip: {
                            visible: true,
                            format: "{0}%"
                        }
                    });
                }

                $(document).ready(function () {
                    setTimeout(function () {
                        // Initialize the chart with a delay to make sure
                        // the initial animation is visible
                        createChart();
                        $("#example").bind("kendo:skinChange", function (e) {
                            createChart();
                        });
                    }, 400);
                });
            </script>

Iliana Dyankova
Telerik team
 answered on 24 Jan 2013
2 answers
108 views
WORKS:
var data = JSON.parse(localStorage.getItem('some_stored_json_data'));
var template = kendo.template($("#template").text());
var content = kendo.render(template, data);
$("#scrollview").kendoMobileScrollView().data("kendoMobileScrollView").content("<!--" + content + "-->");

DOES NOT WORK:
var data = JSON.parse(localStorage.getItem('some_stored_json_data'));
var template = kendo.template($("#template").text());
var content = kendo.render(template, data);
$("#scrollview").kendoMobileScrollView().data("kendoMobileScrollView").content("<!--" + content + "-->");
$("#scrollview").kendoMobileScrollView().data("kendoMobileScrollView").content("<!--" + content + "-->"); // the only line different

I have ScrollView running fine with the "WORKS" code above (Templates and other HTML not attached). 

However, though the above code that "DOES NOT WORK" is nonsense, but It reproduces the problem I am having when I am trying to update the contents of a ScrollView. Can someone please confirm that they can reproduce my problem and and if it is a bug or not. 

KendoUI version: 2012.3.1315
Platform: Phonegap 2.2.0 on Android 2.2 API (running on Android 4.2 Phone). 

Cheers,
Vaughn
Vaughn
Top achievements
Rank 1
 answered on 24 Jan 2013
1 answer
60 views
Hi All,

Initially, I have selected page size 25 in kendo listview and checked the select all check box. Then checkboxes of 25 records has been checked. That's fine. Until this no issue. The problem is if I select 50 from PageSizes dropdown, still only checkboxes of 25 records are getting selected. SelectAll checkbox option is not applying for all 50 records. Is there any way to do this? Immediate help would be appreciated.

Listview pager seetings in MVC I have written:
.Pageable(pager => { pager.PageSizes(new int[] { 25, 50, 100, 200 }); pager.ButtonCount(1); })


Regards,
Partha.
Petur Subev
Telerik team
 answered on 24 Jan 2013
2 answers
117 views
We are evaluating the use of Kendo UI for one of our internal web site development and we have come across an issue related Grid Foreign Key Column.

As shown in the picture attached, we need to populate the Billing Roles Dropdown in the Grid based on the Engagement selected. We are seeing multiple issues to do this. We have tried to use following javascript code to force the Dropdown to reload, the problem with the following approach is JQuery cannot find the DropDown element unless the Grid has New Row or existing rows. But even after having a Row populated in the grid, the dropdown was not getting reloaded with new options. I have placed the similar dropdown outside of the Grid, that grid is getting filtered without any issues.
var dropDown = $("#BillingRoleId").data("kendoDropDownList")
    dropDown.dataSource.read();

We have even tried to reload the grid with the following javascript, but the dropdown list is not refreshed.
var grid = $("#BillingRoles").data("kendoGrid");
    grid.dataSource.read();

The Dropdown list is getting stuck with the initially bounded options while loading the page. It does not seem pick up any modifications done on the ViewData. I am attaching the Model, View and Controller files with the request. Can you please review the same and help us unblock with this issue.

Project Details,
CreateNewRequest is the controller and AddBillingRoleRequestViewModel is the parent which will have collection of AddBillingRoleViewModel. We have created two partial views under CreateNewRequest folder. AddBillingRole.cshtml generates the Grid with the dropdowns. Index.cshtml renders _RequestFormSelect.cshtml and AddBillingRole.cshtml.
Venkatesh
Top achievements
Rank 1
 answered on 24 Jan 2013
1 answer
77 views
Hello,
Is there any possibility to overwrite default pop up menu in mobile using Kendo UI Web Application development.
can anybody ensure me please.
Petyo
Telerik team
 answered on 24 Jan 2013
1 answer
180 views
Hello,
i want to raise a touch event(ex: Long touch) in web application,when the web application is opened in mobile is it possible to do

Petyo
Telerik team
 answered on 24 Jan 2013
1 answer
111 views
Setup: I have a master model, and my page has a bunch of widgets on it.

So I want to have the widgets powered by MVVM instead of wiring everything up manually in jQuery.

Here's the sample
http://jsbin.com/epijuw/3/edit

So what am I doing wrong here?...why is the event not firing?
Holger
Top achievements
Rank 1
 answered on 24 Jan 2013
1 answer
124 views
Thanks in advance for any help...

I am trying to set the background color for the unselected chart area in the navigator portion of the Stock Chart control. The navigator section is set to "area". If the selected area is not 100% of the width of the total navigation area, the unselected area has a gray background, which clashes with my sites' theme.

Potentially helpful information:

 I am using the Stock Chart on a page that has an existing background color. For that reason, I am setting the chart area background (of the main Stock Chart) to an empty string, making the background transparent.

ChartArea     : {background: ""}

This makes the selected region of the navigator control the same as the host page color, which is perfect for my situation. 

Removing this (the main chart area background to ""), however, seems to have no affect on the unselected navigator portion.

Iliana Dyankova
Telerik team
 answered on 23 Jan 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
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
MultiColumnComboBox
Dialog
Chat
DateRangePicker
Checkbox
Timeline
Drawer
DateInput
ProgressBar
MediaPlayer
ImageEditor
TextBox
OrgChart
Effects
Accessibility
PivotGridV2
ScrollView
BulletChart
Licensing
QRCode
ResponsivePanel
Switch
Wizard
CheckBoxGroup
TextArea
Barcode
Breadcrumb
Collapsible
Localization
MultiViewCalendar
Touch
RadioButton
Stepper
Card
ExpansionPanel
Rating
RadioGroup
Badge
Captcha
Heatmap
AppBar
Loader
Security
TaskBoard
Popover
DockManager
FloatingActionButton
CircularGauge
ColorGradient
ColorPalette
DropDownButton
TimeDurationPicker
ToggleButton
TimePicker
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
+? more
Top users last month
Edmond
Top achievements
Rank 1
Iron
fabrizio
Top achievements
Rank 2
Iron
Veteran
RobMarz
Top achievements
Rank 2
Iron
Fakhrul
Top achievements
Rank 1
Iron
Tejas
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Edmond
Top achievements
Rank 1
Iron
fabrizio
Top achievements
Rank 2
Iron
Veteran
RobMarz
Top achievements
Rank 2
Iron
Fakhrul
Top achievements
Rank 1
Iron
Tejas
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?