Telerik Forums
UI for ASP.NET MVC Forum
17 answers
1.9K+ views

I have to make a grid column filterable multi true but column is bind with List<string>. As  per my knowledge it works for primitive data type. Action method contains sample dataset.

My requirement is Tags column should display each tag with comma separated and OS column should display with combination of package name and version.

Same as attached image grid.PNG

But my  current code produce output like output.PNG

How can i achieve my desire result.

Please help.

Thanks in advance!!!

Here is my controller code:

public ActionResult GetComputers([DataSourceRequest]DataSourceRequest request)
{
   List<string> tags1 = new List<string>();
            tags1.Add("T1");
            tags1.Add("T2");
            tags1.Add("T3");
    List<string> tags2 = new List<string>();
           tags2.Add("T3");
           tags2.Add("T2");
           tags2.Add("T4");
    List<string> tags3 = new List<string>();
            tags3.Add("T1");
            tags3.Add("T2");
            tags3.Add("T4");
    List<VarianProduct> prodcut1 = new List<VarianProduct>()
                            {
                             new VarianProduct(){Name = "Aria", Version = "12.2"},
                             new VarianProduct(){Name = "Eclipse", Version = "12.2"}
                            };
    List<VarianProduct> prodcut2 = new List<VarianProduct>()
                           {
                             new VarianProduct(){Name = "Aria", Version = "12.2"},
                             new VarianProduct(){Name = "Eclipse", Version = "12.2"}
                           };
    List<VarianProduct> prodcut3 = new List<VarianProduct>()
                            {
                              new VarianProduct(){Name = "Aria", Version = "12.2"},
                              new VarianProduct(){Name = "Eclipse", Version = "12.2"}
                            };
    List<VarianProduct> prodcut4 = new List<VarianProduct>()
                            {
                              new VarianProduct(){Name = "Aria", Version = "12.2"},
                              new VarianProduct(){Name = "Eclipse", Version = "12.2"}
                            };
      List<ComputerViewModel> list = new List<ComputerViewModel>()
      {
        new ComputerViewModel{Id = 1, HostName = "abc1", OS = "Windows xp", Tags = tags1, Products = prodcut1 },
        new ComputerViewModel{Id = 2, HostName = "abc3", OS = "Windows xp", Tags = tags2, Products = prodcut2},
        new ComputerViewModel{Id = 3, HostName = "abc2", OS = "Windows 7", Tags = tags3, Products = prodcut3},
        new ComputerViewModel{Id = 4, HostName = "abc4", OS = "Windows 10", Tags = tags1, Products = prodcut4}
       }
      return Json(list.ToDataSourceResult(request), JsonRequestBehavior.AllowGet);
}

 

Here is my index.cshtm

@(Html.Kendo().Grid<ComputerViewModel>()
          .Name("InventoryGrid")
          .Columns(columns =>
                      
                        columns.Bound(c => c.HostName).Filterable(ftb => ftb.Multi(true).Search(true));
                        columns.Bound(c => c.Tags).Template(@<text>@string.Join(", ", item.Tags)</text>).Filterable(ftb                                                                       => ftb.Multi(true));
                        columns.Bound(c => c.OS);
                        columns.Bound(c => c.Products).Template(@<text> @string.Join(", ", item.Products.Select(p                                                                                   =>string.Join("-",p.Name,  p.Version))) </text>);
                       }
                )
           .DataSource(dataSource => dataSource
                         .Ajax()
                         .PageSize(20)
                         .Read(read => read.Action("GetComputers", "RemoteDeployment"))

                          .ServerOperation(false)

                      )

          .Filterable()
          .Pageable()
          .Navigatable()
          .Sortable()
           .HtmlAttributes(new {style="height:550px;"})
)
Viktor Tachev
Telerik team
 answered on 29 Nov 2019
1 answer
268 views
Hi,

I am implementing MVC grid with FullText Search from below link. How do I highlight the search term in the Grid as shown in the attached screenshot?

https://demos.telerik.com/aspnet-mvc/grid/search-panel

Thanks!
Georgi
Telerik team
 answered on 28 Nov 2019
2 answers
229 views

I am trying to get a ComboBoxFor to work inside a Kendo Modal Window. Thing is, the value type is always null.  THis is what I am doing in side a modal window:

 
 
<div class="demo-section k-content">
    <h4>Find a product</h4>
 
    @(Html.Kendo().ComboBox()
          .Name("products")
          .Placeholder("Select product")
          .DataTextField("ProductName")
          .DataValueField("ProductID")
          .HtmlAttributes(new { style = "width:100%;" })
          .Filter("contains")
          .AutoBind(false)
          .MinLength(3)
          .DataSource(source => {
              source.Read(read =>
              {
                  read.Action("ServerFiltering_GetProducts", "ComboBox").Data("onAdditionalData");
              })
              .ServerFiltering(true);
          })
    )
    <div class="demo-hint">Hint: type at least three characters. For example "che".</div>
</div>
 

 

 

 

 

Petar
Telerik team
 answered on 26 Nov 2019
2 answers
222 views
Hello, 

I am brand new to Telerik so bare with me for the question. 

Currently on my Calendar, you have to double click/ double tap on the Calendar event to see the pop up modal. This is causing issues for me on mobile and iOS. 

I was wondering how can i change the doubleClick/ doubleTap  handler to a single click? 


Thank you so much!
Cheers
Veselin Tsvetanov
Telerik team
 answered on 26 Nov 2019
1 answer
1.2K+ views

I'm trying to reset my Editor back to the initial values i have when the page loads on a button press.

 

Is there a way to to this other than setting the values again?

I am able to clear all the values with the following :

        var editor = $("#editor").data("kendoEditor");

        editor.value("")

Would i have to input the initial text again in the .value()?

Veselin Tsvetanov
Telerik team
 answered on 25 Nov 2019
1 answer
652 views

i have inserted a new item at server side. I need to refresh the dropdownlist and select the latest item.

i tried read, refresh & sync but it failed. Please help.

@(Html.Kendo().DropDownList()
.Name("Job.ITransfereeId")
.HtmlAttributes(new { style = "width:100%" })
.DataTextField("Name")
.DataValueField("Id")
.OptionLabel(" ")
.FooterTemplateId("AddDataTemplate")
.Template("<span class=\"k-state-default\">#: Name #<p>#: Company # <br/>#: Email #<br/>#: UMobileDialingCode # #: UMobile #</p></span>")
.Filter(FilterType.Contains)
.DataSource(dataSource => dataSource
.Ajax()
.Read(r => r.Url("/DSContactDropDown/GetTransferee").Data("forgeryToken"))
.Events(e => e.Error("onError").RequestEnd("onRequestEnd"))
)
.Events(e => e.Change("TransfereeOnChange"))
.Value(Model.Job == null ? "0" : Model.Job.ITransfereeId == null ? "0" : Model.Job.ITransfereeId.ToString())
)
$.ajax({
            type: 'POST',
            url: '/User/SaveUser',
            beforeSend: function (xhr) {
                xhr.setRequestHeader("XSRF-TOKEN",
                    $('input:hidden[name="__RequestVerificationToken"]').val());
            },
            datatype: "html",
            data: $('#AddUserForm').serialize(),
            success: function (result) {
                var target = $('.storedDropdownID').val();
                var dropdownlist = $("#" + target).data("kendoDropDownList");
                //var dropdownlist = $("#" + target).getKendoDropDownList();
 
                //Rebind the Contact
                dropdownlist.dataSource.read();
                dropdownlist.refresh();
                dropdownlist.dataSource.sync();
 
                //select the new contact
                var value = result.userid;
                dropdownlist.value(value);
 
                //console.log("value " + value);
 
 
                //Close Modal
                $('#AddNewUserModal').modal('hide');
 
            },
            error: function (result) {
                console.log("error");
            }
        });
Aleksandar
Telerik team
 answered on 22 Nov 2019
9 answers
4.0K+ views

I have a grid, which needs to show conditionally formatted data, including colours.  All the custom formatting (percentages etc..)  is done by the model, with the grid simply displaying text fields. The colours are also passed to the grid as additional string fields.

 It's simple to format the fore colours, using a client template, but using the background style, the cell still retains an outline of the row background, which isn't what I want. What I have at the moment is:-

 

col.Bound(o => o.Apr).Title("Apr").ClientTemplate("<div style='background:#=Apr_BackCol#; color:#=Apr_Col#'>#=Apr#</div>");

 

How can I set the cell background? Ideally this would be via the client template, as I've got 17 columns which will need formatting like this, so calling a JavaScript function for each column seems unwieldy, especially since all the logic has been performed in the model.

 

Thanks

Martin
Telerik team
 answered on 22 Nov 2019
6 answers
119 views

I have managed to get the searching to work with our existing systems however i have noticed that if items with the same "Value" are returned at different levels. For example, if i am looking for people by their username/name so if i have a person named "sysadmin" who is also part of a group called "Administrators" they are returned at two different levels within the tree and selecting both of them results in the selection appearing multiple times within the textbox. Is there some way that i can link these two (or more) items?

 

The other problem i am having is that when data is fetched from the server, we also provide an indicator that there are more matched results that are not returned in the search (because we are only displaying the first 20). The total number of matched results is returned as part of the response.

e.g.

{
  "Data": [/* 20 items */],
  "Total": 223
}

 

In our other dropdownlist selectors we use virtual scrolling to continuously fetch more results and in our grid and list view pages we use paging.

Is there some way that i can indicate to a user that there are more items that could have been returned but weren't? Either by including some sort of paging functionality or appending an indicator of some kind to the item list.

Plamen
Telerik team
 answered on 20 Nov 2019
2 answers
1.7K+ views

I have a Kendo MVC dropdown list that looks like what you see below. I would like to set the background color of each item in the list based on information contained in the Employee entity being returned from the read operation. Note, I won't be able to use any sort of class to do this because I won't know ahead of time what the color should be. The color will be contained in each Employee entity returned. Can this be done?

                @(Html.Kendo().DropDownListFor(m => m)

                    .Name("EmployeeDropDown")
                    .DataTextField("DropDownText")
                    .DataValueField("RowId")
                    .OptionLabel("Select Employee...")
                    .AutoBind(false)
                    .Filter("contains")
                    .HtmlAttributes(new { style = "width: 525px" })
                    .DataSource(source =>
                    {
                        source.Read(read =>
                        {
                            read.Action("GetEmployeesForDropDown", "Employee");
                        })
                        .ServerFiltering(true);                                     // Let's do server side filtering
                    })
                    .Events(e => {
                        e.Select("onSelect");
                    })

Randy
Top achievements
Rank 1
 answered on 20 Nov 2019
3 answers
1.0K+ views

In my MVC grid code, I have the following:

.DataSource(dataSource => dataSource
   .Ajax()
   .Batch(false)
   .PageSize(25)
   .Events(events => events.Error("gridErrorHandler")) 
   .Events(events => events.RequestEnd("onRequestEndCertification(\"employeeCertificationGrid\")"))
   ...
)

As you can see, I have both an error handler and a RequestEnd handler. However, in my RequestEnd handler function, I would like to be able to check for any error which may have occurred during the event, before I proceed. I cannot find a way, from within the RequestEnd handler, to detect if any error occurred in the operation. Is there a way?

I did notice an e.response.Error object but it never seems to contain any information.

 

 

 


 

 

Petar
Telerik team
 answered on 20 Nov 2019
Narrow your results
Selected tags
Tags
Grid
General Discussions
Scheduler
DropDownList
Chart
Editor
TreeView
DatePicker
Upload
ComboBox
MultiSelect
Window
ListView
TabStrip
Menu
Installer and VS Extensions
Spreadsheet
AutoComplete
TreeList
Gantt
PanelBar
NumericTextBox
Filter
ToolTip
Map
Diagram
Button
PivotGrid
Form
ListBox
Splitter
Application
FileManager
Sortable
Calendar
View
MaskedTextBox
PDFViewer
TextBox
Toolbar
MultiColumnComboBox
Dialog
DropDownTree
Checkbox
Slider
Switch
Notification
ListView (Mobile)
Pager
Accessibility
ColorPicker
DateRangePicker
Wizard
Security
Styling
Chat
MediaPlayer
TileLayout
DateInput
Drawer
SplitView
Barcode
ButtonGroup (Mobile)
Drawer (Mobile)
ImageEditor
RadioGroup
Sparkline
Stepper
TabStrip (Mobile)
GridLayout
Template
Badge
LinearGauge
ModalView
ResponsivePanel
TextArea
Breadcrumb
ExpansionPanel
Rating
ScrollView
ButtonGroup
CheckBoxGroup
Licensing
NavBar
ProgressBar
QRCode
RadioButton
Scroller
Timeline
TreeMap
TaskBoard
OrgChart
Captcha
ActionSheet
Signature
DateTimePicker
AppBar
BottomNavigation
Card
FloatingActionButton
Localization
MultiViewCalendar
PopOver (Mobile)
Ripple
ScrollView (Mobile)
Switch (Mobile)
PivotGridV2
FlatColorPicker
ColorPalette
DropDownButton
AIPrompt
PropertyGrid
ActionSheet (Mobile)
BulletGraph
Button (Mobile)
Collapsible
Loader
CircularGauge
SkeletonContainer
Popover
HeatMap
Avatar
ColorGradient
CircularProgressBar
SplitButton
StackLayout
TimeDurationPicker
Chip
ChipList
DockManager
ToggleButton
Sankey
OTPInput
ChartWizard
SpeechToTextButton
InlineAIPrompt
TimePicker
StockChart
RadialGauge
ContextMenu
ArcGauge
AICodingAssistant
+? more
Top users last month
Rob
Top achievements
Rank 3
Bronze
Iron
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Top users last month
Rob
Top achievements
Rank 3
Bronze
Iron
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?