Telerik Forums
Kendo UI for jQuery Forum
2 answers
3.2K+ views

Even though many similar topics can be found on the internet, I wasn't able to bind my dropdownlist value within a scheduler template:

 

this is my code within the template:

 

<div class="k-edit-label"><label for="trainerId">Trainer</label></div>

<div data-container-for="trainerId" class="k-edit-field">
    <input id="trainerId" name="trainerId"
           data-bind="value:trainerId"
           data-role="dropdownlist" />
</div>

 

the dropdownlist is beeing created by edit event of scheduler:

 

  // Creating dynamic dropdown
            e.container.find("#trainerId").kendoDropDownList({
                dataTextField: "Text",
                dataValueField: "Value",
                change: function(e) {
                   
                },
                dataSource: {
                    transport: {
                        read: {
                            type: 'post',
                            dataType: "json",
                            url: '@Url.Action("Trainers_List","Trainer")',
                        }
                    }
                }
            });

 

Fiddler shows :

'TrainerId' is listed in the body but has no value.

Instead there are other fields like:

trainer.Disabled,

trainerId.Sorting,

trainerId.Value which actually holds the correct value.

 

What am I doing wrong here?

Dimitar
Telerik team
 answered on 22 May 2018
1 answer
114 views

Hi,

I'm using a custom popup edit template for my grid where I'm using a datetimepicker with data attributes.

I would like to use disableDates function to allow only a range between [PlannedFromTemp, PlannedToTemp], but until now I was not able to pass the "date" argument in the function as in the documentation here.

 

How can I pass the "date" in my test function as in the documentation, but in my concrete custom template?

 <input id="Timefrom" name="Timefrom"
               data-type="date"
               data-role="datetimepicker"
               data-bind="value: Timefrom"
               data-format="dd.MM.yyyy HH:mm"
               data-time-format="HH:mm"
               data-disable-dates="#= test(date, PlannedFromTemp, PlannedToTemp) # " 
             
              />

 

Thank you in advance,

 

 

Alex Hajigeorgieva
Telerik team
 answered on 22 May 2018
8 answers
4.6K+ views

Hello

Based on API documentation there is no method/option to enable/disable action buttons defined in a dialog. 

Is there a way to enable/disable action buttons in a dialog?

Regards

 

Tayger
Top achievements
Rank 1
Iron
 answered on 22 May 2018
2 answers
3.7K+ views

Hello

I'm using a dialog widget. By default the dialog closes on clicking on any defined action buttons. I would like to prevent that and close the dialog programmatically. How can I set the defined action buttons to not close after clicking on them?

Regards

Tayger
Top achievements
Rank 1
Iron
 answered on 22 May 2018
2 answers
123 views

Is the custom download builder still being updated for the R2 2018 update? I'd like to add DropDownTree to my custom bundle but the list of components is empty for 2018.2.516.  CDN seems to be updated as I can navigate manually to kendo.dropdowntree.min.js

Preslav
Telerik team
 answered on 22 May 2018
1 answer
859 views
For the life of me, I cannot find out how to update a row's group when I'm using drag and drop to drop a row from one group to another.
Here is my grid's schema:
//Defines grid of main Kendo grid for Questions
   $scope.questionsDataSource = new kendo.data.DataSource({
       autoSync: true,
       schema: {
           model: {
               fields: {
                   GroupId: { type: "int", editable: false },
                   GroupName: { type: "string", editable: false, title: "Group" },
                   GroupSortOrder: { type: "int", editable: false },
                   Id: { type: "int", editable: false },
                   Text: { type: "string", editable: true },
                   AnswerTypeLU: { type: "int", editable: false },
                   RowNumber: { type: "int", editable: false },
                   IsRequired: { type: "bool", editable: false },
                   IsHidden: { type: "bool", editable: false },
                   AllowNotes: { type: "bool", editable: false },
                   AllowAttachFiles: { type: "bool", editable: false },
                   Special: { type: "string", editable: false },
                   Response: { type: "string", editable: false },
                   AnswerId: { type: "int", editable: false },
                   AnswerValue: { type: "string", editable: false },
                   CorrectAnswer: { type: "bool", editable: false },
                   AnswerBitValue: { type: "int", editable: false },
                   AnswerArray: { type: "string", editable: false },
               }
           }
       },
       //This allows the Kendo grid to group questions based on the group they are in
       group: {
           field: "GroupName"
       },
       //Sets default sort order for table. Current settings sorts by row and number
       sort: [ { field: "RowNumber", dir: "asc" }]
   });




Here is my grid:
$scope.questionsGrid = {
        dataSource: $scope.questionsDataSource,
        scrollable: false,
        sortable: true,
        selectable: 'multiple',
        resizable: true,
        persistSelection: true,
        filterable: true,
        reorderable: true,
        editable: false,
        columnMenu: true,
        excel: {
            fileName: "questionnaire.xlsx",
            allPages: true,
            proxyURL: "/Common/FileHandlers/KendoSaveFile.aspx"
        },
        toolbar: kendo.template('<div class="toolbar">' +
            '<a type="button" id="questionsGridExport" class="btn btn-default k-button-icontext k-grid-Export pull-right"><span class="k-icon k-i-excel"></span>Export to Excel</a>' +
        '</div>'),
        dataBound: function (e) {
            $scope.dataBound(e);
        },
        columns: [ //Add, remove, or customize kendo columns here
            ////{ field: "GroupName", template: "#=GroupName#", groupHeaderTemplate: "Group: #=value#" },
            //{ title: '<input onclick=\'selectAll(this)\' type=\'checkbox\' />', template: "<input class='checkbox' type='checkbox' />", width: "30px" },
            { field: "RowNumber", title: "#", width: "10px" },
            {
                field: "Text", title: "Question",
                groupHeaderTemplate: "Name: #:count#",
                template:
                    //Quick Kendo Tip: 'dataItem' is key for plugging in data
                    //These 3 rows add icons for if the question is required, notes are allowed, and if attach files are allowed
                    "<i ng-show='questionAddon(dataItem.IsRequired)' style='color:red; float:right;' class='fa fa-asterisk addon pull-right;'></i>" +
                    "<i ng-show='questionAddon(dataItem.AllowNotes)' style='color:orange; float:right;' class='icon icon-note addon'></i>" +
                    "<i ng-show='questionAddon(dataItem.AllowAttachFiles)' style='color:dodgerblue; float:right;' class='icon  icon-cloud-upload addon'></i>" +
                    "<i ng-show='questionAddon(dataItem.MultiFileUpload)' style='color:purple; float:right;' class='fa fa-copy addon'></i>" +
                    "#: Text #" //Kendo template function overides anything that would normally show in the 'field'. So you need to have '#: fieldName #' included in the template to show the field data
            },
            { field: "IsRequired", title: "Required", template: "{{Is_Required[dataItem.IsRequired]}}" },
            { field: "AnswerValue", title: "Answer" },
            { field: "AnswerTypeLU", title: "Type", template: "{{AnswerTypeLUCodes[dataItem.AnswerTypeLU]}}" },
            {
                title: "Edit",
                template: "<button class='btn btn-default' data-target='.edit-question-modal' ng-click='editQuestion(dataItem)' data-toggle='modal' style='margin:0px; padding:2px 5px 2px 5px;'><i class='fa fa-pencil' title='Edit' style='margin-right:5px;'></i>Edit</button>",
                width: "30px",
            },
            { field: "questionId", hidden: true, title: "Id", template: "{{dataItem.Id}}" },
        ]
    }


And this is the "change" event function. I would have thought there would be something in the "e" (event parameter) of the change event that tells me the new group I'm dropping this row into. That's all I need to know and I can do the rest:

$scope.sortableOptions = { //This needs it's own Kendo sortable wrapper to make the table sortable in the HTML doc
        filter: ".k-grid tr[data-uid]",
        //cursor: "move",
        placeholder: function (element) {
            return element
            .clone()
            .removeAttr("uid")
            .addClass("k-state-hover")
            .css("opacity", 0.65);
        },
        container: ".k-grid tbody",
        change: function (e) {
            var grid = $scope.questionsGrid;
            var oldIndex = e.oldIndex;
            var newIndex = e.newIndex;
            var dataItem = grid.dataSource.getByUid(e.item.data("uid"));
 
            // reorder the datasource
            if (newIndex != oldIndex) {
                grid.dataSource.remove(dataItem);
                grid.dataSource.insert(newIndex, dataItem);
            }
 
            var droppedQuestions = $.grep($scope.questionnaire.FlatQuestions, function (data, index) {
                return dataItem.Id === data.Id;
            });
            var questiontoUpdate = droppedQuestions[0];
            questiontoUpdate.SortOrder = newIndex;
            questiontoUpdate.RowNumber = newIndex + 1;
 
            var questionsGrid = $("#questionsGrid").data("kendoGrid");
            var data = questionsGrid.dataSource.data();
            var totalNumber = data.length;
            var csv_sorted_questioIds = "";
 
            var currentGroupId = null;
            var currentGroupName = "";
            var currentGroupSortOrder = 0;
            var needToSaveQuestion = false;
 
            // get the list of questionIds in the order we want
            for (var i = 0; i < totalNumber; i++) {
                var currentDataItem = data[i];
                // get the group info of the current data item
                currentGroupId = currentDataItem.GroupId;
                currentGroupName = currentDataItem.GroupName;
                currentGroupSortOrder = currentDataItem.GroupSortOrder;
 
 
                if (csv_sorted_questioIds === "") {
                    csv_sorted_questioIds = currentDataItem.Id.toString();
                }
                else {
                    csv_sorted_questioIds += "," + currentDataItem.Id.toString();
                }
 
                if (newIndex === i && questiontoUpdate.GroupId !== currentGroupId) {
                    // update the row with the new group info
                    questiontoUpdate.GroupId = currentGroupId;
                    questiontoUpdate.GroupName = currentGroupName;
                    questiontoUpdate.GroupSortOrder = currentGroupSortOrder;
                    needToSaveQuestion = true;
                }
            }
 
            $scope.saveQuestionSortOrder($scope.clientData.EventId, $scope.clientData.QuestionnaireId, $scope.questionnaire.HostCompanyId, $scope.questionnaire.Name, $scope.questionnaire.Label, csv_sorted_questioIds);
        }
    };

Stefan
Telerik team
 answered on 22 May 2018
1 answer
132 views

    Hello guys,

I cannot download KendoUI package from Download section after sign-in to my account. For example link does not work:

 

https://downloads.cdn.telerik.com/86ac2829dca059e45bfc261705c874ed_kendoui.for.jquery.2018.2.516.commercial.7z_2018.2.516?Expires=1526712767&Signature=NpNf7~yk4Qvp1PtkdBAYb9xzGqPaEgVjYOT-BcQpjD9w-iM7lL1WvTtjT4btZmOPO28x33drVh1Iq5j0TOAMsmzqUvU3e4nIu6JMqhRCzN7HFy0YsLlBZJ~0pila8Te7K40A3w6H4wPHAFS-0wDJ21szpttUNjU~b0uXD7ASL5YqxL14oaLv8OqOvw9c6cTeQa3YLB2DY8UF8IVQkG2wv2-rYFAUFdVw111FRhXRU-C5tm407Uee4DEwuAu9fxmo-tLdD0K5P2P9tW5N5BhZT2AFesqI5iDlNqzufeDjVpxj35SkbFS4cmGr9UwLmDRcIc30Stakhv2rGXV1ln5bkA__&Key-Pair-Id=APKAJARUJ5BRNXKUUAFQ

 

Problem with CND downloads.cdn.telerik.com?

 

 

 

Dimitar
Telerik team
 answered on 21 May 2018
8 answers
1.0K+ views

I have this code but it acts weird:

<div id="relatedCirculars"></div>

<script src="kendo/jquery.min.js"></script>
<script src="kendo/kendo.all.min.js"></script>

<script>
var relatedCirculars = [{ Title: "Test1", URL: "http://adres/test1.docx" }, 
{ Title: "Test2", URL: "http://adres/test2.docx" }];


  $("#relatedCirculars").kendoGrid({
    dataSource: {
      data: relatedCirculars,
      autoSync: true,
      schema: {
        model: {
          fields: {
            Title: { validation: { required: true } },
            URL: { validation: { required: true }}
          }
        }
      }
    },
  toolbar: ["create"],
  columns: [
    {
      field: "Title"
    },
    {
      field: "URL"
    },
    {
      command: ["edit", "destroy"],
      title: "&nbsp;",
      width: "250px"
    }
  ],
  editable: "inline"
});

</script>

 

 

At any point, the content of "relatedCirculars" is not changed.

While editing and clicking on the second field, the edition is finished.

Validation seems not to work.

Cancel is not working.  

Any idea what's missing?

 

 

 

Clarissa
Top achievements
Rank 1
 answered on 21 May 2018
4 answers
1.8K+ views

Hi, I need know if exist some way to show a progress bar while the excel export is executing like pdf export.

Regards

 

Viktor Tachev
Telerik team
 answered on 21 May 2018
9 answers
1.9K+ views

I'm working on the bug where one screen has a grid that contains a column showing numbers, but when I try to filter it, it has "contains" option.
When I type 0, I'm getting an error.
I need to filter that column as a number not as a string.

This is the fragment of the code:

<p>columns.Bound(x => x.DebitAmount).Title("Debit").Width(300).ClientTemplate("#=kendo.toString(DebitAmount,'c') #").ClientFooterTemplate("#=kendo.toString(sum,'c') #");
columns.Bound(x => x.CreditAmount).Title("Credit").Width(300).ClientTemplate("#=kendo.toString(CreditAmount,'c') #").ClientFooterTemplate("#=kendo.toString(sum,'c') #");
 
...............................other columns..........................

 

.Filterable(ftb => ftb.Mode(GridFilterMode.Menu)
       .Extra(false)
       .Operators(operators => operators
       .ForString(str => str.Clear()
       .Contains("Contains")
       .IsEqualTo("EqualTo")
       .IsNotEqualTo("NotEqualTo")
       .IsEmpty("Empty")))
       .Operators(operators => operators
       .ForNumber(str => str.Clear()
      .IsEqualTo("EqualTo")
      .IsGreaterThan("GreaterThan")
      .IsLessThan("LessThan")
       )).Messages(m => m.IsFalse(" False "))
    .Messages(m => m.IsTrue("True ")))

 

The model declares those fields as decimal

The generated columns show "Contains" filter, even though the value are decimal

 

I have another screen that shows decimal number as well, where filter is defined the same way, however, it does not include "contains" filter option.

This is the code:

columns.Bound(c => c.Amount).Title("Amount").ClientTemplate("#= kendo.toString(Amount,'c')#").Width("120px");
 

.................other columns.................

 

.Filterable(ftb => ftb.Mode(GridFilterMode.Menu)
    .Extra(false)
    .Operators(operators => operators
    .ForString(str => str.Clear()
    .Contains("Contains")
    .IsEqualTo("EqualTo")
    .IsNotEqualTo("NotEqualTo")
    .IsEmpty("Empty")))
    .Operators(operators => operators
    .ForNumber(str => str.Clear()
   .IsEqualTo("EqualTo")
   .IsGreaterThan("GreaterThan")
   .IsLessThan("LessThan")
    )))

Everything seems the same (except of messages part) when defining the filter operations, but somehow, on the first screen, the "contains" operation is included and on the second is not.
What am I missing?

 

 

Stefan
Telerik team
 answered on 21 May 2018
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?