Telerik Forums
UI for ASP.NET MVC Forum
1 answer
180 views

How do you get the pressed button in a button group from a function .

 

Thanks in advance,


Petar
Telerik team
 answered on 28 Jan 2022
0 answers
173 views

I upgraded my MVC components yesterday and I'm having this issue.

I've attached some before and after pictures. What changes do I need to make to get it looking like the before image?

I'm only using:

.Filterable(filterable => filterable.Mode(GridFilterMode.Row))

 
VISHAAL
Top achievements
Rank 1
Iron
 updated question on 27 Jan 2022
1 answer
914 views

Hi, we use a kendo grid with a popup editor.

@(Html.Kendo().Grid<OrderViewModel>()
            .Name("orderGrid")
            .Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("OrderDialog"))
            .ToolBar(x => x.Create().Text("Add Order"))
            .Columns(columns =>
            {
                columns.Bound(column => column.OrderID);
                columns.Bound(column => column.Name);
                columns.Command(column =>
                {
                    column.Edit();
                    column.Destroy();
                }).Width(230);
            })
            .Events(x => x.Edit("onGridEdit"))
            .DataSource(ds => ds.Ajax()
                .Read(r => r.Url("/Orders/Index?handler=ReadOrder"))
                .Update(u => u.Url("/Orders/Index?handler=UpdateOrder"))
                .Create(c => c.Url("/Orders/Index?handler=CreateOrder"))
                .Destroy(d => d.Url("/Orders/Index?handler=DestroyOrder"))
                .Model(m =>
                {
                    m.Id(id => id.OrderID);
                })
                .PageSize(10)
            )
            .Pageable()
        )

The OrderDialog looks something like this

@model Models.OrderViewModel

<div class="k-edit-label">
    @Html.LabelFor(m => m.Name)
</div>
<div class="k-edit-field">
    @Html.TextBoxFor(m => m.Name, new { @class = "form-control" })
</div>

...

We would like to be able to hide some fields in the editor if the entity being edited is new (which can be determined by the OrderID). This can be achieved by using the edit event of the grid, but we would rather like to do it based on a model property, like this:

@model Models.OrderViewModel

@if(Model.OrderID == 0)

{

<div class="k-edit-label">
    @Html.LabelFor(m => m.Name)
</div>
<div class="k-edit-field">
    @Html.TextBoxFor(m => m.Name, new { @class = "form-control" })
</div>

}

Is this possible? When debugging, it seems the editor is initialized with a null model, so that the line above crashes.

Jan-Frederik
Top achievements
Rank 1
Iron
Iron
 updated question on 26 Jan 2022
1 answer
104 views

Hi guys, im trying to read network path saved in the database to read an image.

i have the path saved as \\TP-amk-camp02\somefolder\somefolder\2022-01-21 \ Data\ in the database. How can i read the network path to display it on the grid?

see below html markup


  columns.Bound(c => c.ThumnailPath).Title("Thumbnailscan").Width(249).Encoded(false).ClientTemplate(
                        "<div style='text-align:left;'>#=FolderGUID ? FolderGUID : '' #  </div> " +
                            "<div id='ExampleBox_#=FolderGUID ? FolderGUID : -1#' data='#=FolderGUID#' class='Example_Box'>" +
                                "<img  class='Example_Image' id='ExampleImage_#=FolderGUID#' src=' " + Url.Content("#:data.ThumnailPath#") + "thumbnails.jpg'/> " +

 

kind regards

Tony

Tony
Top achievements
Rank 2
Iron
Iron
Iron
 answered on 26 Jan 2022
1 answer
372 views

Hi, 

?EGood Day,

 

I am new to kendo ui and we are having an issue due to the upgrade of Jquery (1.x.x->3.6.0). The issue is "Syntax error, unrecognized expression: .field-validation-valid[data-valmsg-for=], .field-validation-error[data-valmsg-for=]" once the validation on the screen fires. Correct me if I am wrong, kendo ui should not be dependent on any Jquery versions. We are also checking if we need to change the validation process instead of using the said kendo validator. We are still hoping that there is still a way to fix this issue.
Below is the kendo version we are currently using.

Kendo Version: 2012.3.1114.340
Platform: ASP.NET MVC

Found the cause _findMessageContainer it is on the kendo.web.js, will just comment this to fix the issue

Ivan Danchev
Telerik team
 answered on 25 Jan 2022
1 answer
367 views

Today I upgraded one of our web apps to the latest version of UI for ASP.NET MVC and since then the DropDownList component doesn't appear to be rendering/styled correctly. I recreated the theme using the Progress Sass Theme Builder tool to eliminate the stylesheet itself as the issue. I've included screenshots below of what the DropDownList component looks like before and after the upgrade. Can anyone advise? Thanks in advance.

Before upgrade:-

After upgrade:-

Implementation:-

@(Html.Kendo().DropDownListFor(model => model.AssetSubTypeId)
                      .OptionLabel("Asset Type/Subtype...")
                      .BindTo(new SelectList(Lookups.AssetTypeSubType, "Key", "Value"))
                      .Events(events =>
                      {
                          events.Change("onChange_AssetSubTypeDropDownList");
                      }))

Ivan Danchev
Telerik team
 answered on 25 Jan 2022
1 answer
1.0K+ views

I'm having an issue getting the selected item from the passed event, mostly because the demo uses "e.dataitem"

like this:

function onSelect(e) {
        if ("kendoConsole" in window) {
            var dataItem = e.dataItem;
            kendoConsole.log("event :: select (" + dataItem.Text + " : " + dataItem.Value + ")");
        }
    }
My attempt to recreate this failed, dataItem has no such members:


@(Html.Kendo().MultiSelect()
                              .Name("JobIds")
                              .HtmlAttributes(new { style = "Width:700px; height:60px; overflow-y:scroll;", aria_label = "editor" })
                              .DataTextField("job_name")
                              .DataValueField("job_id")
                              .HeaderTemplate("<div class=\"dropdown-header\">" +
                                        "<span style=\"width=350px\">Job Name</span>" +
                                        "<span style=\"width=350px\">Parent Name</span>" +
                                        "</div>\n <table>")
                              .ItemTemplate("<span class = \"namespan\">#: data.job_name #</span> <span class=\"parentspan\">#: data.job_parent #</span >")
                              .DataSource(source =>
                                {
                                    source.Read(read =>
                                    {
                                        read.Action("JobSearch", "SupportEditor");
                                    })
                                    .ServerFiltering(true);
                                })
                              .Events(e =>
                              {
                                  e.Select("Job_onSelect")
                                  })


function Job_onSelect (e) {
        var dataItem = e.dataItem;
        console.log("event :: select (" + dataItem.Text + " : " + dataItem.Value + ")");
    }


The console reads:


event :: select (undefined : undefined)


The only way i have managed to pull data is with direct reference to the multiselect like below:

function Job_onSelect(e) {
console.log($("#JobIds").data("kendoMultiSelect").value().toString());
}
But this does not provide the values of selected item value as it is selected; instead it only gives the full value of the multiselect before the change occurs (e.g. if 3 items are selected it only returns items 1 and 2, and when the first item is selected it returns nothing).
Petar
Telerik team
 answered on 25 Jan 2022
1 answer
338 views

Hi there! In the code below when i reach $("#bans-grid").kendoGrid() function i get the type of error i've mentioned in the title. I don't understand why. Any help will be appreciated!


 $("#saveButton").kendoButton({
              click: function() {

                  var channelsData = $("#bans-grid").data().kendoGrid.dataSource.view();
                  var channelsDataJson = JSON.stringify(channelsData);

                      $("#bans-grid").kendoGrid({
                          dataSource: {
                                 transport: {
                                     update: {
                                         data: channelsDataJson,
                                         url: "/bg/NotosPrime/Bans/BanChannels",
                                         type: "PUT"
                                       }
                                     },
                                     schema: {
                                         model: {
                                             id: "Id"
                                         }
                                     }
                                }
                             });
                             $("#bans-grid").dataSource.sync();
                }
            });

Petar
Telerik team
 answered on 25 Jan 2022
8 answers
1.0K+ views
Hi,

I've been trying to set a grid in popup edit mode, with an upload in a custom editor template, but can't get this to work, the  doesn't have a value. Here's my editor template and controller, the view only have a grid set with ajax CRUD operations and popup edit mode. If this possible (a sync upload in editor template), or I need to set async save for the upload?

Controller:

public JsonResult InsertWithImage([DataSourceRequest]DataSourceRequest request, HttpPostedFileBase Picture)
        {
            var item = repository.CreateNew();
            try
            {
                UpdateModel(item);
                if (Picture != null)
                {
                    Picture.InputStream.Read(item.Image, 0, (int) Picture.InputStream.Length);
                    item.Image_Ext = Picture.ContentType;
                }
                repository.Add(item);
                unitOfWork.SaveChanges();
            }
            catch (Exception err)
            {
                ...
            }
            return
                Json((new[] { item }.ToDataSourceResult(request, ModelState)));
        }


EditorTemplate:

<fieldset>
    ...
    <div class="row">
            @Html.LabelFor(model => model.Image)<br />
            @(Html.Kendo().Upload().Name("Picture").Multiple(false)
                .HtmlAttributes(new Dictionary<stringobject>{
                                                                  {
                                                                      "style""width: 100%"
                                                                  }}))
            @Html.ValidationMessageFor(model => model.Image)
        </div>
</fieldset>

Eduardo
Tony
Top achievements
Rank 2
Iron
Iron
Iron
 answered on 24 Jan 2022
1 answer
146 views

When activating the editable.mode in a checkbox it makes the UI control non clickable.


Details: When the mouse hover the checkbox it activates the editable mode on the checkbox but right after that when I try to click it the UI does not response.


Kendo UI version: '2016.1.112'

 

Anton Mironov
Telerik team
 answered on 20 Jan 2022
Narrow your results
Selected tags
Tags
+? more
Top users last month
Will
Top achievements
Rank 2
Iron
Motti
Top achievements
Rank 1
Iron
Hester
Top achievements
Rank 1
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Thomas
Top achievements
Rank 2
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Will
Top achievements
Rank 2
Iron
Motti
Top achievements
Rank 1
Iron
Hester
Top achievements
Rank 1
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Thomas
Top achievements
Rank 2
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?