Telerik Forums
UI for ASP.NET MVC Forum
2 answers
872 views

Hi Team,

 

I have a grid with columns that has dropdownlists. I am using EditorTemplates for these dropdownlists. My concern is that I am unable to make these columns readonly on Edit. However, I am able to make the other non-dropdown columns to do the same behaviour and it works.

 

this is my column setup:

columns.Bound(a => a.Account).ClientTemplate("#=Account.AccountName#").Width(200); 

columns.Bound(a => a.dtEffectiveDate).Width(200);

 

this is my editor template:

@model GlobalCommissionAndAccountAssignments.Models.AccountUpdate.AccountModel
@{
    ViewBag.Title = "AccountsList";
}

@(Html.Kendo().DropDownListFor(m => m)
                                    .DataValueField("AccountId")
                                    .DataTextField("AccountName")
                                    .BindTo((System.Collections.IEnumerable)ViewData["accounts"])
)

 

My code t o make these columns as read-only on edit:

.Events(e => e.Edit("onGridEdit"))

<script>

    function onGridEdit(e) {
        if (e.model.isNew() == false) {
            $('input[name=dtEffectiveDate]').parent().html(e.model.dtEffectiveDate); ----> this works
            $('input[name=Account]').parent().html(e.model.Account); ----> this does not work (the one using a model and client template and editor template)
        }
    } 

</script>

Thank you in advance.

Sam

 

Samyukta
Top achievements
Rank 1
 answered on 29 Jun 2018
1 answer
390 views

Hello All,

Let me first start by saying that I am well aware of the Drag & Drop example for Kendo UI for jQuery.

What am I looking for is an example of Drag & Drop between Kendo Grids using the ASP.NET MVC structure and syntax.  Does this capability even exist in ASP.NET MVC or is it only limited to Kendo UI for jQuery?

Thanks in advance for any help regarding this question.

Best,

Will

Alex Hajigeorgieva
Telerik team
 answered on 29 Jun 2018
1 answer
125 views

If I put this html code in the editor and then save it:

<table>
<tr>
<td>
<p><i class="fa fa-check" style="color: green;">&nbsp;</i></p>
</td>
</tr>
</table>

 

When I look at the HTML again it looks like this:

 

<table><tbody><tr><td>&nbsp;</td>
</tr>
</tbody></table>

It strips out the Italics tag. Normally this wouldn't be a problem but we using Font Awesome and this messes that up. I noticed that it only does this if it's in a table, if I put that same italics tag outside the table it works fine. I was able to verify this same behavior using the online demo page.

I am using Kendo UI v2018.1.221 


Ianko
Telerik team
 answered on 29 Jun 2018
12 answers
250 views

Hi,

I've got the chart how i would like it apart form having multiple category axis, please see attached image.

As you can see i have one CategoryAxis working the persons name, ideally i'd like each Column name to appear above that.(series.stack)

Here's my current code:

@(Html.Kendo().Chart()
                     .Name("chart")
                     .Title("Project Management")
                     .Legend(legend => legend
                         .Position(ChartLegendPosition.Top)
                     )
                     .SeriesDefaults(seriesDefaults =>
                         seriesDefaults.Column().Stack(true)
                     )
                     .Series(series =>
                     {
                         foreach (var def in Model.Series)
                         {
                             series.Column(def.Data).Name(def.Name).Stack(def.Stack);
                         }
                     })
                     .SeriesColors(Colours.Blue, Colours.Orange, Colours.Grey, Colours.Yellow, Colours.LightBlue, Colours.Green)
                     // This should be the Stack Name (Overhead)
                     .CategoryAxis(axis => axis.Labels(l => l.Rotation(90).Template("#= series.stack #")))
                     // This should be the Persons Name (FullName)
                     .CategoryAxis(axis => axis.Categories(Model.Categories))
                     .Tooltip(tooltip => tooltip
                         .Visible(true)
                         .Template("#= series.name #: #= kendo.format('{0:N2}', value) #")
                     )
               )

 

What's the easiest way to achieve this? This is based off of your example project: https://github.com/telerik/ui-for-aspnet-mvc-examples/tree/master/chart/dynamic-series

Thanks,
Lee.

 

Tsvetina
Telerik team
 answered on 28 Jun 2018
3 answers
407 views

Hi,

I have a view with a text box , button and two grids. The intention is to populate the two grids with data, when the text box is supplied with a string value and the button is clicked. Since, kendo().TextBox() does not support Events, I have introduced the button which when clicked updates both the grids as below:

 

        $("#get").click(function () {
            var value = $("#customerInfo").data("kendoTextBox");
          
                $("#gridCurrent").data("kendoGrid").dataSource.read();
                $("#gridAll").data("kendoGrid").dataSource.read();      

        });

This works fine. However after the grids are loaded, I am unable to add a new record to the grid, the Add New Record button on the grid does not work. Any suggestions on this?

Note: I had to use a text box because, the input value is a alphanumeric (varying size) and I found no suitable component.

 

Thank you in advance.

Sam

 

 

 

 

Viktor Tachev
Telerik team
 answered on 28 Jun 2018
2 answers
248 views
I have a grid with a custom toolbar button to do a "global" update to the grid items. The Action is a normal MVC controller that returns a JsonResult. The action works correctly, but I'm not sure how to correctly handle the response - IE is asking if I want to download or open the JSON response. What I need to do is check the response for success, and refresh the grid or display an error message. How can I wire this up? Apologies if there's an answer already - I've searched, but can't seem to find anything.
Harper
Top achievements
Rank 1
 answered on 27 Jun 2018
3 answers
5.3K+ views
I have a column that has HTML formatted data, and excel doesn't play nice with HTML.  Since it doesn't display HTML without jumping through hoops, I just decided to hide that column when I do my export.

I saw there was an excelExport event in the Javascript library that I could intercept and hide the column, but I don't seem to have that option in the .Events wrapper in the MVC library, is it possible to hide a column before exporting to excel since my first choice of writing the HTML probably isn't going to work?
Prakash
Top achievements
Rank 1
 answered on 27 Jun 2018
10 answers
777 views

I have a listbox pair, and I am removing an item or items from one and transferring them to the other.  Some code is executed when this is done.

The problem is that the ListBox selects an item in the list when the transfer is done, and this is not what I want it to do.

I have tried to use javascript to unselect all items in the list to no avail.

<div style="width:100%;">
    <div style="width:50%;float:left;">
        @(
            Html.Kendo()
            .ListBox()
            .Name("NotReviewers")
            .DataTextField("FullName")
            .DataValueField("user_name")
            .TemplateId("itemTemplate")
            .ConnectWith("Reviewers")
            .HtmlAttributes(new { style = "width:100%;" })
            .Selectable(ListBoxSelectable.Multiple)
            .Toolbar(toolbar =>
                                {
                                    toolbar.Position(Kendo.Mvc.UI.Fluent.ListBoxToolbarPosition.Right);
                                    toolbar.Tools(
                                                    tools => tools
                                                            .Remove()
                                                            .TransferAllFrom()
                                                            .TransferAllTo()
                                                            .TransferFrom()
                                                            .TransferTo()
                                                            );
                                }
                    )
            .BindTo((System.Collections.IEnumerable)ViewBag.nonreviewers)
        )
    </div>
    <div style="width:50%;float:right;">
        @(
            Html.Kendo()
            .ListBox()
            .HtmlAttributes(new { style = "width:100%;" })
            .Name("Reviewers")
            .Events( events=>{
                events.Add("AddReviewer");
                events.Remove("RemoveReviewer");
            }
            )
            .TemplateId("itemTemplate")
            .DataTextField("FullName")
            .DataValueField("user_name")
            .ConnectWith("NotReviewers")
            .Selectable(ListBoxSelectable.Multiple)
            .BindTo((System.Collections.IEnumerable)ViewBag.reviewers)
        )
    </div>
</div>

 

 

I use the following javascript to handle the transfer:

function AddReviewer(e)
{
    var dataItems = e.dataItems;
    var url = window.location.href.replace("Requestors", "AddRequestor");
    if (dataItems.length > 0) {
        for (var i = 0; i < dataItems.length; i++) {
            var dataItem = dataItems[i];
            $.ajax({
                url: url,
                dataType: "json",
                type: "POST",
                contentType: "application/json; charset=utf-8",
                data: JSON.stringify({ user_name: dataItem.user_name }),
                async: false,
                processData: false,
                cache: false,
                error: function (xhr) {
                }
 
            });
        }
    }
    var reviewers = document.getElementById("Reviewers");
    for ( i = 0; i < reviewers.options.length; i++) {
        reviewers.options[i].selected = false;
    }
    var notreviewers = document.getElementById("NotReviewers");
    for (i = 0; i < notreviewers.options.length; i++) {
        notreviewers.options[i].selected = false;
    }
    reviewers.value = "";
    notreviewers.value = "";
    reviewers.selectedIndex = -1;
    notreviewers.selectedIndex = -1;
    reviewers.blur();
    notreviewers.blur();
    return true;
}

 

None of the section of the code that I am using to remove the selection works.

The other javascript callback works in a similar manner.

Does anyone have any suggestions on how to remove the selection from the listbox once the work is done?

Viktor Tachev
Telerik team
 answered on 27 Jun 2018
10 answers
2.1K+ views

Hi ,

I was using kendo grid to display the rows in page wise(1-100 records) but when clicked on select all checkbox which selects only the first page. Please help me to achieve the select all functionality in MVC.

Thanks & Regards,

Sampath

Konstantin Dikov
Telerik team
 answered on 27 Jun 2018
6 answers
431 views

Hi,

Gantt control is showing empty first time when page is loading. Whenever I refresh or reload the page then it is showing data. Please help me.

 

Regards,

Ram.

Neli
Telerik team
 answered on 26 Jun 2018
Narrow your results
Selected tags
Tags
Grid
General Discussions
Scheduler
DropDownList
Chart
Editor
TreeView
DatePicker
Upload
ComboBox
MultiSelect
ListView
Window
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
Licensing
Rating
ScrollView
ButtonGroup
CheckBoxGroup
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
Bronze
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
Bronze
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?