Telerik Forums
Kendo UI for jQuery Forum
5 answers
193 views
Is it possible to disable a scrollview via code? I use one as a selector, but once entry has started, it would be nice to disable it.
Kristian D. Dimitrov
Telerik team
 answered on 30 Oct 2013
1 answer
1.3K+ views
I am using WCF Data Service 5.6 to return JSON data:

DATA SERVICE CLASS
public static void InitializeService( DataServiceConfiguration config )
{
    config.SetEntitySetAccessRule( "*", EntitySetRights.AllRead );
    config.SetServiceOperationAccessRule( "*", ServiceOperationRights.All );
    config.DataServiceBehavior.MaxProtocolVersion= DataServiceProtocolVersion.V2;
}
[WebGet]
     public IQueryable<Tournament_Players_Result> Tournament_Players( int tournamentID )
     {
            return this.CurrentDataSource.Tournament_Players( tournamentID ).AsQueryable();
      }

Binding the data to a kendoGrid:

SCRIPT
var playersDataSource = new kendo.data.DataSource({
        type: "odata",
        transport: {
               read: {
                      url: http://localhost:41698/Tournament.svc/Tournament_Players?tournamentID=1,
                      dataType: "json"
                }
         }
});

$(document).ready(function () {
       $("#playersGrid").kendoGrid({
                dataSource: playersDataSource,
         });
});

Getting an error message:
ERROR
{"error":{"code":"","message":{"lang":"en-US","value":"Query options $orderby, $inlinecount, $skip and $top cannot be applied to the requested resource."}}}

Without the type="odata" in DataSource the service returns:
{"d":[{"__metadata":{"type":"TournamentModel.Tournament_Players_Result"},"PlayerID":1,"FirstName":"Tiger","LastName":"Woods","Handicap":null,"StartTime":"\/Date(1365674400000)\/","StartHole":"Mako #1"},{"__metadata":{"type":"TournamentModel.Tournament_Players_Result"},"PlayerID":2,"FirstName":"Adam","LastName":"Scott","Handicap":null,"StartTime":"\/Date(1365674400000)\/","StartHole":"Mako #1"},{"__metadata":{"type":"TournamentModel.Tournament_Players_Result"},"PlayerID":3,"FirstName":"Phil","LastName":"Mickelson","Handicap":null,"StartTime":"\/Date(1365675300000)\/","StartHole":"Mako #1"},{"__metadata":{"type":"TournamentModel.Tournament_Players_Result"},"PlayerID":4,"FirstName":"Henrik","LastName":"Stenson","Handicap":null,"StartTime":"\/Date(1365675300000)\/","StartHole":"Mako #1"},{"__metadata":{"type":"TournamentModel.Tournament_Players_Result"},"PlayerID":5,"FirstName":"Justin","LastName":"Rose","Handicap":null,"StartTime":"\/Date(1365676200000)\/","StartHole":"Hammerhead #1"},{"__metadata":{"type":"TournamentModel.Tournament_Players_Result"},"PlayerID":6,"FirstName":"Rory","LastName":"McIlroy","Handicap":null,"StartTime":"\/Date(1365676200000)\/","StartHole":"Hammerhead #1"}]}

Any help would be welcomed!

Thanks,

Greg.
Petur Subev
Telerik team
 answered on 30 Oct 2013
5 answers
1.0K+ views
I did not yet dwelve into the code.
Any provision in the framework to prevent XSS and SQL Injection?
Otherwise, what are recommended best practices?
EC
Top achievements
Rank 1
 answered on 30 Oct 2013
3 answers
97 views
When I run my application on my Lumia 920 or in Chrome using user agent "Mozilla/5.0 (compatible; MSIE 10.0; Windows Phone 8.0; Trident/6.0; IEMobile/10.0; ARM; Touch; NOKIA; Lumia 920)," all the kendo mobile controls are much too big and the application doesn't work at all (see attached screenshot). 

I've only included kendo.mobile.all.min.js, kendo.mobile.all.min.css, and the entire images file in my solution. Any ideas what might cause this?

I see the same issue when I override the user agent in Chrome on the kendo mobile demos site (http://demos.kendoui.com/mobile/m/index.html) but not on my Lumia 920.
Kamen Bundev
Telerik team
 answered on 30 Oct 2013
3 answers
401 views
The documentation is a bit spare on how custom rules should be handled in Validator. E.g., I am assuming that if you have multiple custom rules, they are all handled via decision trees in the "custom" configuration object. And if that is true, then I am assuming you have to do the same for the "message" configuration object if you want to have a different message for each custom rule.

However, it is not clear in the documentation how one should send the specific message text.

E.g., let's say we want to have two custom rules. 

  • One rule checks the "firstname" input field and fails if the value does not include "Tom".  On failure, we want the message for that field to be "Please be a Tom".
  • The other rule checks the "lastname" input field and fails if the value does not include "Smith". On failure, we want the message for that field to be "Please be a Smith".
Based on what examples I can find in the forums, my first guess at how one would do this looks like the following:

$("#myform").kendoValidator({
    rules: {
        custom: function(input) {
            var ret = true;
            if(input.is("[name=firstname]")){
                ret = (input.val() === "Tom");
            }
            else if(input.is("[name=lastname]")){
                ret = (input.val() === "Smith");
            }
            return ret;
        }
        },
    messages: {
        custom: function(input) {
            if( input.is("[name=firstname]") ) {
                    // want the message to say "Please be Tom"
                    return 'Please be a Tom'; // this does not work
                }
                else if ( input.is(["name=lastname]") ) {
                    // want the message to say "Please be Tom"
                    return 'Please be a Smith'; // this does not work
                }
            }
        }
});

The above code is for illustration and has not been actually tested.

However, I do know that the line  return 'Please be Tom'; fails to place any text in the error message.

My hunch is that there is a specific formatting function that must be used. Any hints or leads, here, for what that might be?

TIA
Michael
Top achievements
Rank 1
 answered on 30 Oct 2013
2 answers
205 views
Hi Everyone,
I'm quite new to Kendo UI Mobile on Icenium, and i'm currently trying to refresh the data i have on my mvvm viewmodel, basically i have a view model with a datasource and a function named showView: wich i would like to be called after the view is presented to the user, i tried seeking on the documentation but i wasen't unable to make raise data-show on my viewmodel. Could any one be so kind to provide me a working example, the viewmodel is created like the one on visual studio sample, with an added showView: function().. 
I need this because i need to load  fresh data from localStorage, do some stuff with it and populate the datasource to show a result on the screen.
 
Thanks
Sebastian
Sebastian
Top achievements
Rank 1
 answered on 30 Oct 2013
1 answer
369 views
Dear All,

I have created the web api and deployed it.in the html page using the kendo Ui

"<head>
    <!-- Common Kendo UI Web CSS -->
    <link href="styles/kendo.common.min.css" rel="stylesheet" type="text/css" />
    <!-- Default Kendo UI Web theme CSS -->
    <link href="styles/kendo.default.min.css" rel="stylesheet" type="text/css" />

    <!-- jQuery JavaScript -->
    <script src="js/jquery.min.js"></script>
    <!-- Kendo UI Web combined JavaScript -->
    <script src="js/kendo.all.min.js"></script>

    <title>Dashboard</title>
</head>
<body>

    <div id="example" class="k-content">

        <div class="grid-wrapper">
            
            <div id="grid"></div>

            <script>
                var remoteDataSource = new kendo.data.DataSource({
                    transport: {
                        read: {
                            url: "http://localhost:2704/api/employee",
                            dataType: "jsonp"
                        }
                    },
                    schema: {
                        model: {
                            id: "Id",
                            fields: {
                                Id: { type: "number" },
                                FirstName: { type: "string" },
                                LastName: { type: "string" }
                            }
                        }
                    }

                });


                $("#grid").kendoGrid({
                    dataSource: remoteDataSource,
                    height: 200
                });

            </script>
        </div>

        <div class="table-wrapper">
            <div id="divResult">
                
                <script>
                    function GetAllProducts() {
                        jQuery.support.cors = true;
                        $.ajax({
                            url: 'http://localhost:2704/api/employee',
                            dataType: 'jsonp',
                            success: function (data) {
                                WriteResponse(data);
                            },
                        });
                    }
                    function WriteResponse(products) {
                        var strResult = "<table><th>ID</th><th>FirstName</th><th>LastName</th>";
                        $.each(products, function (index, product) {
                            strResult += "<tr><td>" + product.Id + "</td><td> " + product.FirstName + "</td><td>" + product.LastName + "</td></tr>";
                        });
                        strResult += "</table>";
                        $("#divResult").html(strResult);
                    }

                    $(document).ready(function () {
                        GetAllProducts();
                    });
                </script>
            </div>
        </div>
    </div>
 
</body>"

im calling the the api the response headers are empty.when i access the api it is working fine.Can anyone help how to intergerate the web api with the Kendo UI html pages.
Atanas Korchev
Telerik team
 answered on 30 Oct 2013
3 answers
147 views
Hi, 
I convert my MVC project to use Kendo UI. I have action result return simple Json object status with message if there is an error. It was working fine before I convert.
now it tries IE tries to download the Json, Firefox and Chrome will show it as text.

here is my code. I add  ("text/html", System.Text.Encoding.UTF8, JsonRequestBehavior.AllowGet) I was hoping it will fix it but it didn't

return Json(new { Success = true }, "text/html", System.Text.Encoding.UTF8,
                        JsonRequestBehavior.AllowGet);


 return Json(new { Success = false, Message = formPost.Message }, "text/html", System.Text.Encoding.UTF8,
                        JsonRequestBehavior.AllowGet);




form 

Ajax.BeginForm(new AjaxOptions { OnSuccess = "handleModalSubmit" })

JS


 function handleModalSubmit(result) {

        if (result.Success) {
            alert("Your request was sent Successfully");
            
        }
        else {
            alert("There was problem sending your request");

        }
    }



Here is my Kendo include files 


<link href="@Url.Content("~/Content/kendo.compatibility.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/kendo/2013.2.918/kendo.common.min.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/kendo/2013.2.918/kendo.dataviz.min.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/kendo/2013.2.918/kendo.default.min.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/kendo/2013.2.918/kendo.dataviz.default.min.css")" rel="stylesheet" type="text/css" />    <script src="@Url.Content("~/Scripts/kendo/2013.2.918/jquery.min.js")"></script>

<script src="@Url.Content("~/Scripts/kendo/2013.2.918/kendo.all.min.js")"></script>
<script src="@Url.Content("~/Scripts/kendo/2013.2.918/kendo.aspnetmvc.min.js")"></script>
    <script src="@Url.Content("~/Scripts/kendo.modernizr.custom.js")"></script>
        
Dimo
Telerik team
 answered on 30 Oct 2013
1 answer
76 views
Hi,
There's a bug in scheduler, which can be easily reproduced with your online demos.
- Choose the basic usage demo.
- Doubleclick an event, to get into edit mode
- Change the start Time to 5pm and the end Time to 7pm.
- Save the event.
- Click "show business hours"
As a result, the event is displayed throughout the whole day.
Any chance, to get a fix for that?
Rosen
Telerik team
 answered on 30 Oct 2013
2 answers
454 views
I am using the Multiselect widget along with Kendo MVVM. The tags are stored in an object that is saved to the database, this works fine when creating things.

But when retrieving them is a different story. I can add tags again, that is also fine, but when the item loads in from the database, it won't properly show the existing tag items that belong in the multiselect. So let's say I pull up an item with two tags. . { "Id": "tags/1", "Name" : "C#" }{ "Id" : "tags/2", "Name" : "Kendo UI" } .. these are not persisted into the multi-select box.
$widget = $element.kendoMultiSelect({
    dataTextField: "Name",
    dataValueField: "Id",
    // define a custom template
    dataSource: {
        transport: {
            read: {
                dataType: "json",
                url: $url
            }
        }
    },
    open: function (e) {
        this.list.addClass("tag-cloud");
    },
    close: function (e) {
        //e.preventDefault();
    },
    value: viewModel.get("Tags")
}).data("kendoMultiSelect");
<div style="width: 500px;">
    <h2 class="fg-color-blueDeep">Tags</h2>
    <div class="input-control" data-for="tags">
        <select id="tags" multiple="multiple"
                data-placeholder="Select Tags..."
                class="dark tag-cloud"
                data-bind="value: Tags"
                style="width: 500px;"></select>
    </div>
</div>

Stacey
Top achievements
Rank 1
 answered on 29 Oct 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
Drag and Drop
Application
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
DropDownTree
ListBox
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
LLM Kit
+? more
Top users last month
Simon
Top achievements
Rank 2
Iron
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Marco
Top achievements
Rank 4
Iron
Iron
Iron
Grant
Top achievements
Rank 3
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Simon
Top achievements
Rank 2
Iron
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Marco
Top achievements
Rank 4
Iron
Iron
Iron
Grant
Top achievements
Rank 3
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?