Telerik Forums
UI for ASP.NET MVC Forum
2 answers
1.3K+ views
See the page screen shot.

I would like to pass the values in the textbox and two calendar controls to the controller using the .read action in the datasource.

One way I read about is using hidden HTML which I tried but the grid doesn't like it, at least the way I did it. I tried many ways.

When I hard code the values in the .read action, it does work and return the correct results. It's now just parameterizing it that is giving the problem.

@Html.Hidden("txtPartNum", "S2G-120");
@Html.Hidden("dtDateto", "2015-01-01");
@Html.Hidden("dtDatefrom", "2015-05-02");

Please advise the recommended method to retreive the values of the controls and pass to the backend please.

@(Html.Kendo().Grid<KendoUI.Sasco.Dashboard.Models.PartsHistoryViewModel>()
      .Name("PartsHistory")
      .HtmlAttributes(new { style = "height: 800px; border: 0;" })
      .Columns(columns =>
      {
          //columns.Bound(c => c.Part_Number).HeaderTemplate("<div><label for='PartNum'>Part Number</label> <input type='text' id='PartNum'/></div>");
          columns.Bound(c => c.Month);
          columns.Bound(c => c.SalesVolume).Title("Sales Volume");
          columns.Bound(c => c.SalesAmount).Title("Sales Amount").Format("{0:c0}");
          columns.Bound(c => c.Unit).Hidden();
          columns.Bound(c => c.PPH).Title("Price per 100");
      })
     .ToolBar(toolbar => {
         toolbar.Excel();
         toolbar.Pdf();
     })
      .Selectable()
      .Scrollable()
      .Pageable()
      .Events(e => e
      .DataBound ("onDataBound") //not needed unless something to pop open
     )
      .Navigatable()
      //.Filterable(filterable => filterable.Mode(GridFilterMode.Row))
      .DataSource(dataSource => dataSource
      .Ajax()
      .PageSize(20)
            //   .Read(  "PartsHistory", "PartsHistory" )  
            //          .Read(read => read.Action("PartsHistory", "PartsHistory", new { pPartName = "S2G-120", pStartDate = "2015-03-01", pEndDate = "2017-02-01"}))
            .Read(read => read.Action("PartsHistory", "PartsHistory", new { pPartName = txtPartnum.val() , pStartDate = txtDatefrom.val() , pEndDate = txtdateto.val() }))

Thanks much!
Larry
Top achievements
Rank 1
 answered on 27 Apr 2017
3 answers
239 views

Hi,

Was wondering if there is a Loader like the combobox, that could be displayed over the spinner part, while an Ajax call is made to fill in this field.

I thought that the following would work
kendo.ui.progress($("#txtNumericValueField"), true);

Dimiter Topalov
Telerik team
 answered on 27 Apr 2017
2 answers
524 views

Hi,

I have the following code in my controller and in the mapping of my entity I navigate a foreign key. (Plate = anomalie.voiture.plaque)

That gives me the following exception:

An exception of type 'System.Data.Entity.Core.EntityCommandExecutionException' occurred in EntityFramework.dll but was not handled in user code

 

There is already an open DataReader associated with this Connection which must be closed first.

 

I tried to add an include() but doesn't solve the problem. Any ideas ?

public ActionResult Read([DataSourceRequest]DataSourceRequest request)
{
    using (var context = new carpackEntities())
    {
        IQueryable<anomalie> damages = context.anomalie;
        damages.Include(d => d.voiture);
        var result = Json(damages.ToDataSourceResult(request, damage =>
        new DamageViewModel()
        {
            Date = damage.dtajout,
            Description = damage.avarie,
            Driver = damage.chauffeur,
            Plate = damage.voiture.plaque,
            Service = damage.service,
            State = damage.etat.ToString()
        }));
        return result;
    }
}
Emmanuel
Top achievements
Rank 1
 answered on 26 Apr 2017
1 answer
227 views

Is it possible to make the dialog moveable? Since I have it set up as Model it covers the existing page which the end users may want to look at.

 

Thanks

Ivan Danchev
Telerik team
 answered on 26 Apr 2017
1 answer
117 views

hello,

I set the event title in jquery dynamically depending on selected value in 3 comboboxes and when I try to save the event in database, the title's value is 'No title'.

It's working when I write something manuelly.

Do you know why I have this issue ?

Thank you,

Julien
Top achievements
Rank 1
 answered on 26 Apr 2017
1 answer
120 views

I am using a kendo grid and one of the columns uses a MultiSelectFor. I am also using a Sortable with the multiselect so users can change the ordering of the multiselect values but when I click out of the multiselect and it goes to write back to the grid it doesn't write back in the selected order but only the order in which I selected the values. I attached some images to show what I mean. 

@using Models;
@using DAL;
@model IEnumerable<object>
 
@{
    string uniqueName = Util.GetUniqueName();
    string onSelect = "onSelect_" + uniqueName;
    string onChange = "onChange_" + uniqueName;
    string selectedValueVariable = "selectedValueVar_" + uniqueName;
    string selectedValueFunction_default = "selectedValueFunction_" + uniqueName;
    string builtParamFunction = "builtParamFunction_" + uniqueName;
    bool isCascadingFrom = false;
 
    bool isRequired = ViewData.ModelMetadata.IsRequired;
 
    string onChangeRestrictValues = "onChangeRestrictValues" + uniqueName;
    string onSortChange = "onSortChange" + uniqueName;
 
    bool ShowLabel = ViewData.GetBoolValue("ShowLabel");
    string selectedValueFunction = ViewData.GetValue("SelectedValueFunction", selectedValueFunction_default);
    string ParamFunction = ViewData.GetValue("ParamFunction");
 
    string id = ViewData.GetValue("FieldID", uniqueName);
 
    string Param1 = ViewData.GetValue("Param1");
    string Param2 = ViewData.GetValue("Param2");
    string Param3 = ViewData.GetValue("Param3");
    string CascadeFromField = ViewData.GetValue("CascadeFromField");
    string CascadeFromField_SelectedValueFunction = ViewData.GetValue("CascadeFromField_SelectedValueFunction");
    bool allowCustomEdit = ViewData.GetBoolValue("AllowCustomEdit");
    string defaultValue = ViewData.GetValue("DefaultValue");
 
    isCascadingFrom = string.IsNullOrWhiteSpace(CascadeFromField) == false;
 
    ListType ListType = ViewData.GetEnumValue<IEnumerable<object>, ListType>("ListType");
 
    string DataTextField = ListService.GetDataTextField(ListType);
    string DataValueField = ListService.GetDataValueField(ListType);
 
    if (string.IsNullOrWhiteSpace(CascadeFromField_SelectedValueFunction) == false && string.IsNullOrWhiteSpace(CascadeFromField))
    {
        throw new Exception("CascadeFromField_SelectedValueFunction was specified, but CascadeFromField was not specified");
    }
 
    if (string.IsNullOrWhiteSpace(ParamFunction) == false && string.IsNullOrWhiteSpace(CascadeFromField_SelectedValueFunction) == false)
    {
        throw new Exception("ParamFunction was specified as well as CascadeFromField_SelectedValueFunction, only one of these can be used");
    }
 
    if (string.IsNullOrWhiteSpace(CascadeFromField_SelectedValueFunction) == false) //we want to use the CascadeFromField_SelectedValueFunction to populate a parameter value and pass it to server
    {
        if (string.IsNullOrWhiteSpace(Param1)) //if first param is unspecified
        {
            Param1 = CascadeFromField_SelectedValueFunction + "()";
        }
        else if (string.IsNullOrWhiteSpace(Param2)) //if 2nd param is unspecified
        {
            Param1 = "\"" + Param1 + "\""; //we need to add quotation marks so the value is seen as a string in javascript and not a variable or method
            Param2 = CascadeFromField_SelectedValueFunction + "()";
        }
        else if (string.IsNullOrWhiteSpace(Param3)) //if 3rd param is unspecified
        {
            Param1 = "\"" + Param1 + "\""; //we need to add quotation marks so the value is seen as a string in javascript and not a variable or method
            Param2 = "\"" + Param2 + "\""; //we need to add quotation marks so the value is seen as a string in javascript and not a variable or method
            Param3 = CascadeFromField_SelectedValueFunction + "()";
        }
        ParamFunction = builtParamFunction; //param values will be converted into javascript and returned back to server as a function
    }
    string noDataTemplateID = "noDataTemplateID" + uniqueName;
}
 
 
<script id="@noDataTemplateID" type="text/x-kendo-tmpl">
    <div>
        No data found. Do you want to add new item - '#: instance.input.val() #' ?
    </div>
    <br />
    <button class="k-button" onclick="addNew('#: instance.element[0].id #', '#: instance.input.val() #')">Add new item</button>
</script>
 
 
<script>
    function hint(element) {
        return element.clone().addClass("hint");
    }
 
    function placeholder(element) {
        return element.clone().addClass("placeholder").text("drop here");
    }
 
</script>
 
@if (ShowLabel)
{
    @Html.LabelFor(x => x)
}
@(Html.Kendo().MultiSelectFor(m => m)
            .DataTextField(DataTextField)
            .DataValueField(DataValueField)
            .NoDataTemplateId(noDataTemplateID)
 
        .Value(defaultValue)
        .HighlightFirst(true)
 
        .Filter(FilterType.StartsWith)
 
        .DataSource(source =>
        {
            source.Read(read =>
            {
                read.Action("Read", "List", new { ListType = ListType, Param1 = Param1, Param2 = Param2, Param3 = Param3 });
 
            });
        })
        .HtmlAttributes(new {id = id })
)
 
 
@(Html.Kendo().Sortable()
    .For("#" + id + "_taglist")
    .HintHandler("hint")
    .PlaceholderHandler("placeholder")
)

 

@using Models;
 
<script type="text/kendo" id="usersTemplate">
 
    #for(var i = 0; i < data.length; i++){#
    #:data[i].Description#
    #if(i < (data.length - 1)) { #
    #:", "#
    #}#
    #}#
 
</script>
 
<script type="text/javascript">
     
    var usersTemplate = kendo.template($("#usersTemplate").html(), { useWithBlock: false });
</script>
 
 
<div id="content">
    <!-- .container-fluid -->
    @(Html.Kendo().Grid<ApprovalGroupViewModel>()
            .Name("grid_approvalGroups")
            .Columns(columns =>
            {
                columns.Command(command =>
                {
                    command.Destroy();
 
                }).Width(150);
                columns.Bound(e => e.GroupID).Visible(false);
                columns.Bound(e => e.GroupName);
                columns.Bound(e => e.Users).ClientTemplate("#=usersTemplate(Users)#").Sortable(false);
 
 
            })
 
            .Pageable() //Enable the paging.
            .Sortable() //Enable the sorting.
            .Editable(editable => editable.Mode(GridEditMode.InCell))
            .ToolBar(toolbar =>
            {
                toolbar.Create();
                toolbar.Save();
            })
            .DataSource(datasource => datasource
                .Ajax()
                .PageSize(10)
                .Batch(true)
                .Model(model =>
                {
                    model.Id(m => m.GroupID);
                    model.Field(m => m.Users).DefaultValue(new List<UserIDViewModel>());
 
                })
                .Read(read => read.Action("Read", "WFApprovalGroup"))
                .Create(c => c.Action("Create", "WFApprovalGroup"))
                .Update(c => c.Action("Update", "WFApprovalGroup"))
                .Destroy(c => c.Action("Delete", "WFApprovalGroup"))
            )
    )
</div>
Stefan
Telerik team
 answered on 26 Apr 2017
1 answer
492 views

Hello,

the following grid is working fine, and do the job h

01.@(Html.Kendo().Grid<QMatrix.Models.UserModel>()
02.                                        .HtmlAttributes(new { style = " height: 750px" })
03.                                        .Name("gridUsers")
04.                                        .Pageable()
05.                                        .Scrollable()
06.                                        .Filterable(filter => filter.Mode(GridFilterMode.Menu))
07.                                        .Columns(col =>
08.                                        {
09.                                            col.Bound(m => m.Personalnummer).Title("Personalnummer");
10.                                            col.Bound(m => m.Name).Title("Name");
11.                                            col.Bound(m => m.Nachname).Title("Nachname");
12.                                            col.Bound(m => m.Planstelle).Title("Planstelle");
13.                                        })
14.                                        .DataSource(ds => ds
15.                                                    .Ajax()
16.                                                    .PageSize(30)
17.                                                    .Model(model => model.Id(m => m.ID))
18.                                                    .Read(read => read.Action("ReadAllUsers", "User")))
19.                        )

 

 

Now i want to add a custom command button, which open a kendo window that loading an content specific by an ID from grid.

But when i add a the following Custom Command Button the grid stop working, datasource is no longer read ?

Grid displays no data available.......

1.col.Command(command => { command.Custom("CustomCommand").Click("editUserPermission").Text("Bearbeiten"); });

 

Javascript:

01.<script type="text/javascript">
02.    function editUserPermission(e) {
03.        e.preventDefault();
04. 
05.        var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
06.        var wnd = $("#AddPermission").data("kendoWindow");
07. 
08.        wnd.LoadContentFrom("EditRights", "User", new { UserID = dataItem.ID });
09.        wnd.center().open();
10.    }
11.</script>

 

Can anyone explain to me ? :/

thanks ..

 

 

e is created for :
e is created for :
Can anyone explain to me
Can anyone explain to me
Stefan
Telerik team
 answered on 26 Apr 2017
1 answer
614 views

Hi,

 

I was wondering if there's an option to load images in a Kendo Diagram without the use of referencing a URL, as is done here:

g.append(new dataviz.diagram.Image({
            source: "../content/dataviz/diagram/people/" + dataItem.image,
            x: 3,
            y: 3,
            width: 68,
            height: 68
          }));

 

Is it possible to load it via a bitmap or stream and pass it from the controller onto the view?

 

 

 

 

d

Tsvetina
Telerik team
 answered on 25 Apr 2017
8 answers
770 views

I have a view model 'OrderViewModel' with a property

public ICollection<Person> Team { get; set; }

I use a Kendo Grid element to display a list of the 'OrderViewModel' Objects and use a Popup with a template to edit the data.

In my razor view if the edit view i use a multiSelect Element to edit the 'Team' property

@(Html.Kendo().MultiSelect()
                   .Name("Team")
                   .DataTextField(field: "FullName")
                   .DataValueField(field: "Id")
                   .AutoBind(autoBind: false)
                   .DataSource(s => s.Read(read => read.Action(actionName: "TeamMemberRead", controllerName: "Grid")).ServerFiltering(enabled: true))
       )

When the data is posted back to the controller and nothing is selected in the multiselect field, the value for the 'Team' property is a List with Count = 1 and the element [0] is null.

Is this the correct behavior? I expect a list with Count = 0.

Here is my controller action:

[HttpPost]
        public ActionResult Orders_Update([DataSourceRequest]DataSourceRequest request, OrderViewModel data)
        {
            if (data != null && ModelState.IsValid)
            {
                // Update
                int count = data.Team.Count;
            }
 
            return Json(new[] { data }.ToDataSourceResult(request, ModelState));
        }

 

Ralf
Top achievements
Rank 1
 answered on 25 Apr 2017
19 answers
719 views

I'm trying to get a multi select box to refresh it's values after selecting a value from a drop down list. I am currently using server side filtering and paging (i.e. not all items are loaded when you load the control and so scrolling will keep loading items as needed)

 

Initially the multi select is getting its data value set in the Read method like so

 

transport.Read("GetItems", "Items", new { id = @Model.Id });

At this stage, the ID parameter (from the model) it passes in is 0 and so no items are loaded in the Multi Select control.

 

I now have a drop down box with a change event attached to it. On the change event I want to refresh the data on the multi select so I do the following using JavaScript:

var multiSelect = $("#multiSelectControl").data("kendoMultiSelect");
 
multiSelect.dataSource.read({ id: value });

 

On the controller, i can see that the ID value is coming through correctly and the Multi Select loads the correct value items. (e.g. 25, 26 etc)

 

However the problem comes in when i start scrolling the multi select list. When the next items are "loading" it seems the controller is being hit again with the value from the original datasource (i.e. 0) and so removes everything from the Multi Select control.

 

How can I make it so any further reads of the data source uses the new parameter that i've set in JavaScript?

t
 
 
 
ransport.Read("GetItems", "Items", new { id = @Model.Id });
transport.Read("GetItems", "Items", new { id = @Model.Id });
Ianko
Telerik team
 answered on 25 Apr 2017
Narrow your results
Selected tags
Tags
Grid
General Discussions
Scheduler
DropDownList
Chart
Editor
TreeView
DatePicker
ComboBox
Upload
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
Dialog
MultiColumnComboBox
DropDownTree
Checkbox
Slider
Switch
Notification
Accessibility
ListView (Mobile)
Pager
Security
ColorPicker
DateRangePicker
Wizard
Styling
Chat
DateInput
MediaPlayer
TileLayout
Drawer
SplitView
Template
Barcode
ButtonGroup (Mobile)
Drawer (Mobile)
ImageEditor
RadioGroup
Sparkline
Stepper
TabStrip (Mobile)
GridLayout
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
SmartPasteButton
PromptBox
SegmentedControl
+? more
Top users last month
Simon
Top achievements
Rank 2
Iron
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Marco
Top achievements
Rank 4
Iron
Iron
Iron
Grant
Top achievements
Rank 3
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Simon
Top achievements
Rank 2
Iron
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Marco
Top achievements
Rank 4
Iron
Iron
Iron
Grant
Top achievements
Rank 3
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?