Telerik Forums
Kendo UI for jQuery Forum
1 answer
79 views
Hi, I have a grid with a link in the Action column. In each row is a triangle. I also have a "Link" in the Action column. I wish when I press the link was made as shares of the triangle. How can I do that? Sorry for my english.:P
Kamil
Top achievements
Rank 1
 answered on 17 Apr 2012
1 answer
303 views
Hi.

I'm testing kendoUI but i want to change the theme for android. I'm using ThemBuilder. I copy the CSS and add it to my page. But does not work. Why?

Documentation:
Using the CSS output

Just copy the CSS output to a .css file and include it in your page.

This is my simple code.

<!DOCTYPE html>
<html>
<head>
    <title>Basic usage</title>
    <script src="js/jquery.min.js"></script>
    <script src="js/kendo.mobile.min.js"></script>
    <script src="content/shared/js/console.js"></script>
 
    <link href="styles/kendo.mobile.all.min.css" rel="stylesheet" />
    <link href="styles/silver.css" rel="stylesheet" />
</head>
<body>
    <a href="index.html">Volver</a>
    <div data-role="view" id="tabstrip-profile" data-title="Mi Estado de Cuenta" data-layout="mobile-tabstrip" data-transition="slide" >
    <ul data-role="listview" data-style="inset" data-type="group">
        <li>
            <ul>
                <li><h2>Grupo SAESA<span>Sucursal</span></h2><img src="content/mobile/overview/logo.jpg" /></li>
                <li>Weekly average sales <span class="sales-up">$ 8,250</span></li>
                <li>Monthly average sales <span class="sales-up">$ 32,000</span></li>
            </ul>
        </li>

        <li>
            Languages
            <ul>
                <li>English <span class="value">Native</span></li>
                <li>Hungarian <span class="value">Advanced</span></li>
                <li>French <span class="value">Advanced</span></li>
                <li>Chinese <span class="value">Beginner</span></li>
            </ul>
        </li>
 
    </ul>
</div>
 
<div data-role="view" id="tabstrip-cortes" data-title="Cortes Programados" data-layout="mobile-tabstrip" data-transition="slide">
    <ul data-role="listview" data-style="inset" data-type="group">
        <li>
            SAESA
            <ul>
                <li class="item-title">Lunes 16 de Abril del 2012 Comuna de Valdivia<span class="item-info">Condominio Silos de Torobayo</span><span class="item-hora">10:00 a 16:00</span></li>
                <li class="item-title">Lunes 16 de Abril del 2012 Comuna de Valdivia<span class="item-info">Condominio Silos de Torobayo</span><span class="item-hora">10:00 a 16:00</span></li>
                <li class="item-title">Lunes 16 de Abril del 2012 Comuna de Valdivia<span class="item-info">Condominio Silos de Torobayo</span><span class="item-hora">10:00 a 16:00</span></li>
                <li class="item-title">Lunes 16 de Abril del 2012 Comuna de Valdivia<span class="item-info">Condominio Silos de Torobayo</span><span class="item-hora">10:00 a 16:00</span></li>
                 
                
            </ul>
             
        </li>
         
    </ul>
</div>
 
<div data-role="view" id="tabstrip-rating" data-title="Rating" data-layout="mobile-tabstrip" data-transition="slide">
    <ul data-role="listview" data-style="inset" data-type="group">
        <li>
            Sales Representatives
            <ul>
                <li data-icon="toprated">1. Andrew Fuller</li>
                <li data-icon="toprated">2. Janet Leverling</li>
                <li data-icon="toprated" style="background-color: #3589e7; color: #fff;">3. Carine Callahan</li>
                <li data-icon="toprated">4. Margaret Johnson</li>
                <li data-icon="toprated">5. Steve Collins</li>
                <li data-icon="toprated">6. Maria Steward</li>
            </ul>
        </li>
    </ul>
</div>
 
<div data-role="view" id="tabstrip-settings" data-title="Settings" data-layout="mobile-tabstrip" data-transition="slide">
    <ul data-role="listview" data-style="inset" data-type="group">
        <li>
            Carine Callahan
            <ul>
                <li>Notify when online <input type="checkbox" data-role="switch" checked></li>
                <li>Administrator <input type="checkbox" data-role="switch"></li>
                <li>Access to stats <input type="checkbox" data-role="switch" checked></li>
            </ul>
        </li>
    </ul>
</div>
 
<div data-role="layout" data-id="mobile-tabstrip">
    <header data-role="header">
        <div data-role="navbar">
            <!--<a class="nav-button" data-align="left" data-role="backbutton">Back</a>-->
            <span data-role="view-title"></span>
            <a data-align="right" data-role="button" class="nav-button" href="#index">Index</a>
        </div>
    </header>
 
    <p>TabStrip</p>
 
    <div data-role="footer">
        <div data-role="tabstrip">
            <a href="#tabstrip-profile" data-icon="organize" >Mi Cuenta</a>
            <a href="#tabstrip-cortes" data-icon="recents">Cortes</a>
            <a href="#tabstrip-rating" data-icon="stop">Emergencia</a>
            <a href="#tabstrip-settings" data-icon="settings">Opciones</a>
        </div>
    </div>
</div>
 
 
    <script>
     new kendo.mobile.Application($(document.body), {
         platform: "android"
     });
</script>
</body>
</html>

Please help me


Alex Gyoshev
Telerik team
 answered on 17 Apr 2012
0 answers
147 views
please help me
i want dropdown selected value

<select data-role="dropdownlist" data-text-field="name" data-value-field="value1"
        data-bind="events: { change: dropDownChangeEvent },source: data,value:selectValue">
    </select>


in observable
dropDownChangeEvent: function (e){
 var value = (this).get('selectValue');
                    alert(value);
}


 it will give me previous value not current selected  value
Rahul
Top achievements
Rank 1
 asked on 17 Apr 2012
2 answers
76 views
With a batch edit grid, I wanted to write a method that would warn the user if they try to do a page/sort/filter operation when they have data that hasn't been saved.  I figure I can look for any cases where .k-dirty-cell shows up and if any are found I can launch a confirm dialog that asks "Save changes before continuing?" or something like that.  But what I can't figure out is what event on the grid or datasource I would need to hook into for this logic.  Ideally, I'd want to have it fire before the read() operation is called on the datasource since that would catch pretty much any situation where the data might get overwritten.  Any suggestions on how/if this can be done?

Thanks!

Regards,
Brian
Brian Roth
Top achievements
Rank 1
 answered on 17 Apr 2012
1 answer
109 views
When using remote views, should the transition effects work? When I use a local view transitions works fine, but with remote views the ui just gets refreshed without any transition taking place.

Thanks
Georgi Krustev
Telerik team
 answered on 17 Apr 2012
1 answer
259 views
I have a list of codes that I'd like a user to be able to input into a textbox.  The list of codes will be separated by a comma so they can input n+1.  But I don't want the user to be able to enter a code that isn't in the dataset.  As of right now I have a hard coded data array, but the plan is to use an ASMX web service that returns filtered data based upon what the user has typed.

var data = [
                "M10A",
                "M11A",
                "M12A",
                "M15A",
                "M15B",
                "M15C",
                "M15D",
                "M16A"
            ];
 
//create AutoComplete UI component
$("#<%= txtMailCodes.ClientID %>").kendoAutoComplete({
    dataSource: data,
    filter: "startswith",
    placeholder: "Mailing Codes...",
    separator: ", "
});

I assume I could do something with functions for on input or something along those lines to validate the entry, but I'm hoping there is a property for this.
Georgi Krustev
Telerik team
 answered on 17 Apr 2012
0 answers
150 views
Hello,

  With last Kendo UI version we can edit via  batch/inline/popup, it's great.
  Also great to have localized data on cultures directory.

  Some suggestions :
   1. could you localize your grid.js  (and others) ?

example : kendo.grid.js ln 1404 :
var container = that._editContainer = $(html)
              .appendTo(that.wrapper)
              .kendoWindow(extend({
                  modal: true,
                  resizable: false,
                  draggable: true,
                  title: "Edit",
                  visible: false
              }, options));

Title is "Edit". Sure in english it's OK, but in any other language it's not.


  2. on popup edition could you give us a way to edit model.fields instead of only "colums" ?
example :
   - i have a model with 6 fields : Name (Id), Description, IsValidated, Value, Module, Language
   - i have a table with 4 of those fields (not enought space to show them all) : Name (Id), Value, Module, Language

Actually if i want to use your default implementation of Popup edition,  i can only edit those 4 fields (Name (Id), Value, Module, Language) and not the others due to Grid.js ln 1377 binding on columns :

for (idx = 0, length = that.columns.length; idx < length; idx++)

Could you add an option to bind to model.fields instead, should make sense because it's on model.fields where we defined properties like "editable","nullable" ,etc...   or can you add an editable.columns options giving us a way to edit what we want in the order we want ?

 3. on popup edition , could you document options.editable.template  && editable.template.mode ?
we could see on source code that we can provide a template for edition, could you add sample & documentation ?

example :

<script id="popinEditResource" type="text">
      <div class="k-edit-label"><label for="Language">Langue</label></div>
      <div class="k-edit-field">#= Language #</div>
       
      <div class="k-edit-label"><label for="Name">Nom</label></div>
      <div class="k-edit-field">#= Name #</div>
       
      <div class="k-edit-label"><label for="Module">Module</label></div>
      <div data-container-for="Module" class="k-edit-field"><input data-bind="value:Module" name="Module" class="k-input k-textbox" type="text"></div>
       
      <div class="k-edit-label"><label for="Value">Valeur</label></div>
      <div data-container-for="Value" class="k-edit-field"><input data-bind="value:Value" name="Value" class="k-input k-textbox" type="text"></div>
       
      <div class="k-edit-label"><label for="Description">Description</label></div>
      <div data-container-for="Description" class="k-edit-field"><input data-bind="value:Description" name="Description" class="k-input k-textbox" type="text"></div>
       
      <div class="k-edit-label"><label for="IsValidated">Validé</label></div>
      <div data-container-for="IsValidated" class="k-edit-field"><input data-bind="checked:IsValidated" data-type="boolean" name="IsValidated" type="checkbox"></div>
   </script>

and on Grid definition :
editable: {
          mode : "popup" ,
          template: $("#popinEditResource").html()
      },

 this last sample allow to show only 4 columns on grid & edit 6 colums, but popin template has to be done manually.

thanks for all,
BloP







Blop
Top achievements
Rank 1
 asked on 17 Apr 2012
0 answers
124 views
Hi Guys,

I am exploring Keno ui. Till now its coming great.

Here is what i want to implement :
1. Want to fetch the user current position --  I am able to get the user location using Geolocation object in the HTML5.
2. Want to pass it to url of datasource -- Here is the issue as html5 Geolocation is an asynchronous call. Can you suggest how can i catch & pass the user location to data source url. I want stop execution of code until we get user location.

I am building by referring this example : http://demos.kendoui.com/mobile/listview/pull-to-refresh.html But with location based web serrvice.

Thanks
  
 
VIvek
Top achievements
Rank 1
 asked on 17 Apr 2012
4 answers
81 views
Hi
$("#grid").kendoGrid({
    columns: [
        {field: "Id", title: "â„–"},
        {field: "Text", title: "Text"}
    ],
    dataSource: {
        data: [
            {"Id":"4","Text":"hi"},
            {"Id":"7","Text":"word"}
        ],
        schema: {
            model: {
                id: "Id",
                fields: {
                    Id: {editable: false, validation: {required: true}},
                    Text: {nullable: true}
                }
            }
        }
    },
    scrollable: false,
    sortable: true,
    filterable: true,
    editable: true,
    save: function(e) {
        console.log(e);
    }
}).data("kendoGrid");
If to edit the first row, then the second one, then the first one again, save method is called several times while editing the last time
Rosen
Telerik team
 answered on 17 Apr 2012
2 answers
306 views
TreeView html:
<ul id="ouTreeview">
   <li data-expanded="true" data-ouid="0" data-isexternal="false" data-parentid="0">
      <label>Root Element</label>
   </li>
</ul>

Initializing treeview:

<script language=
"javascript" type="text/javascript">
    var ouTreeview;
    var selectedOUId;
    var selectedOUName;
    var ouTreeviewNode;
    var selectedParentId;
    var selectedOUIsExternal;
 
    function setSelectedTitleById(id) {
        selectedOUName = $(".ouLeftCol:first").find("#ouTreeview:first").find("li[data-ouid='" + id +"']:first").find("label:first").text();
    }
 
    $(document).ready(function () {
        function onSelect(e) {
            ouTreeviewNode = e.node;
            selectedParentId = $(e.node).data("parentid");
            selectedOUIsExternal = ($(e.node).data("isexternal").toString().toLowerCase() ==='true');
            selectedOUId = $(e.node).data("ouid");
            setSelectedTitleById(selectedOUId);
            $.ajax({
                url: "@Url.Action("LoadOUForm", "DashBoard")",
                type: "POST",
                cache: false,
                success: function (response) {
                    $(".ouRightCol").html(response);
                    if (selectedOUId != "ROOT") {
                        $("table.ouForm").find("input[id='ouTitle']").val(selectedOUName);
                        
                        if (selectedOUIsExternal)
                        {
                            $("table.ouForm").find("input[id='ouIsExternal']").attr("checked","checked");
                        }
                        else
                        {
                            $("table.ouForm").find("input[id='ouIsExternal']").removeAttr("checked");
                        }
                    }
                }
            });
        }
        ouTreeview = $("#ouTreeview").kendoTreeView({ select: onSelect });
    });


I need append new tree node to existing tree with my attributes.
Alex Gyoshev
Telerik team
 answered on 17 Apr 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)
SPA
Filter
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
Chat
DateRangePicker
Dialog
Checkbox
Timeline
Drawer
DateInput
ProgressBar
MediaPlayer
ImageEditor
OrgChart
TextBox
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
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
StockChart
ContextMenu
TimePicker
DateTimePicker
RadialGauge
ArcGauge
+? more
Top users last month
Jay
Top achievements
Rank 3
Bronze
Iron
Iron
yw
Top achievements
Rank 2
Iron
Iron
Stefan
Top achievements
Rank 2
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Bohdan
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Jay
Top achievements
Rank 3
Bronze
Iron
Iron
yw
Top achievements
Rank 2
Iron
Iron
Stefan
Top achievements
Rank 2
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Bohdan
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?