Questions on Kendo UI for jQuery Forum

5 answers

134 views

I took your grid adaptive rendering sample, plopped it into jsbin and it works without issue. Once I changed the sample to MVVM, I started getting some strange functionality from it. The column menu/filter would work just like the non-mvvm sample, but editing a record would throw a popup just like if it were a non-adaptive rendered grid.

Your Grid Sample http://jsbin.com/ofaZose/3/edit
MVVM sample http://jsbin.com/ofaZose/4/edit

Is there a configuration I am missing, I've even gone into the chrome tools and overridden the user agent with a mobile one and use the mobile device's screen size etc, but still having some issues editing a record on an mvvm bound grid.
There are some strange css issues going on as well, as in the column menu and filter screens are very unstyled (not sure if this is from the same issue or maybe I've messed up a jsbin css link).

Thanks.

Robin

Grid

answered on 05 Dec 2016

1 answer

814 views

Using Bootstrap Inside WINDOW

Inside a a window component, using some bootstrap classes doesn't seem to work. For instance, col-lg-12 is not 1 row, but goes onto the second row.

Also - resizing the window does not cause bootstrap to respond well and stack the elements properly.

Thanks!

Window

answered on 05 Dec 2016

4 answers

407 views

Clear cross moves with padding-left

Hello

This is rather a visual problem than a real bug. I wanted to report it but can't find the page where you can report such things.

By default autocomplete Widget shows a cross on the right side of the input element, that also can be disabled by "clearButton: false". The autocomplete Widget in my project has a set "padding-left: 20px", so the text will not be hidden by a magnifying glass (see attached screenshot). The weird thing: Using "padding-left" also affects the clearButton position and moves it further into the text area. The visual effect is not that nice. I understand that the clearButton should not hit the right border but its position should only be affected by padding-RIGHT and not padding-LEFT. I disabled it for that reason.

Regards

AutoComplete

answered on 02 Dec 2016

1 answer

1.6K+ views

How to get time from kendoDateTimePicker?

Hello

Just working with kendoDateTimePicker... I have a startdate and an enddate, both working wit DateTimePicker. After entering both I have to evaluate if endtime is bigger than starttime. I'm able to get year, month and day by:

startDate.getFullYear()
startDate.getMonth()
startDate.getDay()

That works fine even if month (getMonth()) comes back with a month number 1 lower than expected. Example:

January: 0 (expected: 1)
December: 11 (expected: 12)

It looks like that these functions starts counting the months of the year by 0 and not by 1, maybe thats wanted.

Furthermore I don't know if I can get these values (month, day) back with two digits: "01" instead of "1"? I can handle that also in Javascript, just additional work.

So the main question is: How can I get time out of kendoDateTimePicker (hours and minutes)? I couldn't find functions like getHour() or getMinute(). In hope it would somehow helps I have added: parseFormats: ["MMMM yyyy", "HH:mm"]

Regards

DatePicker

answered on 02 Dec 2016

2 answers

199 views

[Solved] ListView with Angular not loading data

Hi,

I'm trying to create a simple ListView using Angular but I can't get the ListView to show any data. What am I doing wrong?

http://dojo.telerik.com/@daxriders/IGeSA

Thank you.

Christian

ListView

answered on 02 Dec 2016

3 answers

243 views

Paging in SOA Setup

Hi!

I have my solution setup as follows (image also attached):

Data <--> Business <--> WCF Service <--> Intranet <--> WCF Client <--> Website

I have attempted to implement paging but it is not the most optimal way. Here is the code that starts with the website and ends in the Data Layer:

View:

@(Html.Kendo().Grid(Model.SearchResults)

.Name("GridSearchResults")

.HtmlAttributes(new { style = "height: 400px" })

.EnableCustomBinding(true)

.Columns(columns =>

{

columns.Bound(p => p.ParkingCardId).Title("Id").Width(80).ClientTemplate("<a href='" + Url.Action("ParkingCardDetail", "CardRequest", new { parkingCardId = "#= ParkingCardId #'" }) + ">#= ParkingCardId #</a>");

columns.Bound(p => p.Name).Title("Name");

columns.Bound(p => p.Company).Title("Company");

columns.Bound(p => p.CardType).Title("Card Type").Width(100);

columns.Bound(p => p.DrivingLicenseNo).Title("License #");

columns.Bound(p => p.SeasonPassNo).Title("Season Pass #");

columns.Bound(p => p.Status).Title("Status");

columns.Bound(p => p.ReceiptNo).Title("Receipt #").Width(140).ClientTemplate("<a href='" + Url.Action("Report1", "Ajax", new { billNo = "#= ReceiptNo #'" }) + ">#= ReceiptNo #</a>");

})

.Pageable()

.Scrollable()

.DataSource(dataSource => dataSource

.Ajax()

.PageSize(30)

.Read(read => read

.Action("IndexResults", "CardRequest")

.Data("searchExtraParameters")

)

Controller:

public async Task<ActionResult> Index()

{

ViewBag.Module = (int)PageModule.SearchCardRequests;

await GetMasterLookForRequest(lookupManager, billingManager);

return View(new ParkingCardSearchViewModel());

}

public async Task<ActionResult

> IndexResults([DataSourceRequest(Prefix = "Grid")]  DataSourceRequest request, int? companyId, int? categoryId, int? serviceId, int? paymentModeId, int? statusId, int? extraSearch, string extraSearchKeywords)

{

ViewBag.Module = (int)PageModule.SearchCardRequests;

#region Apply paging

if (request.PageSize == 0)

{

request.PageSize = 30;

}

var pager = new PagingHelper { Skip = 0, Take = request.PageSize };

if (request.Page > 0)

{

pager.Skip = (request.Page - 1) * request.PageSize;

}

#endregion

// Get results

var results = await searchManager.GetCardRequestForSearch(pager, companyId, categoryId, serviceId, paymentModeId, statusId, extraSearch, extraSearchKeywords);

var result = new DataSourceResult()

{

Data = results.Item2, // Process data (paging and sorting applied)

Total = results.Item1 // Total number of records

};

//Return the result as JSON.

return Json(result);

}

Client:

public async Task<Tuple<int, IList<SearchCardRequest>>> GetCardRequestForSearch(PagingHelper pager, int? companyId, int? categoryId, int? serviceId, int? paymentMode, int? statusId, int? extraSearchId, string searchKeywords)

{

try

{

var result = await proxy.CallAsync(m => m.GetCardRequestForSearch(pager, companyId, categoryId, serviceId, paymentMode, statusId, extraSearchId, searchKeywords));

return result;

}

catch (FaultException<CarParkFault> fault)

{

throw new ClientException("Exception from server for GetCardRequestForSearch: " + fault.Message);

}

catch (Exception exp)

{

throw new ClientException("General exception from server for GetCardRequestForSearch: " + exp.Message);

}

Service:

[OperationContract]

[FaultContract(typeof(CarParkFault))]

Tuple<int, IList<BDO.SearchCardRequest>> GetCardRequestForSearch(BDO.PagingHelper pager, int? companyId, int? categoryId, int? serviceId, int? paymentMode, int? statusId, int? extraSearchId, string searchKeywords);

public Tuple<int, IList<BDO.SearchCardRequest>> GetCardRequestForSearch(BDO.PagingHelper pager, int? companyId, int? categoryId, int? serviceId, int? paymentMode, int? statusId, int? extraSearchId, string searchKeywords) {

Tuple<int, IList<BDO.SearchCardRequest>> objMaster;

try

{

using (var context = new BLL.SearchLogic())

{

objMaster = context.GetCardRequestForSearch(pager, companyId, categoryId, serviceId, paymentMode, statusId, extraSearchId, searchKeywords);

}

catch (Exception ex)

{

throw new FaultException<CarParkFault>(

new CarParkFault { Message = ex.Message, Result = false, Description = ex.ToString() },

new FaultReason("Service failed to serve GetCardRequestForSearch()")

);

}

return objMaster;

}

Business:

public Tuple<int, IList<BDO.SearchCardRequest>> GetCardRequestForSearch(BDO.PagingHelper pager, int? companyId, int? categoryId, int? serviceId, int? paymentMode, int? statusId, int? extraSearchId, string searchKeywords)

{

Tuple<int, IList<BDO.SearchCardRequest>> responseObject;

try

{

responseObject = searchRepo.GetCardRequestForSearch(pager, companyId, categoryId, serviceId, paymentMode, statusId, extraSearchId, searchKeywords);

}

catch (Exception exp)

{

throw new BusinessLayerException("GetCardRequestForSearch Failed: " + exp.Message, exp);

}

return responseObject;

}

Data:

public Tuple<int, IList<BDO.SearchCardRequest>> GetCardRequestForSearch(BDO.PagingHelper pager, int? companyId, int? categoryId, int? serviceId, int? paymentMode, int? statusId, int? extraSearchId, string searchKeywords)

{

#region Setup

IList<BDO.SearchCardRequest> result;

var sqlConnection = new SqlConnection { ConnectionString = WebConfigurationManager.ConnectionStrings["BlaBla"].ConnectionString };

var sqlDataAdapter = new SqlDataAdapter { SelectCommand = new SqlCommand { CommandType = CommandType.Text, Connection = sqlConnection } };

var dataSet = new DataSet();

#endregion

try

{

var sqlSearch = @"

SELECT ParkingCards.ParkingCardId ,

ParkingCards.Name ,

ParkingCards.CompanyId ,

ParkingCards.SeasonPassNo ,

Companies.NameE AS Company ,

ParkingCards.Nationality ,

ParkingCards.Status ,

ParkingCards.CardType ,

ParkingCards.DrivingLicenseNo ,

ParkingCards.Amount ,

ParkingCards.PaymentMode ,

ParkingCards.ReceiptNo ,

ParkingCards.VehicleNo ,

ParkingCards.IsBlock

";

if (categoryId != null)

{

sqlSearch = sqlSearch + " FROM ParkingCards LEFT OUTER JOIN Companies ON ParkingCards.CompanyId = Companies.CompanyId ";

}

else

{

sqlSearch = sqlSearch +

" FROM Category  INNER JOIN Companies  ON Category.CategoryId = Companies.CategoryId RIGHT OUTER JOIN ParkingCards  ON Companies.CompanyId = ParkingCards.CompanyId "

;

}

sqlSearch = sqlSearch + " where ParkingCardId > 0 and status in (0,2,4,5,6,7,15)";

#region Dynamic "Where"s

if (categoryId != null)

{

sqlSearch = sqlSearch + " and Companies.CategoryId = " + categoryId.Value;

}

if (companyId != null)

{

sqlSearch = sqlSearch + " and ParkingCards.CompanyId = " + companyId.Value;

}

if (serviceId != null)

{

sqlSearch = sqlSearch + " and ParkingCards.ServiceCode = " + serviceId.Value;

}

if (paymentMode != null)

{

sqlSearch = sqlSearch + " and ParkingCards.PaymentMode = " + paymentMode.Value;

}

if (statusId != null)

{

sqlSearch = sqlSearch + " and ParkingCards.Status = " + statusId.Value;

}

if (extraSearchId != null && !string.IsNullOrWhiteSpace(searchKeywords))

{

if (extraSearchId.Value == 1)

{

// ParkingCardId

sqlSearch = sqlSearch + " AND ParkingCards.ParkingCardId = '" + searchKeywords + "'";

}

else if (extraSearchId.Value == 2)

{

// AirportPassNumber

sqlSearch = sqlSearch + " and ParkingCards.AirportPassNumber = '" + searchKeywords + "'";

}

else if (extraSearchId.Value == 3)

{

// StaffNo

sqlSearch = sqlSearch + " and ParkingCards.StaffNo = '" + searchKeywords + "'";

}

else if (extraSearchId.Value == 4)

{

// SeasonPassNo

sqlSearch = sqlSearch + " and ParkingCards.SeasonPassNo like '%" + searchKeywords + "%'";

}

else if (extraSearchId.Value == 5)

{

// Name

sqlSearch = sqlSearch + " and ParkingCards.Name like '%" + searchKeywords + "%'";

}

#endregion

sqlConnection.Open();

sqlDataAdapter.SelectCommand.CommandText = sqlSearch + " Order by ParkingCardID desc";

sqlDataAdapter.Fill(dataSet);

result = new List<BDO.SearchCardRequest>();

if (dataSet.Tables.Count == 1)

{

foreach (DataRow dataRow in dataSet.Tables[0].Rows)

{

var newRecord = new BDO.SearchCardRequest();

try

{

newRecord.ParkingCardId = dataRow.Field<int>("ParkingCardId");

newRecord.Name = dataRow.Field<string>("Name");

newRecord.CompanyId = dataRow.Field<int?>("CompanyId");

newRecord.SeasonPassNo = dataRow.Field<string>("SeasonPassNo");

newRecord.Company = dataRow.Field<string>("Company");

newRecord.Nationality = dataRow.Field<string>("Nationality");

newRecord.StatusId = dataRow.Field<byte?>("Status");

newRecord.Status = CommonFunctions.GetStatusAgainstStatusId(newRecord.StatusId);

newRecord.CardTypeId = dataRow.Field<int>("CardType");

newRecord.CardType = CommonFunctions.GetCardTypeAgainstCardTypeId(newRecord.CardTypeId);

newRecord.DrivingLicenseNo = dataRow.Field<string>("DrivingLicenseNo");

newRecord.Amount = dataRow.Field<decimal?>("Amount");

newRecord.PaymentModeId = dataRow.Field<int>("PaymentMode");

newRecord.PaymentMode = CommonFunctions.GetPaymentModeAgainstPaymentModeId(newRecord.PaymentModeId);

newRecord.ReceiptNo = dataRow.Field<string>("ReceiptNo");

newRecord.VehicleNo = dataRow.Field<string>("VehicleNo");

newRecord.IsBlock = dataRow.Field<bool?>("IsBlock");

newRecord.IsBlockS = CommonFunctions.GetYesNoForBool(newRecord.IsBlock);

}

catch (Exception e)

{

throw new RecordReadingException("Error adding new SearchCardRequest: " + e.Message + "\nFaulting Row: " + dataRow.ItemArray.DebugArray(), e);

}

result.Add(newRecord);

}

finally

{

dataSet.Dispose();

sqlDataAdapter.Dispose();

sqlConnection.Dispose();

}

return new Tuple<int, IList<BDO.SearchCardRequest>>(result.Count, result.Skip(pager.Skip).Take(pager.Take).ToList());

}

Result:
It seems that the data on the grid is not changing when changing page and everytime, I'm reading the whole data just to get a new page. Is there a better way to do this?

Grid

answered on 02 Dec 2016

1 answer

119 views

Drag to copy date format column

Hi,

When I drag the date format column in spreadsheet, it'll automatically add 1 day of the next copied column.

I wish to copy the value of the column instead of fill the series. Is there any way to do so?

If I set it to string format, it'll fill the series by adding 1 year to it. The date format that I used was "dd-MMM-yyyy".

Thanks

Regards,

Su Pei

Spreadsheet

answered on 01 Dec 2016

1 answer

247 views

Creating a Spreadsheet from a SharePoint List

Hello.

I would like to be able to insert data from a SharePoint list into a kendo spreadsheet. Is there example code / a template for doing this?

Thank you for your help.

Spreadsheet

answered on 01 Dec 2016

1 answer

117 views

What Kendo component can layout data in this design?

Not wanting anything editable nor a spreadsheet. What I was really wanting is the Kendo grid however I don't see options to format data this way.

What I am trying to show is a list of three people and when they are available for the day. Image attached. I have not found a way to have a frozen column - the online demo does grouping only. And adding a column for each employee doesn't then list any data below them. I'm willing to restructure my internal data any way that Kendo components would prefer. Currently I have a list of Employees and each Employee contains a list of times.

General Discussions

answered on 01 Dec 2016

13 answers

596 views

How to get grid work in kendo ui mobile (in Icenium Graphite)

I have created a kendo ui mobile project in Icenium Graphite, which has kendo.mobile.min.js included. I understand that there's no grid in kendo mobile and kendo.all.min.js can't coexist with kendo.mobile.min.js. So I added kendo.grid.min.js, along with kendo.common.min.css and kendo.default.min.css.
But I am getting error:
"Uncaught TypeError: undefined is not a function" from kendo.grid.min.js:10

Any idea how to get grid to work in kendo ui mobile? What files to include and in what order?

Grid

answered on 01 Dec 2016