Questions on UI for ASP.NET MVC Forum

0 answers

95 views

Telerik Editor (in Sitecore) is dropping data-* attributes during pasteHtml() call

I am in the process of creating a custom action for the Editor in Sitecore, which I can see is a Telerik component.

My action builds a <span> tag around selected text containing class, data-toggle, data-target attributes like this:

<span class="myclass" data-toggle="modal" data-target="#targetid">Text</span>

It does this by building the HTML in javascript and calling (editor).pasteHtml() to replace the selected text with the annotated text.

However, I've run into cases where if there's an existing <span> tag in the backing HTML wrapping the text, all of the data-* attributes disappear.

<span style="color: #000000;">My Text</span>
<!-- converts to -->
<span style="color:#000000;" class="myclass">My Text</span>

This only happens when I select the full "My text" string between the span tags; if I select just "Text", it will work fine. This leads me to believe that the editor wants to be smart and consolidate the span tag attributes (Good!) but either skips or ignores the data-* attributes (Boo!)

I have the following questions:

Is this expected behaviour from the Telerik editor, or possibly a customization implemented by Sitecore? (I'm not quite certain how to get the version of the Editor script in use here)
Is there an allow-list type parameter that could be configured on the editor to enable the merging of data-* attributes during the pasteHtml() call?

Thanks in advance!

Editor

asked on 19 Sep 2022

1 answer

120 views

Reading Data from NumericTextBox to contoller

I am having trouble understanding what would be process for either passing a value I have declared in the controller written in CS or capture the data inputted and then bring it to the controller to be used.

NumericTextBox

answered on 16 Sep 2022

1 answer

118 views

Dropdownlist in kendogrid cell is not working fine

Hello,

I have declared a column in a kendo grid as foreignkey, data to be selected is set with as follows:

columns.ForeignKey(mo => mo.CodKit, (System.Collections.IEnumerable)ViewBag.listKitMuestra, "idKit", "Descripcion").Title("Fabricante de Kit").Width(120);

where idKit is an integer and Descripcion is a string var.

The objects presented in kendoGrid have the CodKit field defined as int? and when I Create a row (inline edition used) when save button clicked, the value for CodKit is not sent in the objetct to controller. If is an edition of a row with no value for this field and it´s setted to an option of the dropdownlist, kendoGrid acts as it was not changes in row an even not call to controller. Ignores that column.

Only works if row has yet value for this column when load items from database and you change the value selecting from dropdownlist another value, in this case is sent to controller in the objetct when update button is clicked.

I use incell dropdownlist with int values in several kendoGrids and no problem. But this case with int? is not working correctly or i´m doing something wrong.

Thanks

Best regards,.

DropDownList

Grid

answered on 15 Sep 2022

0 answers

137 views

how to conditionally click a checkbox based on another cells length when the user tabs out or clicks out of a cell

https://stackoverflow.com/questions/73719432/how-to-conditionally-click-a-checkbox-in-telerik-grid-based-on-another-column-in

function onSave(e) 
    {

        //console.log(e.container.find("input[name=eTmfCompletenessComment]").val());

        //if (e.values.eTmfCompletenessComment.length > 3) 
        //{
        //    e.values.eTmfCompletenessActive == true;
        //}
        
        //if (e.container.find("input[name=eTmfCompletenessComment]").val().length > 3) 
        //{
        //    console.log(e.container.uid);
        //    //checkbox cell is in editmode
        //    e.container.find("input[name=eTmfCompletenessActive]").checked == true;
        //    //e.container.item.find("input[name=eTmfCompletenessActive]").checked == true;
            
        //}
       
        $(document).on("keyup", "#eTmfCompletenessComment", function () {
            function dirtyField(data, fieldName) {
                if (data.dirty && data.dirtyFields[fieldName]) {
                    return "<span class='k-dirty'></span>"
                }
                else {
                    return "";
                }
            }

             var commentcheck = $(this).val()
             console.log('$(this).val() =', $(this).val())

                var grid = $('#Grid').data("kendoGrid");
                var items = grid.items();
                if (commentcheck.length > 3) {
                    //var gc = $(this).parents(".k-")
                    $(this).parents(".k-master-row").find('input[type="checkbox"]').prop("checked", true);
                   //items.each(function () {
                        var dataItem = $(this).parents(".k-grid-cell").find('input[type="hidden"]');
                       set.dataItem.dirty = true;
                       dataItem.set(true);
                       dataItem.dirtyField.set(true, eTmfCompletenessActive)

                    //})
                 
                }
            })

        console.log("onSave");
    }

Checkbox

Editor

Grid

asked on 14 Sep 2022

0 answers

131 views

ForeighnKey column in detail template not working

I have a grid, with a nested sub grid using a detail template.

<div class="card">
    <div class="card-body">

        @(Html.Kendo().Grid<SimpleReportMenu.Models.User>
    ()
    .Name("Grid")
      .Events(e => e.Edit("onEdit"))
      .Editable(editable => editable
        .Mode(GridEditMode.PopUp))
    .Columns(col =>
    {
        col.Bound(o => o.ID).Title("ID");
        col.Bound(o => o.UserName).Title("User Name");
        col.Bound(o => o.FullName).Title("Full Name");
        col.Bound(o => o.Admin).Title("Admin?");

        col.Command(command => { command.Edit().Text(" "); command.Destroy().Text(" "); });

    })

      .ClientDetailTemplateId("subdetailsTemplate")


     .ToolBar(commands => commands.Create())
        .DataSource(ds => ds
        .Ajax()

        .Model(m =>

        {
            m.Id(p => p.ID);
            //m.Field(p => p.ID).Editable(false);



        })


        .Events(e=>e.Error("error"))
        .PageSize(10)
        .Read(rd => rd.Action("RD_Users", "Admin")

        )
        .Create(create => create.Action("InsertUser", "Admin"))
        .Update(update => update.Action("UpdateUser", "Admin"))
        .Destroy(delete => delete.Action("DeleteUser", "Admin"))

        )

        .Pageable(p => p.Refresh(true))
        .Sortable()

        .Filterable()
        )


    </div>





</div>

and

<script id="subdetailsTemplate" type="text/kendo-tmpl">






    @(Html.Kendo().Grid<SimpleReportMenu.Models.UserGroupMapping>()
              .Name("MapGrid_#=ID#")
              .Columns(columns =>
              {
                  columns.Bound(o => o.ID).Title("ID");
                  columns.ForeignKey(p => p.GroupID, (System.Collections.IEnumerable)ViewData["groups"], "ID", "GroupName").Title("Group").Width(200);



                  //columns.Bound(o => o.UserID).Title("User");
                  columns.Command(command => { command.Destroy().Text(" "); command.Edit().Text(" ").UpdateText(" ").CancelText(" "); });

              })
              .Events(e => e.DataBound("gridBind"))
              .ToolBar(tb => tb.Create())
              .Editable(e => e.Mode(GridEditMode.InLine))
          .DataSource(dataSource => dataSource
              .Ajax()
              .PageSize(10)
              .Events(e => e.Error(o=>gridTemplateHelper("#=ID#")))
              .Model(m =>
              {
                  m.Id(p => p.ID);
                  m.Field(p => p.ID).Editable(false);

              })
               .Read(read => read.Action("RD_UserGroups", "Admin", new { UserId = "#= ID #" }))
               .Create(u => u.Action("InsertUserDirectorate", "Admin", new { UId = "#= ID #" }))
               .Update(u => u.Action("InsertUserDirectorate", "Admin"))
               .Destroy(u => u.Action("DeleteUserDirectorate", "Admin"))
              )

              .Pageable(p => p.Refresh(true))

             .ToClientTemplate()
             )









</script>

When the foreign key column is not commented out, expanding the record throws the javascript error:-

Uncaught SyntaxError: Invalid or unexpected token
    at eval (<anonymous>)
    at jquery.min.js:2:2668
    at Function.globalEval (jquery.min.js:2:2679)
    at Ha (jquery.min.js:3:21263)
    at n.fn.init.after (jquery.min.js:3:23226)
    at n.fn.<computed> [as insertAfter] (jquery.min.js:3:24511)
    at HTMLAnchorElement.<anonymous> (kendo.all.js:68415:114)
    at HTMLTableElement.dispatch (jquery.min.js:3:12445)
    at r.handle (jquery.min.js:3:9174)

This is confusing, as the same foreign key column works without issues on another page, when not in a template. Also, the same syntax in a nested grid works in another project (using a different verison of the framework). This project is using version 2020.2.513 .

The scripts are loaded by the code:-

 <script src="@Url.Content("~/Scripts/modernizr-2.8.3.js")"></script>
    <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />


    @*<link href="@Url.Content("~/Content/kendo/2020.2.513/kendo.bootstrap-v4.min.css")" rel="stylesheet" type="text/css" />*@


    <link href="@Url.Content("~/Content/kendo/2020.2.513/kendo.common-bootstrap.min.css")" rel="stylesheet" type="text/css" />
    <link href="@Url.Content("~/Content/kendo/2020.2.513/kendo.bootstrap.min.css")" rel="stylesheet" type="text/css" />


    <link href="@Url.Content("~/Content/BS5/bootstrap.min.css")" rel="stylesheet" type="text/css" />
    <link href="@Url.Content("~/Content/bs5/bootstrap-icons.css")" rel="stylesheet" />

    <script src="@Url.Content("~/Scripts/kendo/2020.2.513/jquery.min.js")"></script>
    <script src="@Url.Content("~/Scripts/kendo/2020.2.513/jszip.min.js")"></script>
    <script src="@Url.Content("~/Scripts/kendo/2020.2.513/kendo.all.min.js")"></script>
    <script src="@Url.Content("~/Scripts/kendo/2020.2.513/kendo.aspnetmvc.min.js")"></script>
    <script src="@Url.Content("~/Scripts/kendo/2020.2.513/cultures/kendo.culture.en-GB.min.js")"></script>

    <script src="@Url.Content("~/Scripts/BS5/bootstrap.bundle.min.js")"></script>

I'm at a loss to see what the problem is. If you cpould help it would be much appreciated.

Grid

asked on 14 Sep 2022

1 answer

245 views

Links not underlining

Hello,

Simple issue I think.

Here is the grid:

 @(Html.Kendo().Grid<myHinkleyWebApp.Models.PhoneNumberSearch>()
    .Name("include_grid")
    .Columns(columns => {
        columns.Bound(p => p.CustomerNumber).ClientTemplate(
        "<a style='text - decoration:underline' target='_blank' href='" +
            "#= LinkToAccountCard #'" +
            " >#= CustomerNumber #" + "</a>"
    );
        columns.Bound(p => p.OpenOrdersLink).ClientTemplate(
        "<a style='text - decoration:underline' target='_blank' href='" +
            "#= OpenOrdersLink #'" +
        " > Open Orders</a>"
    );
        //columns.Bound(p => p.CustomerNumber);
        columns.Bound(p => p.CompanyName);
        columns.Bound(p => p.CompanyType);
        columns.Bound(p => p.ContactName);
        columns.Bound(p => p.ActiveAccount);
        columns.Bound(p => p.ActiveContact);
        //columns.Bound(p => p.status_override);
        //columns.Bound(p => p.inventory_id).Title("").ClientTemplate("<a href='" + Url.Action("Delete", new { id = "#=inventory_id#", m_id = "#=customer_id#" }) + "'>Delete</a>");
        //columns.Command(command => command.Destroy()).Width(150);
    })
    //.ToolBar(toolbar => {
    //    //toolbar.Create();
    //    toolbar.Save();
    //})
    //.Editable(editable => editable.Mode(GridEditMode.InCell))
    .Pageable()
    .Navigatable()
    .Sortable()
    //.Scrollable()
    .DataSource(dataSource => dataSource
        .Ajax()
        .PageSize(10)
        .Batch(true)
        .ServerOperation(false)
        .Events(events => events.Error("error_handler"))
        //.Model(model => { model.Id(p => p.inventory_id); model.Field(p => p.inventory_id).DefaultValue(Guid.Empty); model.Field(p => p.customer_id).DefaultValue(Guid.Empty); })
        //.Create("Item_Create_Update", "HLI_Customer_Specific_Inventory", new { CusNo = Model.CusNo })
        .Read("GetPhoneNumbers", "PhoneNumberSearch", new {id = Model.ProneNumberBeingSearched })
    //.Update("Item_Create_Update", "HLI_Customer_Specific_Inventory", new { CusNo = Model.CusNo })
    //.Destroy("Item_Destroy", "HLI_Customer_Specific_Inventory", new { CusNo = Model.CusNo })
    )
)

Notice the first 2 columns are links.

I cannot get it to underline! Says that its over ruled by

Any help in the code greatly appreciated!

Grid

answered on 14 Sep 2022

1 answer

95 views

Kendo ui mvc

i am getting the kendo.mvc.ui package error

and second question is about my grid is loaded but data is not visible .

Grid

answered on 14 Sep 2022

0 answers

112 views

Media Player (private video & suppress menu)

1. Can Media Player play a youtube video that is behind credentials (a private youtube video)?

2. Is there a way to suppress the popup menu such that commands like "Copy Video URL..." and so fort do not show up. Ideally, I'd like to suppress the popup altogether.

MediaPlayer