Telerik Forums
UI for ASP.NET MVC Forum
6 answers
213 views
I have a Grid defined to display a Popup window for editing using a template.  The popup window displays correctly in IE9, but only shows up as a tiny box in Chrome and Firefox.

Any ideas why this might be occurring?
Iliana Dyankova
Telerik team
 answered on 09 Apr 2013
1 answer
160 views
HI Guys,
I experience very strange behavior of kendo combobox:
I have a view that accepts certain model that has IList<Item> Items { get; set; } in it.
I use knockout binding for variable length lists, which you can see in data-bind portion.
However combobox is not currently bound to anything, just trying to make it work with simplest possible scenario.

The following code basically causes combobox not to open (it just ignores clicking on the arrow and not showing selection options). You can type in but selection options aren't shown no matter what.
<table>
  <tbody data-bind="foreach: Items">
<tr>
 <td>
@(Html.Kendo().ComboBox()
 .Name("size")
 .Placeholder("Select size...")
 .BindTo(new List<string>() { "X-Small", "Small", "Medium", "Large", "X-Large", "2X-Large" })
 .SelectedIndex(3)
 .Suggest(true))
 </td>
</tr>
  </tbody>
</table>

As soon as I remove the entire combobox statement from within the <td> (even between <tr> and <td> or outside the table - it works as expected - shows selection options and you can select them, but not inside the <td> - typing works, but selection doesn't.

Can you please help!
Thank you very much in advance.
Daniel
Telerik team
 answered on 09 Apr 2013
4 answers
227 views
I have a base class that all other entities derive from which has created and modified dates. I want to automatically enter the dates based off logic which determines if the entity is being updated or inserted:

public override int SaveChanges()
{
DateTime now = DateTime.Now;
foreach (var entity in ChangeTracker.Entries<Base>()
.Where(e => e.State == EntityState.Added)
.Select(e => e.Entity))
{
entity.ModifiedOn = now; // set the date
entity.CreatedOn = now;
}
foreach (var entity in ChangeTracker.Entries<Base>()
.Where(e => e.State == EntityState.Modified)
.Select(e => e.Entity))
{
entity.ModifiedOn = now; // set the date
}

return base.SaveChanges();
}

I want to show the fields in the grid as read only, but the grid is doing ajax validation on these fields on edit and insert and I get an error "The field ModifiedOn must be a date." I want to disable the validation for just these fields. Here is the rest of the code below:

public abstract class Base
{
//[HiddenInput(DisplayValue = false)]
//[ReadOnly(true)]
//[DataType(DataType.Text)]
//[UIHint("DateTime")]
//[Display(Name = "Created On")]
//[DisplayFormat(DataFormatString = "{0:d}")]
[HiddenInput(DisplayValue = false)]
[DataType(DataType.Text)]
public DateTime CreatedOn { get; set; }
[Display(Name = "Created By")]
[HiddenInput(DisplayValue = false)]
[ScaffoldColumn(false)]
public int CreatedBy { get; set; }
[HiddenInput(DisplayValue = false)]
[DataType(DataType.Text)]
public DateTime ModifiedOn { get; set; }
[Display(Name = "Modified By")]
[HiddenInput(DisplayValue = false)]
[ScaffoldColumn(false)]
public int ModifiedBy { get; set; }
}

public class Parameter : Base
{
[Key]
[ScaffoldColumn(false)]
[DatabaseGenerated(DatabaseGeneratedOption.Identity)]
public int ParameterID { get; set; }
public string Name { get; set; }
public int Numeric { get; set; }
public string String { get; set; }
public string Description { get; set; }
}

<div>
<input type="button" visible="false" value="Insert" id="btnInsert">
<input type="button" visible="false" value="Edit" id="btnEdit">
<input type="button" visible="false" value="Save" id="btnSave">
<input type="button" visible="false" value="Delete" id="btnDelete">
</div>
<h2>Parameter Lookup Configuration</h2>
<br />
<br />
@(Html.Kendo().Grid<ECRI.Phoenix.Core.Models.Parameter>()
.Name("grid")
.Columns(columns =>
{
columns.Template(@<text></text>).ClientTemplate("<input type='checkbox' id='chkbx' class='chkbx' />")
.HeaderTemplate("<input type='checkbox' id='masterCheckBox' />").Width(30);
columns.Bound(p => p.Name);
columns.Bound(p => p.String);
columns.Bound(p => p.Numeric);
columns.Bound(p => p.Description);
columns.Bound(p => p.ModifiedBy);
columns.Bound(p => p.CreatedOn).Format("{0:d}");
columns.Bound(p => p.ModifiedOn).Format("{0:d}");
})
.Editable(editable => editable.Mode(GridEditMode.PopUp))
.Resizable(resize => resize.Columns(true))
.Reorderable(reorder => reorder.Columns(true))
.Groupable()
.Pageable()
.Sortable()
.Scrollable()
.Filterable()
.Selectable(selectable => selectable.Mode(GridSelectionMode.Multiple))
.DataSource(dataSource => dataSource
.Ajax()
.Model(model => model.Id(p => p.ParameterID))
.Read("Get", "Parameter")
.Update("Update", "Parameter")
.Create("Insert", "Parameter")
.Destroy("Delete", "Parameter"))
)

<script src="@Url.Content("~/Scripts/Phoenix.js")"></script>

$(document).ready(function () {
$("#btnDelete").click(function () {
var grid = $("#grid").data("kendoGrid");
var checked = false;
$.each($('#grid :checkbox:checked').closest('tr'), function () {
grid.removeRow($(this)); //just gives alert message
});
});
$("#btnEdit").click(function () {
var grid = $("#grid").data("kendoGrid");
grid.select().each(function () {
grid.editRow($(this)); //just gives alert message
});
});
$("#btnInsert").click(function () {
var grid = $("#grid").data("kendoGrid");
grid.addRow();
});
$('#masterCheckBox').click(function () {
if (this.checked)
$("#grid tbody input:checkbox").attr("checked", this.checked);
else {
$("#grid tbody input:checkbox").removeAttr("checked", this.checked);
}
});
});
Daniel
Telerik team
 answered on 09 Apr 2013
1 answer
316 views
Hi,
do you already have somewhere methods that can convert IFilterDescriptor and SortDescriptor to string representations that System.Linq.Dynamic can accept?

I am using WCF Plain Service generated with "Add OpenAcces Service..." tool and it accepts strings as filter and sort parameters, while on gui side I am using Kendo MVC that passes filter and sort descriptors.

I can make the converters myself, but would prefer to use library methods if you have already developed them yourself.

Thanks in advance.
Daniel
Telerik team
 answered on 09 Apr 2013
1 answer
315 views

Hi,

I have a simple master-detail implementation in a hierarchical grid. Everything works as expected if I pass the parent ID in following fashion

@(Html.T4Grid<NTL.Target.BusinessEntities.Customer>("Grid", allColumns,"Customer")
.ClientDetailTemplateId("template")
.HtmlAttributes(new { style = "height:430px;" })
.Events(events => events.DataBound("dataBound"))
)

<script id="template" type="text/kendo-tmpl">
 @(Html.Kendo().Grid<NTL.Target.BusinessEntities.Order>()
.Name("Grid_#=CustomerID#")
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(5)
.Read(read => read.Action("GetList", "Order", new { customerID = "#=CustomerID#" }))
)
.Pageable()
.Sortable()
.ToClientTemplate()
)
</script>
<script>
function dataBound() {
this.expandRow(this.tbody.find("tr.k-master-row").first());
}
</script>


I intend to abstract binding of the grid completely, as shown above in the code that the data binding has been done in the extension method (T4Grid). Now when I try following it ends up in an error saying 'invalid template'. It throws that error because #=CustomerID# wasn't replaced.

@(Html.T4Grid<NTL.Target.BusinessEntities.Customer>("Grid", allColumns,"Customer")
.ClientDetailTemplateId("template")
.HtmlAttributes(new { style = "height:430px;" })
)
<script id="template" type="text/kendo-tmpl">
@{
name="#=CustomerID#";
gname = "Grid_#=CustomerID#";
}
@(Html.T4Grid<NTL.Target.BusinessEntities.Order>(gname, allColumns, "Order", new { customerID = name }))
.ToClientTemplate()
)

What's the way of getting a field's value (server side) from the data source of the Parent Grid?

Extension Method

public static Kendo.Mvc.UI.Fluent.GridBuilder<T> T4Grid<T>(this HtmlHelper helper, string name, string allColumns, string controllerName, params object[] parameters)
where T : class
{
List<ColumnAttributes> columns = BuildColumns(allColumns);

return helper.Kendo().Grid<T>()
.Name(name)
.Columns(cols =>
{
if (columns != null)
foreach (ColumnAttributes ca in columns)
cols.Bound(ca.Name).Width(ca.Width).Title(ca.Title).Groupable(ca.Groupable);
}
)
.Sortable()
.Pageable()
.Scrollable()
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(10)
.Read(read => read.Action("GetList", "Order",parameters))
);

}
Atanas Korchev
Telerik team
 answered on 09 Apr 2013
1 answer
241 views
Is there any way to display column headers multi-line on row-templated grid with MVC ?

I'm using server side templating for displaying custom rows in kendo gird and it works really so cool. But I need to display so many column headers to get filter and order my data. So I want to display column headers in multi-lines with their ordering and filtering functionalties. Is there any way to do this?

I've attached an image that shows what I want to do. I  used a littile bit javascirpt to get the output but may be better ways allready exist.
Atanas Korchev
Telerik team
 answered on 09 Apr 2013
1 answer
561 views
Hi,

I had a popup window, which opens from the button inside tabstrip "Regime sequence" and i want my tabstrip to reload once the window is closed. But it is not reloading from my below script. Why??

Below is my code:

<script type="text/javascript">
$(document).ready(function () {
$(".k-window-action.k-link").click(function () {

var tabStrip = $("#abc").data("kendoTabStrip"); //finding tabstrip
var tabContent = $("#abc").data("kendoTabStrip").contentHolder(1); //selecting particular tab
tabStrip.reload(tabContent); //reloading the tab
}); 
});
</script>

 @(Html.Kendo().TabStrip()
        .Name("workshopServiceRegime_#=REGIME_ID#")
        .HtmlAttributes(new { @style = "margin-left:-40px", @id="abc" })
        .SelectedIndex(0)
        .Items(items =>
        {
            items.Add()
                .Text("Regime detail")
                .LoadContentFrom("ServiceRegimeDetail", "ServiceRegimeDetail");
            items.Add()
                .Text("Regime sequence")
                .LoadContentFrom("ServiceRegimeSequenceList", "ServiceRegimeSequenceList");
            items.Add()
                .Text("Regime MMSB")
                .LoadContentFrom("MMSBServiceRegimeList", "MMSBServiceRegimeList");
        })
    )

Daniel
Telerik team
 answered on 08 Apr 2013
2 answers
936 views
Hi,

1.  I have some data that loads into a Kendo grid via the Ajax binding.

2.   Within one of the columns there's a ClientTemplate that calls a javascript method (showAll).

3.   This method will call an action and get the details of the data, putting it into a json response, and
then open a jquery-ui dialog to show the details.

4.   When the user clicks on the link in the grid the HttpGet is triggered for the GetDetails action BUT,
the problem is, it is also triggered for the entire page's action (Index).

The question, I guess, is what is causing the Index action to be triggered? Because, the dialog will show, the detailed data will populate, but once I close the dialog all the filter textboxes will be reset and the grid will reload and the data within it.

Shouldn't the only action called be the GetDetails?

Any hints will be greatly appreciated!

Code:
@(Html.Kendo().Grid<LogViewModel>()
    .Name("LogGrid")
    .Columns(column =>
    {
column.Bound(x => x.StuffCount).Title("Stuff").Width(70)
            .ClientTemplate("<a onclick=\"showAll('" + "#= Id #')\"" + " href=''>#= StuffCount
#</a>");
    })

    .DataSource(dataBinding => dataBinding
                .Ajax()
                .PageSize(50)
                .Read(read => read.Action("GetData", "Summary")
                    .Data("getSearchFilters"))
                .Model(model => model.Id(o => o.Id)))
            .Events(e => e
                .DataBound("onGridItemsDatabound"))
            .Pageable(paging => paging.Refresh(true))
)}

<div id="dialog-message" title="" style="display: none">
    <p id="msg"></p>   
</div>

<script type="text/javascript">
    var showAll= function (id) {
        var url = '@Url.Action("GetDetails",
"Summary")' + "/" + id;
        var sTitle = 'title text';
        $.getJSON(url, null,

            function (data) {
                $("#dialog-message").dialog({ title: sTitle });
                $("#msg").text(data.details);
                showMessage();       
            });
    };

    var showMessage = function () {
        $("#dialog-message").dialog({
            modal: true,
            draggable: false,
            resizable: false,
            buttons: {
                Ok: function() {
                    $(this).dialog("close");
                }
            }
        });
    };
</script>

The controller methods
(content removed for brevity

public ActionResult Index(...)
{
    ...
}

public ActionResult GetDetails(Guid id)
{
    ... (get data from repository)
    return Json(data, JsonRequestBehavior.AllowGet);
}
TBG
Top achievements
Rank 1
 answered on 08 Apr 2013
1 answer
103 views
Hi,

We have been struggling to implement a kendo-ui grid for several days consuming data from a WCF service proxy.  All of our data tests in Fiddler work correctly and if we hard code a request in our Get action in the controller we can see the service is working and our dataset it retrieved.  We think the issue is that the URL is request is not an Odata request. I have looked through to see if there is an Html helper to specify Odata in the index.chtml grid builder but have not found anything.  We are pretty close to giving up on Kendo-ui completely  I feel like this should be much easier to implement.

index.chtml
@model IEnumerable<Application.ServiceProxy.CustomerDTO>
 
@(Html.Kendo().Grid(Model)   
    .Name("grid")
    .Columns(columns => {
        columns.Bound(c => c.customerID).Width(100);
        columns.Bound(c => c.name1).Width(100);
        columns.Bound(c => c.matchcode).Width(100);
        columns.Bound(c => c.city).Width(100);
        columns.Bound(c => c.postalCode).Width(100);
    })
     
    .Pageable()
    .Sortable()
    .Scrollable()
    .Filterable()
    //.HtmlAttributes(new { style = "height:430px;" })
    .DataSource(dataSource => dataSource
        .Ajax()
        .PageSize(20)
        .Read(read => read.Action("Get", "Customer")   
)




Customer Controller


using System;
using System.Collections.Generic;
using System.Net.Http;
using System.Web.Mvc;
using Kendo.Mvc.UI;
using Kendo.Mvc.Extensions;
using BusinessLogic.Models;
using System.Web;
using System.Linq;
using Newtonsoft.Json;
using Application.ServiceProxy;
using System.Web.Http;
 
using System.Web.Http.OData.Query;
using System.Web.Http.OData;
 
namespace Application.Controllers
{
    public class CustomerController : Controller
    {
 
        [Queryable(AllowedQueryOptions = AllowedQueryOptions.All)]
        public IEnumerable<ServiceProxy.CustomerDTO> Get()
        {
                var odataService = new Container(new Uri("http://localhost:8089/odata/"));
 
            var customer = odataService.Customer.Take(10);
            return customer.AsEnumerable();
        }
 
        public ActionResult Index() {
            return View() ;
        }
 
    }
 
}









BusinessLogic  customer controller (providing OData)

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Web;
using System.Net.Http;
using System.Web.Http;
using BusinessLogic.Models;
using System.Web.Http.OData.Query;
using System.Web.Http.OData;
 
 
 
namespace BusinessLogic.Controllers
{
    //public class CustomerController : CPSGlobalAPIController
    public class CustomerController : EntitySetController<CustomerDTO, int>
    {
        protected cpsGlobalEntities entity = new cpsGlobalEntities();
        #region mapper
 
        private IQueryable<CustomerDTO> mapCustomer()
        {
            return
                from c in entity.customer
                select new CustomerDTO()
                {
                    customerID = c.customerID,
                    matchcode = c.matchcode,
                    salesOrganizationCompanyCode = c.salesOrganization.companyCode,
                    salesOrganizationID = c.salesOrganizationID,
                    salesOrganizationName = c.salesOrganization.name,
                    statusID = c.statusID,
                    statusPrefix = c.status.prefix,
                    statusTranslationKey = c.status.translationKey,
                    serviceLevelStatusID = c.serviceLevelStatusID,
                    serviceLevelPrefix = c.status1.prefix,
                    serviceLevelTranslationKey = c.status1.translationKey,
                    systemID = c.systemID,
                    dunsNumber = c.dunsNumber,
                    mediaIDLogo = c.mediaIDLogo,
                    salesOrganization = c.salesOrganization.companyCode,
                    inventoryManagerID = c.inventoryManager.inventoryManagerID,
                    inventoryManagerAddressID = c.inventoryManager.addressID,
                    customerExternalSystemID = c.customerExternalSystemID,
                    internationalGroup = c.internationalGroup,
                    division = c.division,
                    corporateID = c.corporateID,
 
 
 
                    #region duplicated items for improved list view
                    name1 = c.customerExternalSystem.address.name1,
                    postalCode = c.customerExternalSystem.address.postalCode,
                    city = c.customerExternalSystem.address.city,
                    stateCode = c.customerExternalSystem.address.state.stateCode,
                    countryCode = c.customerExternalSystem.address.country.countryCode
                    #endregion
 
                };
        }
 
        #endregion
 
        #region GET
        #region GET all
         [Queryable]
        public override IQueryable<CustomerDTO> Get()
        {
            return mapCustomer().AsQueryable();
        }
        #endregion
 
        #region GET by ID
        protected override CustomerDTO GetEntityByKey(int key)
        {
            //return mapCustomer().FirstOrDefault(p => p.customerID == key);
 
            var cust = (from c in mapCustomer() where c.customerID == key select c).FirstOrDefault();
            if (cust.inventoryManagerAddressID != null)
            {
                AddressController adC = new AddressController();
                cust.inventoryManagerAddressDTO = adC.Get((int)cust.inventoryManagerAddressID);
            }
            if (cust.customerExternalSystemID != null)
            {
                CustomerExternalSystemController cesC = new CustomerExternalSystemController();
                cust.customerExternalSystemDTO = cesC.Get((int)cust.customerExternalSystemID);
            }
            if (cust == null)
                throw new HttpResponseException(Request.CreateResponse(HttpStatusCode.NotFound));
            return cust;
        }
 
        
        #endregion
 
        #region POST
 
        protected override CustomerDTO CreateEntity(CustomerDTO customerDTO)
        {
            var customer = new customer()
            {
                matchcode = customerDTO.matchcode,
                salesOrganizationID = customerDTO.salesOrganizationID,
                statusID = customerDTO.statusID,
                serviceLevelStatusID = customerDTO.serviceLevelStatusID,
                mediaIDLogo = customerDTO.mediaIDLogo,
                systemID = customerDTO.systemID,
                customerExternalSystemID = customerDTO.customerExternalSystemID,
                internationalGroup = customerDTO.internationalGroup,
                division = customerDTO.division,
                corporateID = customerDTO.corporateID,
                inventoryManagerID = customerDTO.inventoryManagerID,
                dunsNumber = customerDTO.dunsNumber
            };
 
            entity.customer.Add(customer);
            entity.SaveChanges();
 
            return GetEntityByKey(customer.customerID);
        }
 
        protected override int GetKey(CustomerDTO customer)
        {
            return customer.customerID;
 
        }
 
        
        #endregion
 
        #region Put
        protected override CustomerDTO UpdateEntity(int key, CustomerDTO customerDTO)
        {
 
            var originalCustomer = entity.customer.Find(key);
            originalCustomer.matchcode = customerDTO.matchcode;
            originalCustomer.salesOrganizationID = customerDTO.salesOrganizationID;
            originalCustomer.statusID = customerDTO.statusID;
            originalCustomer.serviceLevelStatusID = customerDTO.serviceLevelStatusID;
            originalCustomer.mediaIDLogo = customerDTO.mediaIDLogo;
            originalCustomer.systemID = customerDTO.systemID;
            originalCustomer.customerExternalSystemID = customerDTO.customerExternalSystemID;
            originalCustomer.inventoryManagerID = customerDTO.inventoryManagerID;
            originalCustomer.dunsNumber = customerDTO.dunsNumber;
            originalCustomer.internationalGroup = customerDTO.internationalGroup;
            originalCustomer.division = customerDTO.division;
            originalCustomer.corporateID = customerDTO.corporateID;
 
            entity.SaveChanges();
            return GetEntityByKey(key);
        }
 
 
        #endregion
 
        #region PATCH
 
        #endregion
 
        #region DELETE
 
        public override void Delete([FromODataUri] int key)
        {
            var customer = entity.customer.Find(key);
            if (customer == null)
            {
                throw new HttpResponseException(HttpStatusCode.NotFound);
            }
            entity.customer.Remove(customer);
            entity.SaveChanges();
        }
 
               #endregion
 
 
    }
}


Atanas Korchev
Telerik team
 answered on 08 Apr 2013
5 answers
195 views
As per:
 
http://www.kendoui.com/forums/mvc/general-discussions/update-destroy-operations-trigger-the-error-event-of-the-datasource-after-updating-to-q1-2013-(v-2013-1-319).aspx

Where can we get internal build 2013.1.327 ?

It's not listed when I'm logged into my account as an available internal build.

Rene.
Rosen
Telerik team
 answered on 08 Apr 2013
Narrow your results
Selected tags
Tags
+? more
Top users last month
Will
Top achievements
Rank 2
Iron
Motti
Top achievements
Rank 1
Iron
Hester
Top achievements
Rank 1
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Thomas
Top achievements
Rank 2
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Will
Top achievements
Rank 2
Iron
Motti
Top achievements
Rank 1
Iron
Hester
Top achievements
Rank 1
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Thomas
Top achievements
Rank 2
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?