Telerik Forums
Kendo UI for jQuery Forum
14 answers
167 views

I am doing server validation on my create and update requests. However this causes an issue when updating a recurring event as it triggers both a create and update in some situations.

How can I "merge" 2 requests into 1 e.g. when making a recurrence exception by editing only single event?

Simon
Top achievements
Rank 1
 answered on 16 Mar 2019
3 answers
383 views

Note: the documentation on the Kendo menu provides how to close an item, but not the actual menu itself. 

For example, the menu documentation on the Kendo menu states:
//intialize the menu widget
    $("#menu").kendoMenu();
    // get a reference to the menu widget
    var menu = $("#menu").data("kendoMenu");

    // close the sub menu of "Item1"
    menu.close("#Item1");

gregory
Top achievements
Rank 1
 answered on 16 Mar 2019
3 answers
544 views

There is a bug setting the percentage width for a table within the Kendo editor. 

1. Go to https://demos.telerik.com/kendo-ui/editor/index
2. Under Editor / Basic usage select the Table Wizard Icon and click Table Wizard to bring up the Wizard Dialog
3. You will notice that within this dialog the unit options for width and height are only px and em
4. Within this dialog create a table two columns and four rows
5. Place your cursor in one of the table cells again and click the Table Wizard button again to edit the propertied of the new table
6. The unit options for width and height are still only px and em.  Go ahead and enter 100px into the width field and click Ok on the dialog
7. Once again with you cursor in one of the table cells, click the Table Wizard button again.  Now the units options for all widths and heights for tables and cells are px, em and importantly %
8. If I now create a new table via the Table Wizard the unit options available are px, em and % as expected

I logged a previous, different bug about the Table Wizard in github here: https://github.com/telerik/kendo-ui-core/issues/4390 but have had no response, so is this the correct place for bug reports, or github?

 

 

Ivan Danchev
Telerik team
 answered on 15 Mar 2019
2 answers
68 views

I have created a drop down list embedded within my grid using the demo: https://demos.telerik.com/kendo-ui/grid/editing-custom

For some reason when I select an option within the drop down it doesn't send the data back in a format the grid can use, however the default value (if I don't touch drop down) works just fine.

 

My datasource designed as such: 

schema: {
    model: {
        id: "SwitchID",
        fields: {
            SwitchID: { editable: false, type: "number" },
            switchperson: {
                type: "string",
                validation: { required: true, message: "Switchperson information is required." },
            },
            phoneNum: { type: "string" },
            Location: { type: "string" },                  
            SwitchPersonType: { defaultValue: { switchPersontypeValue: "Employee", switchPersontypeID: 1 } },
            //SwitchPersonType: { type: "string" },
             
        },
    },
},

and the kendo grid:

$("#switchpersonTable").kendoGrid({
    dataSource: switchpersonDataSource,
    scrollable: true,
    sortable: true,
    filterable: false,
    pageable: true,
    toolbar: [{ name: "create", text: "Add Switchperson" }],
    columns: [
        { field: "switchperson", title: "Switchperson", width: "200px" },
        { field: "phoneNum", title: "Phone #", width: "200px" },
        { field: "Location", title: "Location", width: "200px" },
        {
            field: "SwitchPersonType",
            title: "Type",
            width: "150px",
            template: "#=SwitchPersonType.switchPersontypeValue#",
            editor: switchPersonTypeDropDownEditor,
        },
        { command: ["edit", "destroy"], title: " ", width: "200px" },
    ],
    editable: "inline",
});

The editor is the built like this:

$(
    '<input required name="' + options.field + '" data-text-field="switchPersontypeValue" data-value-field="switchPersontypeID" data-bind="value:' +
        options.field +
        '"/>'
)
    .appendTo(container)
    .kendoDropDownList({
        autoBind: false,
        dataSource: {
            data: ddlSwitchPersonType,
        },
    });

and the data source for the drop down list:

var ddlSwitchPersonType = [
    {
        switchPersonTypeID: 1,
        switchPersontypeValue: "Employee",
    },
    {
        switchPersonTypeID: 2,
        switchPersontypeValue: "Contractor",
    },
];

If I create an item in the grid and don't touch the dropdown I get the following back in the e.data:

Location: ""
SwitchID: 0
SwitchPersonType:
            switchPersontypeID: 1
            switchPersontypeValue: "Employee"
__proto__: Object
phoneNum: ""
switchperson: "sdaf"
__proto__: Object

But if I select an option (even the default) the data doesn't come back as an object.  It only sets a field called SwitchPerson 

Location: ""
SwitchID: 0
SwitchPersonType: "Employee"
phoneNum: ""
switchperson: "sdf"
__proto__: Object

Any thoughts on the cause of this?

Thanks in advance

Viktor Tachev
Telerik team
 answered on 15 Mar 2019
3 answers
934 views

I have a page that has a value of fleetId that is set by the Router Object.   I also have a dropdown list that is populated with a datasource.   How can I set the selected value when the page(template) first loads?    It works if I set it to a function in the view model but that creates another set of problems (the onChange won't work)

 

 

 <script id="index" type="text/x-kendo-template">   
  
                       <input data-role="items"    
                              data-bind="source: channelFleets, value: selectedfleet,  
                              events: {
                                change: onChange,                   
                              }" 
                              data-text-field="fleetText"
                              data-value-field="fleetId"          
                         
                 
            />

</script>

---------viewmodel.js-----------------------


var viewModelIndex = kendo.observable({

  fleetId: "",// Set by Router 
  selectedfleet: "",   

// Changing the databinding value to this does work.

 //selectedfleet: function() {

               //    return this.fleetId;             
   //  },
  
  items: [
          { fleetId: "Fleet 1", fleetText: "Fleet 1" },
          { fleetId: "Fleet 2", fleetText: "Fleet 2" },
          { fleetId: "Fleet 3", fleetText: "Fleet 3" }
        ],           


   onChange: function() {              
                 var selectedFleet = this.get("selectedfleet");
                 router.navigate("/operations/fleet/" + selectedFleet);
        },


});


Dimitar
Telerik team
 answered on 15 Mar 2019
1 answer
2.9K+ views

Hi,

We are using Kendo Grid control. I have one field which is editable in the grid. Initially, the grid remains in view mode. There is a button outside the grid. Upon clicking the Edit button, I want to make the whole column in edit mode. I want that the whole column should now have textboxes instead of the label. How can I achieve that in Kendo? I am using Kendo Batch editing, but the problem with inline editing mode is, we can only keep one row in edit mode, not all at once.

I found below thread having the same issue as mine but couldn't find the answer.

https://www.telerik.com/forums/dynamically-changing-template-of-a-column-to-make-it-editable

 

Thanks & Regards,

Ankush Jain

Alex Hajigeorgieva
Telerik team
 answered on 15 Mar 2019
3 answers
1.9K+ views
Hi,

We are using kendo grid in angularjs way and in one column we are showing numbers. There is a button outside the grid and we want that on click of the button, we should be able to edit the numbers, i.e. the column showing numbers, each cell in the column should now have a text box and the number in it. Can you please let me know how can I change the template of the column at run-time (on click of a button) to now have text box and the number that was bound, within the textbox?

Appreciate your quick reply.

Thanks,
Sagar
Alex Hajigeorgieva
Telerik team
 answered on 15 Mar 2019
2 answers
204 views

I am trying to change the color of the shape by using the below code. but not working by any way.

please advice what I need to change to set new color to the shape

 

<!DOCTYPE html>
<html>
<head>
</head>
<body>


  <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.1.220/styles/kendo.common.min.css">
  <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.1.220/styles/kendo.rtl.min.css">
  <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.1.220/styles/kendo.default.min.css">
  <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2019.1.220/styles/kendo.mobile.all.min.css">

  <script src="https://code.jquery.com/jquery-1.12.3.min.js"></script>
  <script src="https://kendo.cdn.telerik.com/2019.1.220/js/angular.min.js"></script>
  <script src="https://kendo.cdn.telerik.com/2019.1.220/js/jszip.min.js"></script>
  <script src="https://kendo.cdn.telerik.com/2019.1.220/js/kendo.all.min.js"></script></head>



<div id="diagram"></div>
<script>
    function createDiagram() {
        $("#diagram").kendoDiagram({
            editable: {
                rotate: false,
                resize: false
            },
            pannable: false,
            zoomMax: 1,
            zoomMin: 1,
            shapeDefaults: {
                visual: visualTemplate,
                connect: false
            },
            connectionDefaults: {
                editable:
                {
                    drag: false
                }
            }
        });
    }

  
  
  function Data() {
        try {
           var diagram_data = $("#diagram").data("kendoDiagram");
           var diagram = $("#diagram").getKendoDiagram();
           diagram_data.dataSource.add({
                                    mac_id: "#12345",
                                    power_of_battry_value: "100",
                                    humidity: "60%",
                                    temperature: "33",
                                   
                                });
          //working fine
          diagram.shapes[0].position(new kendo.dataviz.diagram.Point(50, 50));
                      
           // working fine
          diagram.shapes[0].dataItem.mac_id = "mac_id";
          diagram.shapes[0].dataItem.humidity = "humidity";
          diagram.shapes[0].dataItem.temperature = "temperature";
          diagram.shapes[0].redrawVisual();
         
         
          
          // not working  
          diagram.shapes[0].options.fill.color =  "black";
          diagram.shapes[0].redraw();

          // not working  
          diagram.shapes[0].options.fill.color =  "black";
          diagram.shapes[0].redrawVisual(); 
          
          // not working 
          diagram.shapes[0].redraw({
            fill: {
              color: "black"
            }
          });
          
                       
             
        }
        catch (e)
        { alert(e); }
    }
    $(document).ready(function () {
        createDiagram();
        Data();
    });


    

    function visualTemplate(options) {
        var dataviz = kendo.dataviz;
        var dataItem = options.dataItem;
        
        
        var g = new dataviz.diagram.Group({ id: dataItem.mac_id.trim() } );
        g.append(new  kendo.dataviz.diagram.Rectangle({
            id: dataItem.mac_id.trim(),
            width: 140,
            height: 75,
            x: 0,
            y: 0,
            fill: {
                color: "blue"
            }
        }));

        g.append(new dataviz.diagram.TextBlock({
            text: dataItem.mac_id.trim(),
            x: 10,
            y: 10,
            fill: "#fff"
        }));
        g.append(new dataviz.diagram.TextBlock({
            text: "T: " + dataItem.temperature,
            x: 10,
            y: 25,
            fill: "#fff"
        }));
        g.append(new dataviz.diagram.TextBlock({
            text: "H: " + dataItem.humidity,
            x: 10,
            y: 40,
            fill: "#fff"
        }));
       

        return g;
    }

</script></body>
</html>

Mazen
Top achievements
Rank 1
 answered on 14 Mar 2019
2 answers
187 views

Hello,

After I changed  node's display text in client side the node become not selectable.  for example I have treeview as below: 

$("#treeview").kendoTreeView({
  dataSource: [
    { text: "foo", id:"1", items: [
      { text: "AAA",id:"2" } ] }
  ]
});

I changed "AAA" to "BBB"  by button click (see below code). after that I cannot select that node anymore. the node with 'BBB' function as a LABEL. Does anyone has idea how to resolve it?

 

  $("#btn").click(function(){
     var treeview = $("#treeview").data("kendoTreeView");               
      var myDataItem=treeview.dataSource.get(2); 
      var node = treeview.findByUid(myDataItem.uid);
      node.text("BBB");
      treeview.select(node);
     
 });

Daochuen
Top achievements
Rank 1
Iron
Veteran
Iron
 answered on 14 Mar 2019
3 answers
800 views

I am using kendo grid column editor to get autocomplete values in each cell in a column.

If my selected text is digit, then its selecting [object Object] for the first time and after that if I select again different digit, it will select the digit.

And it doesn't happens with the alphabet/alphanumeric text values.

In the below code, If I am selecting "50", it is giving [object Object].

And if I am selecting Test 65/ Test, it will not change.

And if I add space in text ("50 "), them this value will also not change.

please check and resolve the issue.

 

$('<input data-text-field="text" data-value-field="value" data-bind="value:' + options.field + '"/>')
            .appendTo(container)
            .kendoAutoComplete({
                autoBind: false,
                suggest: true,
                filter: "contains",
                index: 1,
                minLength: 1,
                dataSource: [
                    { text: "50", value: "50"},
                    { text: "60", value: "60" },
                    { text: "Test 65", value: "65" },
                    { text: "Test", value: "23" },
                    { text: "64", value: "64" },
                    { text: "20", value: "20" }
                ]
            });

Dimitar
Telerik team
 answered on 14 Mar 2019
Narrow your results
Selected tags
Tags
+? more
Top users last month
Rob
Top achievements
Rank 3
Iron
Iron
Iron
Atul
Top achievements
Rank 1
Iron
Iron
Iron
Alexander
Top achievements
Rank 1
Veteran
Iron
Serkan
Top achievements
Rank 1
Iron
Shawn
Top achievements
Rank 1
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Rob
Top achievements
Rank 3
Iron
Iron
Iron
Atul
Top achievements
Rank 1
Iron
Iron
Iron
Alexander
Top achievements
Rank 1
Veteran
Iron
Serkan
Top achievements
Rank 1
Iron
Shawn
Top achievements
Rank 1
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?