Telerik Forums
UI for ASP.NET MVC Forum
1 answer
406 views
I have a grid of Contact data. I am using a custom editor template. The user can edit more data in the editor template than is displayed in the grid. One of the properties on the Contact object is an Array of Phones. In the UI the user can enter as many phone numbers as they want. I have additional fields dynamically added using jquery. Currently, I am running into three issues:

1) Inputs that I dynamically add are not included in the post of the form. Here's an example of a dynamically added input:
<select name="Phones[0].PhoneTypeId">
    <option value="2">Mobile</option>
    <option value="3">Home</option>
    <option value="4">Work</option>
    <option value="5">Main</option>
    <option value="6">Fax</option>
</select>

<input name="Phones[0].Number" type="text">


As mentioned, these values aren't included in the data posted to the server at all.

2) I have created an EditorTemplate for the phone. When I use Html.EditorFor(m => m.Phones) it appears to be completely ignored. I have also tried iterating through the Phone array like this:
@foreach(var phone in Model.Phones)
{
    Html.EditorFor(m => phone)
}

That also gets completely ignored and doesn't produce anything when the data provided should cause phone numbers to show.

3) Due to issue number two mentioned above when editing an existing Contact I have resorted to adding code to just display the first phone number: Html.EditorFor(m => m.Phones[0]) When I do that, the phone number shows up as expected, but if I make a change to the number and submit the form, the data gets submitted like this: Phones[0][Number] instead of like this Phones[0].Number. The default ModelBinder doesn't seem to be able to handle the value being submitted like that, so the values don't get bound to my model.

Any help would be greatly appreciated.
Petur Subev
Telerik team
 answered on 17 Oct 2012
4 answers
286 views
Hi,

The grid fails to render properly when using the following:
datasource =>
             datasource.Ajax().ServerOperation(true)
             .Read(config => config.Url(myActionUrl))
             .Group(config => config.Add(i => i.MyField))

None of the rows gets displayed correctly. It will display the group header with MyField: (undefined) and empty child rows 

It works correctly with :
datasource =>
             datasource.Ajax().ServerOperation(true)
             .Read(config => config.Url(myActionUrl))
             .Group(config => config.Add(i => i.MyField))

Is there a workaround to have initial grouping and client filtering/sorting... ? 

Happens on version : 2012.2.723.340

Thanks for helping
Nikolay Rusev
Telerik team
 answered on 17 Oct 2012
4 answers
640 views
Hi,

First, let me just say that I'm not satisfied by this change asp.net Mvc->kendo ui MVC. It's now a mess to find any information about products I've to maintain, and it's a shame to have to navigate between differents forums to post something(And I'm talking about the main website where we have to read the footer to find the correct page fastly). And there is no way to display by default asp.net Mvc code instead of the javascript synthax... And there is missing code for c#(e.g. no c# example for http://demos.kendoui.com/web/grid/events.html , no controller example for http://demos.kendoui.com/web/grid/editing-inline.html 
) If your goal was to make my work less productive, you won. Hopes it will not continues this way.

I've an Asp.Net MVC website. I've to create a form on which I can edit an object with a small list of elements. 

My model can be simplified like this:

MyModel
public class MyModel{
   public String Name{get;set;}
   public String Description{get;set;}
   public List<Step> Steps{get;set;}
}
 
public class Step{
  public int Id  {get;set;}
  public String Name {get;set;}
  public String Description{get;set;}
}

I would like to be able to add/remove/edit "Steps", and that when I submit my form containaing MyModel fields, I also receive in the POST data the Steps data.

Is it possible with the telerik Grid? I saw demos, but I didn't make them work for my case, only found ajax instant updating or batch editing

Thank you for your help.
Darryl
Top achievements
Rank 1
 answered on 17 Oct 2012
1 answer
193 views
I have a grid as below

@{
    Html.Kendo().Grid<InEnumerable........>()
    .Name("IniParamGrid")
    .HtmlAttributes(new { style = "width: 100%;" })
    .Events(events => events.DataBound("Grid_onRowDataBound"))
    .Events(events => events.Change("Grid_OnRowSelectUID"))  
    .AutoBind(false)
    .Columns(col =>
    {
        col.Bound("NP_PARAM_UID").Hidden();        
        col.Bound("PROCESS_GRP").Title("Process Group").HeaderHtmlAttributes(new { style = "text-align:center;" });
        col.Bound("PARAM_NAME").Title("Parameter Name").HeaderHtmlAttributes(new { style = "text-align:center;" });
        col.Bound("PARAM_VALUE").Title("Parameter Value").HeaderHtmlAttributes(new { style = "text-align:center;" });
        col.Bound("EXTERNAL_ID").Title("Table Name").HeaderHtmlAttributes(new { style = "text-align:center;" });
        col.Bound("EXTERNAL_FK").Title("Key Value").HeaderHtmlAttributes(new { style = "text-align:center;" });
        col.Bound("DEL_FLG").Hidden();
    })
    .DataSource(dataBinding =>
    {
        dataBinding.Ajax().Read(read => read.Action("SrchDataIniParam", "Admin",
            new
                {
                    area = "Admin",
                    strParam1 = ViewBag.Param1
                }))
                .ServerOperation(false);
    })
    .Resizable(resizing => resizing.Columns(true))
    .Selectable() 
    .Reorderable(reorder => reorder.Columns(true))
    .Pageable()
    .Sortable()
    .Filterable()
    .Render();
}

Now the grid loads empty at starup which is ok. But if the user clicks the grid header then also the underlying controller action gets called which is not desirable. I want the grid to get populated on button click which its doing fine.

Please help me to find where I am going wrong.
Atanas Korchev
Telerik team
 answered on 17 Oct 2012
1 answer
467 views
Id like to extend to the AutoComplete helper to pass in a data-bding html 5 attribute, I have the following:-

@(Html.Kendo().AutoComplete()
          .Name("productAutoComplete")
          .DataTextField("id")
          .DataTextField("name")
          .DataSource(source =>
              {
                  source.Read(read =>
                      {
                          read.Action("ProductSuggestions", "Search")
                            .Data("onAdditionalData").Type(HttpVerbs.Get);
                      }).ServerFiltering(true);
              })
              .Enable(true)
    )

I want to be able to add a new HtmlAttrobute something like this:-

.HtmlAttributes(new[] { "data-bind='executeOnEnter: products'" })

So that I can use a knockoutJS custom binding - can anyone help me with this?
kashyapa
Top achievements
Rank 1
 answered on 16 Oct 2012
10 answers
597 views
I'm looking to update an application developed using the MVC extensions, with the KendoUI MVC extensions. The application is centered around the treeview control, and I'm having difficulties working out equivalent functions in the KendoUI treeview.

To load data into the treeview, I'm making an ajax call, and populating an array with Treeview objects. I've changed the controller code to use Kendo TreeViewItems (and changed the value property to Id), and I'm getting data passed to the client.

However, the original code used the bindTo method to bind the data to the treeview, which seems absent in teh KendoUI treeview.

The original code is:-
$.ajax({
            type: "POST",
            async: true,
            contentType: "application/json;charset=utf-8",
            url: "@Url.Content("~/Home/GetTreeItems")",
            data: '{"PID":"' + pid + '"}',
            dataType: "json",
            success: function(data){
                var treeview = $('#AjaxTreeView').data('tTreeView');
                $('#spinner').hide();
 
                PID=data.PID;
                pathwayData=data.elementList;
                elementCount=data.ElementCount;
 
                treeview.bindTo(data.nodeList);
                $('#treeShower').show();
 
            },
            error: function(){
                alert("An error has occurred");
            }
            });

I've changed the line which identified the treeview to :-
var treeview = $('#AjaxTreeView').data('kendoTreeView');

but the code fails as there isn't a bindTo method - what can I use instead?

Also, I'm using several of the treeview events, but again, the equivalents for some aren't clear.

In the original code I'm using

OnNodeDrop
OnNodeDragStart
OnNodeDragging
OnSelect
OnNodeDropped

It looks lie the select, and dragstart events will map, and the Drop event is probably the same, but what about the OnNodeDragging and OnNodeDropped events - what are the kendo equivalents?

Thanks
Brannon
Top achievements
Rank 1
 answered on 16 Oct 2012
0 answers
225 views
Hi Guys,

I found an example of putting a checkbox in the header row of a grid and when checked, it will check all the checkboxes on every row of the grid. This has one glitch though... if you make the grid scrollable, all bets are off... Does someone have an example where this scenerio works on a scrollable grid?

William Seaward
William
Top achievements
Rank 1
 asked on 16 Oct 2012
4 answers
176 views
I'm trying to find a simple implementation of Kendo UI that uses Microsoft MVC to fetch any sample data from a back end server, hike it off to Kendo UI (as a datasource), edit the data and return it to the DB for update..

I'd expect to see the Kendo UI implementation of Knockout JS observable (which I think the datasource does) and the ability implement client side validation of the DataAnnotations. for example implement the MVC model data as a Kendo UI Datasource 

I'd also expect to see the Controller supplying the contents of the AutoComplete and DropDown widgets since it's not very MVVM-ish to include them as JavaScript variables in the Client side.

Currently I have access to the model using the DropDownFor or AutoCompleteFor but it unclear that they validate. Or if the "For" tools are even necessary if I convert the model to a Kendo UI DataSource

You've got an amazing tool set.. And now we need simple comprehensive examples.

thanks
Pat Tormey NH USA
Kevin White
Top achievements
Rank 2
 answered on 16 Oct 2012
0 answers
140 views
Hi,

I'd like to understand something concerning the line is the series.

Here's my code :
@(Html.Kendo().Chart<Noolibee.Presentation.Web.Administration.Areas.Nodes.Models.EnergyGraphModel>()
    .Name("intensityKendoChart")
    .ChartArea(chart => chart.Background(""))
    .DataSource(dataSource => dataSource.Read(read => read.Action("GetIntensityValues", "Plugins")))
    .Series(series =>
    {
        series
            .Line(line => line.Value)
            .Name("Ampere")
            .Color("blue")
            .Tooltip(true)
            .Width(2)
            .Markers(marker => marker.Type(ChartMarkerShape.Circle).Size(4));
    })
    )

Between 2 markers, I have a nice blue line.

Then I try to add a value for the XAxis, so I added the line:
.CategoryAxis(axis => axis.Categories(model => model.Date))

Now, the nice blue line has disappeared but the dates are displayed in on the axis ! Why ? How can I have my Xaxis with the dates and a nice blue line between the markers ?

Another little question : how to customize the dates so all dates are not displayed because it's a big mess on the axis :-)

Thanks
Sylvain
Sylvain
Top achievements
Rank 1
 asked on 16 Oct 2012
2 answers
1.2K+ views
Hi

I have a kendo ui grid which should be empty at startup. (Actually its a popup containing a kendo grid)

I have tried using the following code

$("#MyGrid").empty();
$("#MyGrid").kendoGrid();

But it make the grid header and footer invisible.

In Telerik I used to do it with grid.dataBind(null) which works perfectly

Please advise.
Vladimir Iliev
Telerik team
 answered on 16 Oct 2012
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
LLM Kit
+? more
Top users last month
Shiori
Top achievements
Rank 2
Iron
Tien
Top achievements
Rank 1
Iron
Robert
Top achievements
Rank 1
Rob
Top achievements
Rank 4
Bronze
Bronze
Iron
Geoff
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Top users last month
Shiori
Top achievements
Rank 2
Iron
Tien
Top achievements
Rank 1
Iron
Robert
Top achievements
Rank 1
Rob
Top achievements
Rank 4
Bronze
Bronze
Iron
Geoff
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?