Telerik Forums
UI for ASP.NET MVC Forum
1 answer
101 views
I need to have a dropdown list appear in each row of a grid that is "fed" from the DataSource of the parent grid.  I have a property in the grid datasource that is an object array.

Below is the grid datasource.  I have a KendoGrid with a template on the "programVersion" column that creates the drop down.  I'm failing adding the data to it.  I've created (stolen and modified) an example (http://jsbin.com/cacabi/1/) that does almost what I want (I've been googling for a couple of hours).  I've included my JSON Array in the datasource to show what I'm using. 
http://jsbin.com/cacabi/1/edit

I basically want the Category dropdown to be populated with the programVersion data (which is different for each row).

Any direction or guidance will be greatly appreciated.  Thanks in advance

{
    "entityKey": "268900",
    "number": "QR000024",
    "companyDescription": "Mountain West",
    "programDescription": "Intangible",
    "programVersions": [
        {
            "versionId": 201226,
            "versionDescription": "2013WorkingCapitalBudget",
            "isCurrent": 0
        },
        {
            "versionId": 201227,
            "versionDescription": "Anotherbudgetversion",
            "isCurrent": 0
        },
        {
            "versionId": 201208,
            "versionDescription": "WorkingBudget",
            "isCurrent": 1
        }
    ],
    "$c": 1981,
    "$r": 1,
    "$checked": false,
    "$checkedEnabled": true
}
Louis
Top achievements
Rank 1
 answered on 28 Aug 2014
1 answer
594 views
I would like to have some top level folders in the file and image browser inside the editor to be read-only not allowing a user to rename, delete, and add items to the root folder. I want a user to be able to navigate to some predefined folders under the root folder and to be able to modify the contents under them.  This isn't my structure but an example would be to have folders <website>/UserXFiles/HiRes & <website>/UserXFiles/thumbnail and only allow a user to be able to modify the contents in the HiRes and thumbnail folders but nothing above (still need the user to navigate to the different folders).  Is there functionality built into the browsers to achieve this?

Also is there a way to initialize the browsers to a directory:  If my structure was like the one above how would I start the user inside the Files folder?

Thank you,
Abram
Dimo
Telerik team
 answered on 28 Aug 2014
1 answer
140 views
Hi,

In the foreign key example the foreign key data used for the dropdown is obtained from the ViewData.

However, with a Web API binding ViewData is not accessible from the web api controller.

What is the best practice approach in this situation?

Thanks
Alexander Popov
Telerik team
 answered on 28 Aug 2014
3 answers
274 views
I have a simple controller which sends colored and Name. I want to bind  to a kendoUI combobox.   I am putting my sample code with this.

Controller

namespace KendoMVCStudy.Controllers
{
public class GetColorController : Controller
{
//
// GET: /GetColor/

public ActionResult Index()
{
Color _color = new Color();
List<Color> _colors = new List<Color>();

_color.Colorid = 1;
_color.Name = "White";

_colors.Add(_color);

_color.Colorid = 2;
_color.Name = "Black";

_colors.Add(_color);

return Json(_colors, JsonRequestBehavior.AllowGet);

//return View(_colors);
}




}
}

Model



using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace KendoMVCStudy.Models
{
public class Color
{
public int Colorid { get; set; }
public string Name { get; set; }
}
}

View

@model List<KendoMVCStudy.Models.Color>

@{
ViewBag.Title = "Index";
}

<h2>Index</h2>


<div class="demo-section">
<h2>Products</h2>

@(Html.Kendo().ComboBox()
.Name("products")
.DataTextField("Name")
.DataValueField("Colorid")
.HtmlAttributes(new { style = "width:250px" })
.Filter("contains")
.AutoBind(true)
.MinLength(3)
.DataSource(source => {
source.Read(read =>
{
read.Action("Index", "GetColor");
})
.ServerFiltering(true);
})
)
</div>







Daniel
Telerik team
 answered on 28 Aug 2014
3 answers
295 views
So I have a situation where I am using asp.net MVC controllers in a web interface I'm working on.  

The way it's set up is such that the controller passes a model to the view which then has it defined like this: @model ExceptionReportDBModel.Contributor

ExceptionReportDBModel.Contributor is a class generated by EntityFramework.

The issue is, I can't find a way, using mvc wrapper functions, to bind a textbox or textlabel to the model.  I have only been able to find solutions using javascript, which presents a problem because I have not been able to figure out how to bind to the model provided by my asp.net mvc controller using javascript...

If someone know of a wrapper function for this, or if you know how to use javascript along with an mvc model passed from the controller, that would be quite helpful.
Dimo
Telerik team
 answered on 28 Aug 2014
5 answers
1.1K+ views
I am trying to send datepicker values back to server and bind to date objects in the controller.

this is what is being posted back
sort=&group=&filter=&FromDate=1%2F20%2F2014+12%3A00%3A00+AM&ToDate=4%2F19%2F2014+12%3A00%3A00+AM

here is my post
var chart = $("#SalesChart").data("kendoChart");
 
chart.dataSource.read({
 
   "FromDate": $("#FromDate").data("kendoDatePicker").value(),
 
   "ToDate": $("#ToDate").data("kendoDatePicker").value()
 
});

but in my controller the dates are simple #12:00.00#

Any ideas, thanks







Dongfen
Top achievements
Rank 1
 answered on 27 Aug 2014
1 answer
241 views
Hi

I worked with Telerik.Web.MVC version 2012.3.1018.

I upgraded to Telerik.Web.MVC verison 2013.2.611.

Unfortunatlely my grid do not work with this new version.

It can’t find commands.custom().
It tell my, that it can't find this definition.

My code :

@(Html.Telerik().Grid<Mail>()
.Name("Grid")
.DataKeys(keys => keys.Add(c => c.ID))
.DataBinding(dataBinding =>
      dataBinding.Ajax()
      .Select("_Index", "Geschaeft")
)

.Columns(columns =>
 {
        columns.Command(commands =>
        {
            commands.Custom("editDetail")
            .ButtonType(type)
            .HtmlAttributes(new { @class = "editDetail", @title = "Geschäft editieren" })
            .Text("edit")
            .DataRouteValues(route =>
             route.Add(o => o.GeschaeftID).RouteKey("ID"))
             .Ajax(false)
             .Action("Edit", "Geschaeft", (RouteValueDictionary)ViewBag.GridState);
          }).Width(38).Title("");
...
 
What can I do? 

Thank you for your assistance.
Dimiter Madjarov
Telerik team
 answered on 27 Aug 2014
2 answers
780 views

I have a page that has a grid and some filter fields (external from the grid).  The filtering gets applied to the grid in the JavaScript - which works fine.  I also have an export button that I need to export the data in my grid - since my grid does not contain all the data that my export needs, my thought was to pass the DataSourceRequest as a parameter to my Ajax call, select my data and then use the "toDataSourceResult()" as happens in my ajax read controller action. This is not working. 

I have the following code in my javascript function that builds my datasource request, and passes it in as a parameter, but my DataSourceRequest object in my controller action contains null values for filter, sort, etc.

var grid = ${"#Persons").data("kendoGrid");
var parameterMap = grid.dataSource.transport.parameterMap;
var requestObject = parameterMap({ Sorts: grid.dataSource.sort(), Filters: grid.dataSource.filter(), Groups: grid.dataSource.group()});

How can I pass the datasource request as a parameter to my Ajax Controller action? I have attached a working sample project.

EdsonF
Top achievements
Rank 2
 answered on 27 Aug 2014
1 answer
158 views
Hello,

I  have a grid that contains a check box for each row. A popup editor is displayed when multiple rows are selected. But when a change is made in the popup editor, one of the selected rows loses it's check box selection. My questions are:

1. How do I prevent the a row from being un-selected when a field is modified in the popup editor field?
2. How do I capture an event in the popup-editor window?

Here's is my grid setup:

                                 Html.Kendo().Grid<ResourceInfo>()
                                .Name("GalleryGrid")
                                .Columns(columns =>
                                {
                                    columns
                                       .Bound(r => r.Id).Hidden();
                                    columns
                                        .Bound(r => r.previewUri)
                                        .Width(150)
                                        .Title("Preview")
                                        .Template(@<text><a data-lightbox="@item.uri" href="@item.uri"><img alt="" class="center thumbnail-image" src="@item.previewUri"/></a></text>)
                                        .ClientTemplate("<a data-lightbox='#= uri #' href='#= uri #'><img alt='' class='center thumbnail-image' src='#= previewUri #'/></a>");
                                    columns
                                        .Bound(r => r.colors).Width(100)
                                        .Title("Color");
                                    columns
                                        .Bound(r => r.sizes).Width(100)
                                        .Title("Size");
                                    columns
                                        .Bound(r => r.seasons).Width(100)
                                        .Title("Season");
                                    columns
                                        .Bound(r => r.categories).Width(200)
                                        .Title("Categories");
                                    columns
                                        .Bound(r => r.stockImageKeywords).Width(275)
                                        .Title("Keywords");
                                    columns
                                        .Template(@<text><input type='checkbox' class='check_row'/></text>)
                                        .Width(45)
                                        .Title(" ")
                                         
                                        .ClientTemplate("<input type='checkbox' class='check_row' value='#=Id#'/>");
 
                                    //columns.Command(command => { command.Select().Text("<input type='checkbox' id='editChk'/>"); }).Width(80);
                                    columns.Command(command => { command.Edit().Text(" "); }).Title("Edit").Width(80);
                                    columns.Command(command => { command.Destroy().Text(" "); }).Title("Delete").Width(80);
                                })
                                    .ToolBar(toolbar =>
                                    {
                                        toolbar.Custom().Text("Add (upload)").Url("#uploadModal").HtmlAttributes(new { @class = "btn", data_toggle = "modal" });
                                    })
                                    .DetailTemplate(@<text>
                                    <div>FileName: @item.fileName</div>
                                    <div>uri: @item.uri</div>
                                    <div>previewUri: @item.previewUri</div>
                                    <div>rating: @item.rating</div>
                                    <div>region: @item.region</div>
                                    </text>)
 
                                    .Editable(editable => editable.Mode(GridEditMode.PopUp))
                                    .Sortable()
                                    .Scrollable()
                                    .Filterable()
                                    .Pageable(builder => builder.PageSizes(new[] { 50, 100, 500, 1000 }).Refresh(true))
 
                                    //.Scrollable( scrollable => scrollable.Virtual( true ) )
                                    .HtmlAttributes(new { style = "height:600px" })
                                    .Resizable(resize => resize.Columns(true))
                                    .Reorderable(reorder => reorder.Columns(true))
                                    .DataSource(dataSource =>
                                        dataSource
                                            .Ajax()
                                            .Batch(false)
                                            .ServerOperation(true)
                                            .Model(model =>
                                            {
                                                model.Id(r => r.Id);
                                                model.Field(r => r.previewUri).Editable(false).DefaultValue(string.Empty);
                                                model.Field(r => r.colors).Editable(true).DefaultValue(string.Empty);
                                                model.Field(r => r.seasons).Editable(true).DefaultValue(string.Empty);
                                                model.Field(r => r.categories).Editable(true).DefaultValue(string.Empty);
                                                model.Field(r => r.stockImageKeywords).Editable(true).DefaultValue(string.Empty);
                                            })
                                            .Events(events => { events.Error("error_handler");events.Change("change_handler"); })
                                            .Read(read => read.Action("read", "gallery")).PageSize(50)
                                            .Update(update => update.Action("update", "gallery").Data("GetSelectedIds").Type(HttpVerbs.Post))
                                            .Destroy(delete => delete.Action("delete", "gallery").Type(HttpVerbs.Post))
                                    )
                                    .ClientDetailTemplateId("client-template")
                                    .Events(evt =>
                                    {
                                        evt.Edit("edit_handler");
                                        evt.DataBound("databound_handler");
                                         
                                        //evt.Save("onSave");
                                        //evt.Change("change_handler");
                                    })
                                    .Deferred()
                            )







Dimiter Madjarov
Telerik team
 answered on 27 Aug 2014
1 answer
249 views
Hi,
I have a multiselect that works very well:
@(Html.Kendo().MultiSelectFor(model => model.SurgeryMultiSelect).Filter("contains")
    .Name("SurgeryMultiSelect")
    .DataTextField("Description")
    .DataValueField("ProcedureTypeId")
    .Placeholder("Select Procedure(s)...")
    .DataSource(source =>
      {
          source.Read(read =>
          {
              read.Action("GetAllProcedures", "CommonJsonActions");
          });
      })
    .Events(e =>
        {
            e.Change("fnSurgeryListChange");
        })
)
I also have a grid with a select option that will call a js function; in this function I want to add the selected value from the grid to the select items in the multiselect, if it doesn't already exist. Then call the change event in the multiselect if anything new is added.

Any help will be appreciated.
Thanks,
Shehab
Daniel
Telerik team
 answered on 27 Aug 2014
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
MultiColumnComboBox
Dialog
DropDownTree
Checkbox
Slider
Switch
Notification
Accessibility
ListView (Mobile)
Pager
ColorPicker
DateRangePicker
Wizard
Security
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
+? more
Top users last month
Bohdan
Top achievements
Rank 3
Iron
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Elliot
Top achievements
Rank 1
Iron
Iron
Iron
Sunil
Top achievements
Rank 1
Cynthia
Top achievements
Rank 1
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Bohdan
Top achievements
Rank 3
Iron
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Elliot
Top achievements
Rank 1
Iron
Iron
Iron
Sunil
Top achievements
Rank 1
Cynthia
Top achievements
Rank 1
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?