Search code examples
c#asp.net-corekendo-asp.net-core

how to create custom html helper for add icon to input kendo combobox


how to solve use this :

public static IHtmlContent CpaKendoComboBoxFor<TModel, TProperty>(this IHtmlHelper<TModel> htmlHelper,
      Expression<Func<TModel,TProperty>> expression, string inputId, object htmlAttributes = null)
    {
        var propertyId = string.Join("_", expression.Body.ToString().Split('.').Skip(1));
        
        StringBuilder result = new StringBuilder();
        
          result.Append( htmlHelper.Kendo().TextBoxFor(expression).HtmlAttributes(htmlAttributes).ToHtmlString());//error null reference
       

        var spanEditBtn = new TagBuilder("span");
        spanEditBtn .MergeAttribute("name", TagBuilder.CreateSanitizedId("btnEdit" + propertyId, ""));
        spanEditBtn .GenerateId("btnEdit" + propertyId , "");
        spanEditBtn .AddCssClass("k-icon k-edit-value k-i-edit");
        spanEditBtn .MergeAttribute("style", "padding-left: 40px;display: flex;");
        spanEditBtn .MergeAttribute("role", "button");
        spanEditBtn .MergeAttribute("unselectable", "on");
       // spanEditBtn .MergeAttribute("onclick", "editTextBoxKendo('" + propertyId + 2  + "')");
        //spanEditBtn .InnerHtml.AppendHtml(spanClearIcon);

        //spanWidget.InnerHtml.AppendHtml(spanEditBtn );
        result.Append(spanEditBtn .ToHtmlString());

       // var str = String.Format(combobox.ToString()+ spanEditBtn .ToString());
        


        return htmlHelper.Raw(result.ToString());
    }

when use @Html.CpaKendoComboBoxFor(model => model.id, nameof(Model.id) + ViewData["FG"])

show error null reference.


Solution

  • add new answer for "add icon to input kendo combobox with custom html helper"

     public static IHtmlContent CpaKendoCombobox(this IHtmlHelper htmlHelper,Kendo.Mvc.UI.Fluent.ComboBoxBuilder comboBox,
            string inputName, string formGuid, string pathForVchEdit,string vchName)
    
        {
    
            StringBuilder result = new StringBuilder();
    
            var spanWidget = new TagBuilder("span");
            spanWidget.AddCssClass("k-mainEditComboBoxItem");
            
            //var propertyId = string.Join("_", expression.Body.ToString().Split('.').Skip(1));
            var spanEditBtn = new TagBuilder("span");
            spanEditBtn.MergeAttribute("name", TagBuilder.CreateSanitizedId("btnClear" + inputName, ""));
            spanEditBtn.GenerateId("btnClear" + inputName+ formGuid, "");
            spanEditBtn.AddCssClass("k-editComboBoxItem");
            spanEditBtn.MergeAttribute("style", "display:none;padding-top:1px;margin-right:-55px;padding-right: 1px;cursor: pointer;font-size:1.3em ");
            spanEditBtn.MergeAttribute("role", "button");
            spanEditBtn.MergeAttribute("unselectable", "on");
            spanEditBtn.MergeAttribute("onclick", "editSelectedItemKendoComboBox('" + inputName + formGuid + "')");
            
            var spanEditBtn2 = new TagBuilder("span");
            spanEditBtn2.AddCssClass("k-icon k-i-track-changes-enable");
            spanEditBtn2.MergeAttribute("style", "font-size:1.3em ");
            spanEditBtn.InnerHtml.AppendHtml(spanEditBtn2);
    
            string script = @"<script>$(function() {" + "\n" +
                            "var input = $('.k-mainEditComboBoxItem'),div = $('.k-editComboBoxItem'); " + "\n" +
                            "input.mouseover(function() {if(!isNullOrEmpty($('#'+'" + inputName + formGuid + "').data('kendoComboBox').value())) div.show(); }); " + "\n" +
                            "input.mouseout(function() { div.hide(); }); " + "\n" +
                            "}); " +
                            "function editSelectedItemKendoComboBox(comboBoxId){ " + "\n" +
                            "let valueId=$('#'+comboBoxId+'').data('kendoComboBox').value();" +
                "cpaContentPageLoadingWithParam('" + pathForVchEdit + "', { Id: valueId }, 'Test " + vchName+"', '', 'k-icon k-i-edit');} " + "\n" +
                
                            "</script> ";
    
            StringBuilder callendarScript = new StringBuilder();
            callendarScript.AppendLine(script);
    
            spanWidget.InnerHtml.AppendLine(new HtmlString(callendarScript.ToString()));
    
    
    
            spanWidget.InnerHtml.AppendHtml(comboBox.ToHtmlString());
            spanWidget.InnerHtml.AppendHtml(spanEditBtn);
    
            result.Append(spanWidget.ToHtmlString());
    
    
            return htmlHelper.Raw(result.ToString());
        }