Telerik Forums
Kendo UI for jQuery Forum
2 answers
578 views
I have used the following trick (which I saw in this forum) to create Kendo windows that have no <div id='xxxx'> in the HTML source. But it is not working for ListViews:

$("<div id='ColumnNamesTMP' />").kendoListView({
     dataSource: dataSource,
     pageable: false,
     dataBound: function(e) {
         var html = $("#ColumnNamesTMP").html();
         GridData.columnChooser.content(html);
     },
     template:kendo.template(template)
 });
The dataBound function is never being called.

However, if I add  <div id="ColumnNames" style="visibility: hidden;"/> to the source HTML file, then the dataBound function is called and GridData.columnChooser (which is a kendoWindow) has it's contents filled in. But as you see I have to go and use jQuery to rip out the <DIV> from the DOM:

$("#ColumnNames").kendoListView({
    dataSource: dataSource,
    pageable: false,
    dataBound: function(e) {
        var html = $("#ColumnNames").html();
        $("#ColumnNames").remove();
        GridData.columnChooser.content(html);
    },
    template:kendo.template(template)
});

I can use http://handlebarsjs.com to do this sort of template generation of HTML, but I am looking for a KENDO only solution if possible.

If you are wondering why I want to completely dynamically created kendoList, the answer is that the the list is going to be placed in a kendoWindow that is also created on the fly and added to the DOM:

$("<div id='colChooser'/>").kendoWindow({
    actions:["Maximize", "Minimize", "Close"],
    width:"14em",
    height:"25em",
    title:"Choose Columns",
    modal:true
});
GridData.columnChooser = $("#colChooser").data("kendoWindow");

the content will be filled in later with:
GridData.columnChooser.content(html);







Dr.YSG
Top achievements
Rank 2
 answered on 04 Jul 2012
3 answers
789 views
Setting step for a NumericTextBox seems to only affect the behaviour of the spinners.
"Manual" user input is not validated, so the user can enter numerals that aren't multiples of the step value.
Neither does using a Kendo Validator work.

See this fiddle:

http://jsfiddle.net/Ns6sd/2/ 
Alexander Valchev
Telerik team
 answered on 04 Jul 2012
0 answers
66 views

In the kendo.grid.js I can see a line:

html += kendo.attr("title") + '="' + th.title.replace(/'/g, "\'") + '" '

Please look at replace part. It replaces apos with apos.
I think your intention was to handle quot.

Thanks.

 

 

Vladimir
Top achievements
Rank 1
 asked on 04 Jul 2012
5 answers
282 views
Hi,

I am having a table with three columns Id,name and Bit
I want to display the names of the tabstrip from the name column which contains some names
and the i want to display the content also based on the bit filed the bit filed is a boolean value
i.e either true or false.If the bit filed is 0 i want to display some content and if the bit field is 1 i want
to display another content.And i am trying to do this entire process dynamically.

Is it possible using kendoUI,please provide me sample or examples

Thanks
Alexander Valchev
Telerik team
 answered on 04 Jul 2012
2 answers
222 views
 I have problem with de popup editable i have the next code is equals that example to kendo,but does not work:

<div id="example" class="k-content">
      <div id="grid">
      </div>
      <script type="text/javascript">
            $(document).ready(function () {
                  var crudServiceBaseUrl = "http://demos.kendoui.com/service",
                        dataSource = new kendo.data.DataSource({
                              transport: {
                                    read: {
                                          url: crudServiceBaseUrl + "/Products",
                                          dataType: "jsonp"
                                    },
                                    update: {
                                          url: crudServiceBaseUrl + "/Products/Update",
                                          dataType: "jsonp"
                                    },
                                    destroy: {
                                          url: crudServiceBaseUrl + "/Products/Destroy",
                                          dataType: "jsonp"
                                    },
                                    create: {
                                          url: crudServiceBaseUrl + "/Products/Create",
                                          dataType: "jsonp"
                                    },
                                    parameterMap: function (options, operation) {
                                          debugger;
                                          if (operation !== "read" && options.models) {
                                                return { models: kendo.stringify(options.models) };
                                          }
                                    }
                              },
                              batch: true,
                              pageSize: 30,
                              schema: {
                                    model: {
                                          id: "ProductID",
                                          fields: {
                                                ProductID: { editable: false, nullable: true },
                                                ProductName: { validation: { required: true} },
                                                UnitPrice: { type: "number", validation: { required: true, min: 1} },
                                                Discontinued: { type: "boolean" },
                                                UnitsInStock: { type: "number", validation: { min: 0, required: true} }
                                          }
                                    }
                              }
                        });


                  $("#grid").kendoGrid({
                        dataSource: dataSource,
                        pageable: true,
                        height: 400,
                        toolbar: ["create"],
                        columns: [
                            { field: "ProductName", title: "Product Name" },
                            { field: "UnitPrice", title: "Unit Price", format: "{0:c}", width: "150px" },
                            { field: "UnitsInStock", title: "Units In Stock", width: "150px" },
                            { field: "Discontinued", width: "100px" },
                            { command: ["edit", "destroy"], title: "&nbsp;", width: "210px"}],
                        editable: "popup"
                  });
            });
      </script>
</div>
look at the  image , the file attached, the popup does not work, 

Trevor
Top achievements
Rank 1
 answered on 04 Jul 2012
1 answer
171 views
Hi,

I don't know if this is the right forum for this question.

I am brand-new to Kendo.  I have not even started using it.  Just studying it to understand its advantages.  I have a WCF Data Service server application.  On the server side, I have two .NET C# projects in my solution; one WCF Service application where I have defined the entity model and the RESTful Data Service classes.  I can use the browser to query my model and everything seems to be OK.  I also have a Client asp.net application (which I intend to port to HTML5 with the help of Keno UI).  Right now, my concern is how would I handle the model updates from the Kendo app.  I have seen some example code out there on the internet to "query" cross domain using jQuery and JASONP and I have also seen a blog post on Kendo doing the same thing using Kendo's own API.  But I have not seen any sample about how to do this for model updates such as 'PUT', 'POST' etc.

Can somebody point me to some sample code to acoomplish this please.  I really appreciate it.

Babu.
Alexander Valchev
Telerik team
 answered on 04 Jul 2012
1 answer
194 views
Hello,
I am pretty new to kendo ui and i am trying to get a simple example to work. I have created a REST based web service using asp.net web api which returns IQueryable<> ( so supposedly it supports odata). I can verify that it returns data using a browser.

I have another page in the same application that has a kendo grid in which i am trying to display data returned from the service, the code is 

<div id="body">
    <div id="grid"/>
        @Scripts.Render("~/bundles/jquery")
        <script src="../Scripts/Kendo/kendo.all.min.js" type="text/javascript"></script>
         <script src="../Scripts/Kendo/kendo.web.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function () {
                $("#grid").kendoGrid(
        {
            dataSource:
            {
                type: "odata",
                transport:
                {
                    read: "http://localhost/MSDNWebApi/Api/Movie"
                }
            }
        })
            });  
        </script>
 </div>   
I can confirm using chrome's development tools that the there are no errors and all the requests from the server are working. I can also confirm that the service is returning json data when the kendo ui makes the call, however the ui does not display any data..

I read somewhere that it needs a jsonp format, but i am hoping that its only needed for cross domain conversation.
any help will be appreciated.
Attached the output from the service....
thanks



Alexander Valchev
Telerik team
 answered on 04 Jul 2012
0 answers
165 views
$(document).ready(function () {
    $("#grid").kendoGrid({
        dataSource: reportDS,
        columns: [
                    { field: "ProductID", title: "Product ID", width: "25%" },
                    { field: "ProductName", title: "Product Name", width: "25%" }
                 ]
    }); 
});
var urls = "http://....../GetData";
var reportDS = new kendo.data.DataSource({
transport: {
        read: {
            url: urls,
            dataType: "jsonp",
        }
    },
    schema: {
        type: "json",
        data: function (data) { return eval(data.Result); }
    },
    requestStart: function (e) {
        alert("Requested Started");
    },
    change: function (e) {
        alert("Change");
    },
    error: function (xhr, textStatus) {
        alert("Error : " + xhr.xhr.status);
    },
    /*error: function (e) {
    var xhr = e.xhr;
    var statusCode = e.status;
    var errorThrown = e.errorThrown;
    document.getElementById("Error").innerHTML = xhr + statusCode + errorThrown;
    },*/
});




Hello,
I am trying to trace server error like
400 Bad Request
401 Unauthorized
402 Payment Required
403 Forbidden
404 Not Found
405 Method Not Allowed
and want to display custom message for user.  
Above code work fine when my service is running whereas when i stop my service and restart my kendo application. I get error Error : 200 as alert in internet Explore 8 and no message/alert box  in Google Chrome and FireFox..
Please help me out to clear my mistake...

Thanks and regard,
Deepak
Engifaar
Top achievements
Rank 1
 asked on 04 Jul 2012
1 answer
366 views
I can't see any difference between the two.
Any subtle difference?
I was expecting ActivateTab to enable a tab if disabled and select it.
But that's not the case.
Kamen Bundev
Telerik team
 answered on 04 Jul 2012
0 answers
151 views
Hello,
I am using Kendo datasource with RESTFUL WCF Service. It is working fine with every aspect. Now i want to trace Service status(Open /Closed) and want to display user friendly error message such as "Server is temporarily down!!"
Can anyone plz helk me out...
Thank you,
Deepak 
Engifaar
Top achievements
Rank 1
 asked on 04 Jul 2012
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
ScrollView
Switch
TextArea
BulletChart
Licensing
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
FloatingActionButton
CircularGauge
ColorGradient
ColorPalette
DropDownButton
TimeDurationPicker
ToggleButton
ContextMenu
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
DateTimePicker
RadialGauge
ArcGauge
AICodingAssistant
SegmentedControl
+? more
Top users last month
Boardy
Top achievements
Rank 2
Veteran
Iron
Benjamin
Top achievements
Rank 3
Bronze
Iron
Veteran
ivory
Top achievements
Rank 1
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
ClausDC
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Boardy
Top achievements
Rank 2
Veteran
Iron
Benjamin
Top achievements
Rank 3
Bronze
Iron
Veteran
ivory
Top achievements
Rank 1
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
ClausDC
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?