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

1.  Create a new KendoUI MVC 4 application.
2.  Copy the NorthwindDB, Controller, View, Model and supporting classes for the Grid Editing_Inline example code found from the KendoUI MVC examples install.
3. Build and run - Grid comes up, I can sort and page and add new record. 
THE ISSUE:  When I click edit - the row changes and allows me to change values.  I make sure I change some to make it dirty.  I then click Update.  I can confirm (through a breakpoint) that the Controllor Action EditingInline_Update is hit.
HOWEVER- the Grid Row DOES NOT Change back to a non-edit mode. 

I have tried all sorts of things - updating the jquery version. Making sure my script references match the examples project, etc etc.

WHAT AM I missing??
Marc Samale
Top achievements
Rank 1
 answered on 14 May 2013
1 answer
313 views
Why the DropDownList .Value() method changes the value of the <input> element, but not displaying it. I saw that it displays some value in a <span> element that I don't know how to change. When I use DropDownListFor(x => x.UserName) I want my default value to be what I have in the Model. My question is how to set the default value of a DropDownList?
Georgi Krustev
Telerik team
 answered on 14 May 2013
3 answers
451 views
Hi

I saw the below link

http://demos.kendoui.com/web/combobox/cascadingcombobox.html

i have three combo box

@(Html.Kendo().ComboBox()
.Name("userComboBox") //The name of the combobox is mandatory. It specifies the "id" attribute of the widget.
.DataTextField("UserName") //Specifies which property of the Product to be used by the combobox as a text.
.DataValueField("UserID") //Specifies which property of the Product to be used by the combobox as a value.
.Filter(FilterType.StartsWith)
.Placeholder("Select Name...")
.DataSource(source =>
{
source.Read(read =>
{
read.Action("GetUsers", "UserDetails").Data("onAdditionalData"); //Set the Action and Controller name
})
.ServerFiltering(true); //If true the DataSource will not filter the data on the client.

}).Events(e=>e.Change("combobox_change"))




//Select first item.
)

@(Html.Kendo().ComboBox().Name("entityDetails")
.DataTextField("EntityName")
.DataValueField("EntityID")
.DataSource(source => {
source.Read(read =>
{
read.Action("GetEntity", "UserDetails").Data("onAdditionalDataEntity");
})

.ServerFiltering(true);
}) .SelectedIndex(0)
.CascadeFrom("userComboBox")



)

@(Html.Kendo().ComboBox().Name("ClientDetails")
.DataTextField("ClientName")
.DataValueField("ClientID")
.DataSource(source => {
source.Read(read =>
{
read.Action("GetClientDetails", "UserDetails").Data("onAdditionalDataForClient");
})
.ServerFiltering(true);
})
.SelectedIndex(0)
.CascadeFrom("userComboBox")
)

//js
function onAdditionalData() {
var data = $("#userComboBox").data("kendoComboBox")
value1 = data.input.val();
return {
text: value1

};

}
function onAdditionalDataEntity() {
var data = $("#userComboBox").data("kendoComboBox")
value1 = $("#userComboBox").val();
return {
userData: value1,
entity: $("#entityDetails").data("kendoComboBox").input.val()

};

}
function onAdditionalDataForClient() {
var data = $("#userComboBox").data("kendoComboBox")
value1 = $("#userComboBox").val();
return {
userData: value1,
entity: $("#ClientDetails").data("kendoComboBox").input.val()
};

}

//controller
public JsonResult GetUsers(string text)
{
return Json(GetActiveUser, JsonRequestBehavior.AllowGet);
}

public JsonResult GetClientDetails(string userData, string entity)
{
 
// return userDetailsDAO.GetUserDetails(id);
return Json(GetClientDetails, JsonRequestBehavior.AllowGet);
}
public JsonResult GetEntity(string userData, string entity)
{
 
return Json(GetEntityDetails, JsonRequestBehavior.AllowGet);
}





1) user combo box need to cascade with other two so when i load user combo i need to load and select details
2) i can do load but cant select the first item

Can you guys help me

Senthil
Vladimir Iliev
Telerik team
 answered on 14 May 2013
1 answer
529 views
Hi
I am trying to load a treeview using an Ajax call but with the load on demand set to false, I am looking to return the hierarchy to the client in a single call.  The basic layout of the treeview is simple

@(Html.Kendo().TreeView()
                          .Name("AvailablePortfolios")
                        .DataSource(dataSource => dataSource.Read("GetSelectedClientPortfolios", "PortfolioGroup"))
                        .LoadOnDemand(false))

and the json returned from the client is

[{"id":10014853,"text":"Ali, Mr Jake","items":[{"id":35443,"text":"Individual Investment Account (IMF0BGNX  D)","hasChildren":false},{"id":35444,"text":"ISA (IMF0BGNXSHD)","hasChildren":false}],"hasChildren":true}]

When I use this setup I find that the client is making roughly 20 - 30 requests to the server with the following request

GET /Platform/Tools/PortfolioGroup/GetSelectedClientPortfolios?id=10014853 HTTP/1.1

The Treeview then displays the first level correctly but whenever I attempt to expand out the tree I get the first node repeated.

Is there something wrong with the way my json is constructed or is there some other step I have missed.  Are there any examples of an Ajax request with load on demand set to false.

Thanks

Colin
Daniel
Telerik team
 answered on 14 May 2013
2 answers
404 views

New to Kendo & MVC, so please bear with me.
I have a view that contains a grid that is working almost perfectly for me. My model is a System.Data.DataTable which is generated by a service, and is entirely dynamic (in that I don't know the schema until runtime). I'm injecting the model directly into the View, which uses the DataColumn definitions in the DataTable to generate the presentation layer (GridColumnSettings):

@using System.Data
@using System.Linq
@using Kendo.Mvc.UI
 
@model System.Data.DataTable
 
@(Html.Kendo()
    .Grid(Model)
    .Name("View")
    .Columns(columns => columns.LoadSettings(
        Model.Columns.Cast<DataColumn>().Select(dc => new GridColumnSettings {
            Member = dc.ColumnName,
            Title = dc.Caption,
            MemberType = dc.DataType,
            Format = "{0:" + dc.ExtendedProperties["format"] + "}",
            Width = "100px"
      })))
    .Sortable()
    .Scrollable()
)

 

I'm quite happy with this approach - it's simple and elegant and keeps the Model (arguably ViewModel) and Controller blissfully ignorant of any Kendo/UI concepts. The only problem with this is that sorting always calls back into the Controller, and the DataTable is regenerated, even though it will not have changed.

I've seen in some Ajax samples the use of a 'serverSorting' property on a 'dataSource' instance, and I think I need to set that to false in order to get what I want, but I can't see how that applies in my MVC scenario. I don't want to set up a DataSource() that makes an Ajax() call that then Read()s the returned Json, because I have all the data already, but I'm struggling to see how else would I get access to the DataSource.ServerSorting property.

What am I missing?



Wayne
Top achievements
Rank 1
 answered on 13 May 2013
3 answers
185 views
Hi,
I'm using ASP.NET MVC Wrapper for KendoUI in my project.
I saw Grid ColumnMenu and I want to use it and it works everything but the menu lists 3 undefined columns. My grid has 3 columns without model binding and with empty title but I set this
.IncludeInMenu(false)
but nothing changes. So I've tried to comment those columns but nothing changes again.
How can I solve this problem?

Thanks,
Matteo.
Petur Subev
Telerik team
 answered on 13 May 2013
0 answers
169 views
Hello!
ex: I have field in Model
I use this:
<tr>
    <td>
                        @Html.LabelFor(model => model.ThicknessDry)
    </td>
    <td>
                        @Html.EditorFor(model => model.ThicknessDry
    </td>
</tr>

.HtmlAttributes(new { id = Guid.NewGuid().ToString() })
 but I can't  call to my ThicknessDry (thicknessDry.png), because I use new Id ( this need to me)
P.S. I can't delete this code: .HtmlAttributes(new { id = Guid.NewGuid().ToString() }) ( in EditorTemplates)

....later
This code help me!
$("input[name=ThicknessDry]").val();

Gusev
Top achievements
Rank 1
 asked on 11 May 2013
12 answers
365 views
<section id="maincontent">
    <div class="container">
        @(Html.Kendo().Grid<Person>()
              .Name("Grid")
              .Columns(columns =>
              {
                  columns.Bound(s => s.PersonID);
                  columns.Bound(s => s.FirstName);
                  columns.Bound(s => s.Surname);
                  columns.Bound(s => s.IsEmployed);
                  columns.Command(c =>
                  {
                      c.Edit();
                      c.Destroy();
                  });
              })
              .ToolBar(tools =>
              {
                  tools.Create();
              })
              .Sortable()
              .Pageable()
              .Filterable()
              .DataSource(dataSource => dataSource
                .Ajax()
                    .Model(model =>
                    {
                        model.Id(s => s.PersonID);
                    })
                    .Read(read => read.Url("api/Person").Type(HttpVerbs.Get))
                    .Create(create => create.Url("api/Person").Type(HttpVerbs.Post))
                    .Update(update => update.Url("api/Person").Type(HttpVerbs.Put))
                    .Destroy(destroy => destroy.Url("api/Person").Type(HttpVerbs.Delete))
              )
        )       
 
    </div>
</section>
 
<script>
 
$(function() {
    var grid = $("#Grid").data("kendoGrid");
 
    // WebAPI needs the ID of the entity to be part of the URL e.g. PUT /api/Person/PutPerson/80
    grid.dataSource.transport.options.update.url = function(data) {
        return "api/Person/PutPerson/" + data.personID;
    };
     
    // WebAPI needs the ID of the entity to be part of the URL e.g. DELETE /api/Person/DeletePerson/80
    grid.dataSource.transport.options.destroy.url = function(data) {
        return "api/Person/DeletePerson/" + data.personID;
    };
});
 
</script>
Hi,
I'm trying to accomplish following Task as this example shows :

Binding to a Web ApiController
http://www.kendoui.com/code-library/mvc/grid/binding-to-a-web-apicontroller.aspx

The problem is that without giving any error the DataGrid simply doesn't show/Bind the data. When checking the Traffic and the data which is retrieved everything looks fine.

Any ideas?
thanks in advance


, here the return json data:

....

[{"personID":"3123","firstName":"231","surname":"312321","isEmployed":null},{"personID":"999","firstName":"The","surname":"Best Employee","isEmployed":"Master"},{"personID":"P001","firstName":"XXX","surname":"XXX","isEmployed":null},{"personID":"P002","firstName":"XXX","surname":"XXX","isEmployed":null},{"personID":"P003","firstName":"XXX","surname":"XXX","isEmployed":null},{"personID":"P004","firstName":"XXX","surname":"XXX","isEmployed":null},{"personID":"P005","firstName":"XXX","surname":"XXX","isEmployed":null},{"personID":"P006","firstName":"XXX","surname":"XXX","isEmployed":null},{"personID":"P007","firstName":"XXX","surname":"XXX","isEmployed":null},{"personID":"P008","firstName":"XXX","surname":"XXX","isEmployed":null}]

....

and here my View:

and here my ApiController:
namespace KiScope.RemoteClient.WebAPI.Controllers.Apis
{
    // Specify on Controller level that the user has to authorize before he can start
    // The actual implementation of the Redirect to Login functionality has to be done on the client side
    // here is a video explaining this: http://www.asp.net/web-api/videos/getting-started/authorization
    //[Authorize]
    public class PersonController : ApiController
    {
        // Remember that the UOW disposes itself after usage, so no need to handle this manually
        private readonly IRemoteClientUoW uow;
 
        // Ninject Initialization
        public PersonController(IRemoteClientUoW _uow)
        {
            uow = _uow;
        }
 
        public DataSourceResult GetPeople([ModelBinder(typeof(ModelBinders.DataSourceRequestModelBinder))] DataSourceRequest request)
        {
            var seaman = uow.Person.GetAll();
 
            return seaman.ToDataSourceResult(request,s => new
                {
                    s.PersonID,
                    s.FirstName,
                    s.Surname,
                    s.IsEmployed
                }
            );
        }
// ... MORE CODE
apostolis
Top achievements
Rank 1
 answered on 10 May 2013
2 answers
144 views
i keep see in code examples, a template  like this
columns.Template(t => { }).HeaderTemplate("").ClientTemplate(@"
< a href='javascript: void(0)' class='abutton edit' onclick='editRow(this)' title='button edit'>button edit</a>
< a href='javascript: void(0)' class='abutton delete' onclick='deleteRow(this)' title='button delete'>button delete</a>")

if i have to give other parameters to that editRow javascript function or multiple,for example a string something like editRow(this,2,'text',g) can i do it ? and how do i format this in that template context?
from the above example some parameters are given by value,some by reference.


and if i write "this" ,always it is interpreted as the sender of that event?it's very insteresting,i write something as a text and it is interpreted as a valid value,in this case a reference.


Regards,
Daniel
Daniel
Top achievements
Rank 1
 answered on 10 May 2013
2 answers
190 views
Hi I have a column in my grid that is a DateTime field with long format date e.g. Friday, May 10, 2013

This is how it is defined in the ViewModel

[Required]
[DataType(DataType.Date)]
[DisplayFormat(DataFormatString = "{0:D}")]
[Display(Name = "Visit Date")]
public DateTime VisitDate { get; set; }
The column is displayed correctly with what I want e.g. Friday, May 10, 2013 but when I get the selected row data for that column it is coming back with the following:
[17:39:18.580] VisitDate: Fri May 10 2013 00:00:00 GMT-0400 (Eastern Daylight Time)
Here is the code on the view to get the selected row.

function deleteRow() {
    var grid = $('#scheduleGrid').data('kendoGrid');
    var rows = grid.select();
    if (rows.length > 0) {
        var dataItem = grid.dataItem(rows);
        console.log("VisitDate: " + dataItem.VisitDate);
    }
}

How do I change it to get the long format date that is displayed in the grid? Any help greatly appreciated.
Vince
Top achievements
Rank 1
 answered on 10 May 2013
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
Security
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
SegmentedControl
+? more
Top users last month
Boardy
Top achievements
Rank 2
Veteran
Iron
Benjamin
Top achievements
Rank 3
Bronze
Iron
Veteran
ivory
Top achievements
Rank 1
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
ClausDC
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Boardy
Top achievements
Rank 2
Veteran
Iron
Benjamin
Top achievements
Rank 3
Bronze
Iron
Veteran
ivory
Top achievements
Rank 1
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
ClausDC
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?