Telerik Forums
UI for ASP.NET Core Forum
0 answers
87 views

Hello!

Is it possible to block java script execution in PDF documents in  PDFViewer?

Or maybe it is possible to find out if there is a script in the document?

I will be grateful for any answer.

Ilan
Top achievements
Rank 1
 asked on 02 Jan 2023
1 answer
105 views

Hello, I am trying to change the read action of my child drop down based on the parent drop down value. In my scenario, the read action for my "Assignee" drop down needs to call the appropriate controller based on the "Assignment Type" drop down value. I'm struggling to find documentation on how I can update the drop down data source. I'm assuming the best approach would be to utilize the select event of the parent drop down to then update the child drop down read action, but I need some direction on how to approach this. The following is the setup of my cascading drop down inputs. I'm not sure if it matters, but these are being used in a template for a custom grid command that opens a kendo window popup.


    <div class="k-edit-form-container">
        <style>
            .k-edit-form-container {
                max-height: 600px;
            }

            .k-edit-form-container .k-edit-buttons {
                margin: 0;
                padding: 8px 0px;
            }
        </style>
        <input type="hidden" id="InventoryId" name="InventoryId" value="#:data.Id#" />
        <input type="hidden" id="InventoryTypeId" name="InventoryTypeId" value="#:data.InventoryTypeId#" />
    </div>

    <div class="k-edit-label">
        <label>Assignment Type</label>
    </div>
    <div class="k-edit-field">
    @(Html.Kendo().DropDownList()
            .Name("AssignmentType")
            .DataTextField("Name")
            .DataValueField("Id")
            .OptionLabel("Select Assignment Type")
            .DataSource(source =>
            {
                source.Read(read =>
                {
                    read.Action("GetAssignmentPermissions", "InventoryType").Data("AssignmentTypeData");
                });
            })
            .ToClientTemplate()
        )
    </div>

    <div class="k-edit-label">
        <label>Assign To</label>
    </div>
    <div class="k-edit-field">
        @(Html.Kendo().DropDownList()
            .Name("Assignee")
            .DataTextField("Name")
            .DataValueField("Id")
            .OptionLabel("Select Assignee")
            .DataSource(source =>
            {
                source.Read(read =>
                {
                    read.Action("GetActiveInventoryTypes", "InventoryType").Data("FilterAssignees");
                });
            })
            .Enable(false)
            .AutoBind(false)
            .CascadeFrom("AssignmentType")
            .ToClientTemplate()
        )
    </div>

Aleksandar
Telerik team
 answered on 02 Jan 2023
0 answers
219 views

I've posted my question in a wrong forum,

So I reposted the quesiton again here.

Scenario:

I am trying to enable and disable CheckBoxGroup items,

and it dependes on whether if the categories of the item has values.

For example, If there are two categorie, which are animals and fruits.

If I recieved no datas of fruits, I'll disabled the CheckBoxGroup item "fruits".

What I've tried so far

I search through documents and found this tutorial of the BindTo() method,

However, I got an error message saying "Cannot convert from System.Collections.Generic.List<MyCheckBoxItemModel> to string []

Questions

1. According to the method, how can I convert List<model> to string[] in my .cshtml ?

2. (Extension Question) In the tutorial, I'm awared that in the "InputGroupItemModel" there was a "Enabled" attribute.

Is it mean that if passed it to the front end and attached it with the BindTo() method, the CheckBoxGroup will automatically enable or disable the checkbox item?

(I'll show my code below)

Code

CheckBoxItemDto.cs

 public class CheckBoxItemDto
    {
        //public IDictionary<string, object> HtmlAttributes { get; set; }

        //public string CssClass { get; set; }

        public bool? Enabled { get; set; }

        //public bool? Encoded { get; set; }

        public string Label { get; set; }

        public string Value { get; set; }
    }

CheckBoxItemViewModel.cs

public class CheckBoxItemViewModel
    {
        public List<CheckBoxItemDto> Items { get; set; }

        public string[] CheckBoxGroupValue { get; set; }
    }

MyViewModel.cs

public class EqInstsDataViewModel
    {
        public IEnumerable<MyOtherViewModel> MyOtherViewModel { get; set; }
        public CheckBoxItemViewModel CheckBoxItemViewModel { get; set; }
    }

Controller

 

public IActionResult GetChartPartialView() { try { List<CheckBoxItemDto> checkBoxItemDto = GetCheckBoxItem(); //Get CheckBox Items

CheckBoxItemViewModel checkBoxItem = new CheckBoxItemViewModel() { Items = checkBoxItemDto }; MyViewModel myViewModel = new MyViewModel() { Items = checkBoxItem } return PartialView("~/Views/Shared/_MyPartialView.cshtml", myViewModel); } catch (Exception ex) { return Json(ex.Message); } }

 

public List<CheckBoxItem> GetCheckBoxItem()
        {            
            try
            {
                #region CheckBoxItems

                var itemsList = new List<CheckBoxItemDto>()
                {
                    new CheckBoxItemDto()
                    {
                        Label = "Animals",
                        Value = "1",
                        Enabled = true
                    },
                     new CheckBoxItemDto()
                    {
                        Label = "Friuts",
                        Value = "2",
                        Enabled = false
                    } ,
                };

                #endregion

                return itemList;
            }
            catch(Exception)
            {
                throw;
            }
        }

 

_MyPartialView.cshtml

@(Html.Kendo().CheckBoxGroup()     
        .Name("MyCheckBox")
        .BindTo(Model.CheckBoxItemViewModel.Items)  //Cannot convert from List<CheckBoxItemDto> to string[]
        .Value(Model.CheckBoxItemViewModel.CheckBoxGroupValue)
        .Layout("horizontal")
     )
 
CHIHPEI
Top achievements
Rank 2
Iron
Iron
Iron
 asked on 30 Dec 2022
1 answer
119 views

I have an editor (classic mode) I use in an editor template like @(Html.Kendo().EditorFor(m => m.Content) for a grid to create and update HTML content coming from the database that has inputs and selects. When I first load the content to the editor, I have a processEditorInputs() JavaScript function that loops thru all the inputs and selects in the editor's iframe, adds a css class to them, and adds a dblclick event listener so they can be edited via a kendo dialog I have also in my view. Everything is working fine but I have an issue I have not been able to figure out. After the undo action is performed in the editor, either by ctrl+Z or toolbar action, all my inputs in the editor lose their doubleclick binding and therefore cannot be edited again via the dialog. I tried subscribing to the 'Execute' event of the editor to call my processEditorInputs() function again after undo is performed like below:

function onExecute(e) {
            if(e.name == 'undo'){
                processEditorInputs();
            }            
}

This seems to be only working after executing undo multiple times only and it does not seem reliable.

Here is my editor.

@(Html.Kendo()
        .EditorFor(m => m.Content)
            .StyleSheets(css => css.Add(Url.Content("~/css/site.css?3")))
            .Tools(tools => tools            
            .Clear()
            .ViewHtml()
            .CustomTemplate(ct => ct.Template("<li class='k-tool-group k-button-group' role='presentation'><button type='button' onclick='openInsertCheckbox();' role='button' class='k-button k-button-md k-rounded-md k-button-solid k-button-solid-base k-tool' title='Insert Checkbox'><i class='mdi mdi-checkbox-marked-outline'></i></button><button type='button' onclick='openInsertInput();' role='button' class='k-button k-button-md k-rounded-md k-button-solid k-button-solid-base k-tool' title='Insert Input'><i class='mdi mdi-form-textbox'></i></button><button type='button' onclick='openInsertSelect();' role='button' class='k-button k-button-md k-rounded-md k-button-solid k-button-solid-base k-tool' title='Insert Select'><i class='mdi mdi-form-dropdown'></i></button></li>"))            
            .Undo()
            .Redo()
            .Bold()
            .Italic()
            .Underline()
            .Strikethrough()
            .JustifyLeft()
            .JustifyCenter()
            .JustifyRight()
            .JustifyFull()
            .InsertUnorderedList()
            .InsertOrderedList()
            .Outdent()
            .Indent()
            .CreateLink()
            .Unlink()
            .InsertImage()
            .InsertFile()            
            .SubScript()
            .SuperScript()
            .TableEditing()            
            .Formatting()
            .CleanFormatting()
            .FontName()
            .FontSize()
            .ForeColor()
            .BackColor()
            .Pdf()
            .Print()
            .CustomTemplate(ct => ct.Template("<li class='k-tool-group k-button-group' role='presentation'><button type='button' onclick='insertPageBreak();' role='button' class='k-button k-button-md k-rounded-md k-button-solid k-button-solid-base k-tool' title='Insert Page Break'><i class='fas fa-grip-lines'></i></button>"))
            ).Events(events => events                
                .Execute("onExecute")                
            ))

My javascript functions.

$(document).ready(function () {
        $(".t-placeholder").on("dragstart", function (e) {
            e.originalEvent.dataTransfer.setData("text", $(this).html());
        });  
        processEditorInputs();
    });

function processEditorInputs() {
            let iframe = document.getElementsByClassName('k-iframe')[0];
            let inputElements = iframe.contentWindow.document.getElementsByTagName('input');
            let selectElements = iframe.contentWindow.document.getElementsByTagName('select');

            //inputs
            for (let i = 0; i < inputElements.length; i++) {
                //style                
                styleEditorField(inputElements[i]); 
                //add unique identifier
                if (!inputElements[i].id || inputElements[i].id == '') {
                    var id = generateUniqueId();
                    inputElements[i].id = `input-${id}`;
                }                
                //add double click event listener to edit according to input type (if not already bound only)
                bindEditOnDoubleClick(inputElements[i]);                
            }

            //selects
            for (let i = 0; i < selectElements.length; i++) {
                //style
                styleEditorField(selectElements[i]);
                //add unique identifier
                if (!selectElements[i].id || selectElements[i].id == '') {
                     var id = generateUniqueId();
                    selectElements[i].id = `select-${id}`;
                }               
                //add double click event listener to edit
                bindEditOnDoubleClick(selectElements[i]);
            }
        }

        function generateUniqueId(){
            return Date.now() + Math.floor(Math.random() * 1000000);
        }

        function bindEditOnDoubleClick(input){
            //debugger;
            if($(input).is('select')){
                input.addEventListener("dblclick", function () {
                    openInsertSelect(this);
                });
            }
            else{
                switch (input.type) {
                    // If the input type is text, date, time, number
                    case 'text':
                    case 'date':
                    case 'time':
                    case 'number':
                        input.addEventListener("dblclick", function () {
                            openInsertInput(this);
                        });
                        break;
                    // If the input type is checkbox
                    case 'checkbox':
                        input.addEventListener("dblclick", function () {
                            openInsertCheckbox(this);
                        });
                        break;
                }
            }            
        }

        function styleEditorField(input){
            input.classList.add('k-edt-field');           
        }

I would appreciate your assistance with this matter. Please let me know if more information is needed.

Thanks.

 

 

Alexander
Telerik team
 answered on 28 Dec 2022
0 answers
463 views

How comes this is displaying a checkbox?   This is an ASP.NET CORE app.  I do have the mobile CSS included (not sure if that is required)

Here is the column and template.   It simply renders as a checkbox.

columns.Bound("").ClientTemplateId("switchTemplate");
<script id="switchTemplate" type="text/x-kendo-template">
    <text>
            @(Html.Kendo().Switch()
                .Name("switch#=Id#")
                .Checked(true)
                .ToClientTemplate()
            )
    </text>
</script>

Jordan
Top achievements
Rank 1
Iron
 asked on 28 Dec 2022
1 answer
245 views

Hi

We are having a grid with editable field option which triggers when you click on the field.

I wanted to enable tab functionality so that if you are on any field and click tab it should make the next field enable/editable.

When I am clicking on any field to show like this. On tab press I wanted make Charlotte editable.

ANY help appreciated. Thanks!

1 answer
202 views

Hi,

I saw the question and answer about import excel file to kendo grid back in 2020. Do you have any update on the topic or do you have samples? I have the project that our customers want to import data from excel file to the database. They want to see data in the grid before save to table in database. Is it possible? Any advice. Thank you.

 

Alexander
Telerik team
 answered on 21 Dec 2022
0 answers
137 views

I want to get the value and create a link to redirect to based on the selected result.

But getting undefined.

 function onSelect(e) {

            if (e.item) {
                var dataItem = this.dataItem(e.item.index());
                console.log("event :: select ( index***" + e.item.index + "***: " + dataItem.Text + " : " + dataItem.Value + ")");
            } else {
                console.log("event :: select");
            }
    }


 

    
Zhuo
Top achievements
Rank 1
 asked on 21 Dec 2022
1 answer
1.4K+ views

hi 

i need pass Parameter myTicket_Id from java script to c# in razaor page .

my code is :


<script>
                        function onChange(e) {
                            var selectedRows = this.select();
                            var dataItem = this.dataItem(selectedRows[0]);

                            var myTicket_Id=dataItem.Ticket_Id

                            console.log(dataItem.Ticket_Id);

                        };
                    </script>
                    

                    @{

                        HttpContext.Session.Set("Ticket_Id", myTicket_Id);

                        Response.Redirect("/Ticket?id="  + myTicket_Id );
                    }
thanks
Stoyan
Telerik team
 answered on 20 Dec 2022
1 answer
98 views

Hi

I Need Find Event Row click  server side In asp.net core 6 ,  Razor page.

my code is :

                    @(Html.Kendo().Grid<MSG_UserTicketsList_ForFolderModel>
                        ().Name("grid")
                        .Scrollable()
                        .Selectable(selectable => selectable
                        .Mode(GridSelectionMode.Single)
                        .Type(GridSelectionType.Row))
                        .Events(events => events.Change("onChange"))
                        .Columns(columns =>
                        {
                            columns.Bound(e => e.TicketId).Title(" ").ClientTemplate(
                                "# if ( DoerTicketStatus    == 'False') { #" +
                            "<div class='UnreaedTicket'>" +
                            "# } else { #" +
                            "<div>" +
                            "# } #" +
                            "<div class='main-mail-item' >" +
                            "<div class='main-mail-star'>" +
                            "<i class='typcn typcn-star'></i>" +
                            "</div>" +
                            "<div class='main-img-user'>" +
                            "<img src='" + Url.Content("~/UserImage/") + "#:data.TicketCreatorId#.png' />" +
                            "</div>" +
                            " <div class='main-mail-body'>" +
                            " <div class='main-mail-from'>" +
                            "Ticket#: TicketId # &nbsp; &nbsp; #: MyName # (#: UserName #) " +
                            "</div>" +
                            "<div class='main-mail-subject'>" +
                            "<strong>#: Subject #</strong>" +
                        @*      "<div class='row'>&nbsp; #: Subject # &nbsp;</div>"+*@
                        "</div>" +
                        "</div>" +
                        "<div class='main-mail-date'>" +
                        "#: LastUpdateDate #" +
                        "</div>" +
                        "</div>" +
                            "</div>"
                                );
                        })
thanks

 

Stoyan
Telerik team
 answered on 20 Dec 2022
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
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
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?