Questions on Kendo UI for jQuery Forum

1 answer

235 views

Using Html.RenderAction in a Toolbar Template in MVC

In the folowing I am trying to render the output of an action to the grid using MVC 4:

.ToolBar(t=>t.Template(@<text>
@Html.RenderAction("DisplayAccountDropDown", "ClientAccountState");
<button class="k-button" id="clearFilter">Clear</button>
<a class="k-button" href="@Url.Action("Export", "Holdings")" >Export</a>
</text>))

But the Html.RenderAction doesn't have a return value to render so throws an error. Is there a way to get the output of the action into the toolbar? I am converting an app to use Kendo so would rather not have to change the controller if possible.

Grid

answered on 23 Aug 2013

3 answers

208 views

MVC Build Chart in the Controller

Is it possible to build a Chart in the MVC Control and pass it to the View in the Model? I want to do this so that I can dynamically display a chart based on the desired dashboard layout. So I want the View to dictate where the charts are displayed but I want the View to be ignorant of the reports content. Let me know if I haven't explained what I want to do well enough or if there is a better way. I plan to have the dashboard layouts and which reports those contain stored in a database.

This is a "mark up"
View

@model ChartCollection

@{

ViewBag.Title = "Dashboard";

}

<h2>

Dashboard

</h2>

@Html.Partial("_Report1", Model["ValidationResults"])

@Html.Partial("_Report2", Model["ClientComponents"])

ChartCollection(Model)

public class ChartCollection : Dictionary<string, IChart>

{

}

Controller

01.public class HomeController : Controller

02.{

03. public ActionResult Index()

04. {

05. ViewBag.Message = "Welcome to ASP.NET MVC!";

06.

07. return View();

08. }

09.

10. public ActionResult About()

11. {

12. ChartCollection charts = new ChartCollection();

13.

14. IChart chart;

15.

16. /// How do I duplicate this logic in the Controller?

17. @(Html.Kendo().Chart()

18. .Name("ClientComponents")

19. .Title("Components")

20. .DataSource(ds =>

21. {

22. ds.Model(model =>

23. {

24. foreach (DataColumn col in Model.QueryResults.Columns)

25. {

26. model.Field(col.ColumnName, col.DataType);

27. }

28. });

29. }

30. )

31. .Legend(legend => legend.Visible(true).Position(ChartLegendPosition.Bottom))

32. .Series(series => series.Bar(new int[] {2,4,6}).Name("MyValues"))

33. .CategoryAxis(yaxis => yaxis.Categories(new string[] {"Hello", "World"}))

34. .Tooltip(tip => tip.Visible(true)) )

35.

36. /// Add the IChart to the ChartCollection

37. charts.Add(chart.Name, chart)

38. return View(charts);

39. }

40. }

General Discussions

answered on 23 Aug 2013

5 answers

255 views

Problem with Scroller and ListView

Hi

I discovered an issue when use a Scroller with ListView mobile control. The following example might help to better explain the problem.

<div data-role="view" data-title="Test View" id="testView">

<div>

<input type="search" value="" id="searchfor" class="k-textbox" placeholder="Search..." />

</div>

<div data-role="scroller">

<ul data-role="listview" id="customersListview" data-type="group"></ul>

</div>

In this example there is a <div> area followed by the Scroller that contains a ListView control and list view items are populated in JavaScrip.
If I try this as it is, when scroll the items in the list view it also scrolls the <div> above the scroller and pushes the Search box outside of the screen.
The fix to this problem is to set a "Height" for the scroller but problem is that I want the list covers the rest of the screen on the device and height of the screen depends on the type of the device and I cannot specify a fixed height for the scroller that works on all types of the devices.
Is there any way to have this working without setting a fixed height?

Thanks
Ron

ListView (Mobile)

answered on 23 Aug 2013

1 answer

219 views

How do I change the decimal separator in numeric input fields?

I need to change the decimal separator to "," or, even better, apply a globalization-setting like 'de-DE' in a mobile environment, just
like the globalization demo for web applications: http://demos.kendoui.com/web/globalization/index.html

But when i try e.g.

$("#amount").kendoNumericTextBox({
format: "c2" //Define currency type and 2 digits precision
});

i only get: '$("#amount").kendoNumericTextBox' is not a funtion. what should i do?

TIA Peter

General Discussions

answered on 23 Aug 2013

6 answers

1.0K+ views

Recommended way to increase font size

Hello,

I would like the tree view to be much bigger to be used with more ease on mobile.
What is the recommended way to increase the font size and preserving the features like drag & drop, and selected items.

Thank you

TreeView

answered on 23 Aug 2013

1 answer

165 views

how to add cascade drop down list to Editor template

is there any possibility to add multiple drop down list (cascade drop down list)to editor template as resources.

Scheduler

answered on 23 Aug 2013

1 answer

131 views

Grid Not Loading JSON Data Properly but renders grid

For some reason I seem to be unable to get any more than the following in the Kendo UI Grid:

HTML:

<div id="grid"></div>

<script>

var remoteDataSource = new kendo.data.DataSource(

{

transport:

{

read: {

type: "POST",

dataType: "json",

url: "/home/getopportunities/"

}

},

pageSize: 4

})

$("#grid").kendoGrid(

{

dataSource: remoteDataSource,

columns: [

{

title: "Title",

headerAttributes: {

style: "text-align:center"

},

attributes: {

"class": "table-cell"

},

width: 600,

filterable: true

},

{

title: "Activity Type",

headerAttributes: {

},

attributes: {

"class": "table-cell",

style: "text-align:center"

},

width: 100,

filterable: true

},

{

title: "Specialty",

filterable: true,

headerAttributes: {

style: "text-align:center"

},

attributes: {

"class": "table-cell",

style: "text-align:center"

}

},

{

title: "Total Credits",

format: "{0}",

headerAttributes: {

style: "text-align:center"

},

attributes: {

"class": "table-cell",

style: "text-align:center"

}

],

height: 430,

scrollable: true,

sortable: true,

pageable: true,

filterable: {

extra: false,

operators: {

string: {

contains: "Contains",

startswith: "Starts with",

eq: "Is equal to",

neq: "Is not equal to"

},

number: {

eq: "Is equal to",

neq: "Is not equal to",

gte: "Greater Than",

lte: "Less Than"

}

});

</script>

This is the JSON as the browser sees it:

[

{"ActivityID":367,"Title":"Non Webinar Test For Calendar","ActivityType":"Other","TotalCredits":2,"Specialty":"[AB] [AE]"},

{"ActivityID":370,"Title":"Stage - Test SI Changes Part II","ActivityType":"Other","TotalCredits":2,"Specialty":"[NE]"},

{"ActivityID":374,"Title":"Webinar Test Event For Calendar","ActivityType":"Webinar","TotalCredits":2,"Specialty":"[FE] [NE] "},

{"ActivityID":401,"Title":"Module #1 Webinar: Learn Stuff","ActivityType":"Webinar","TotalCredits":2,"Specialty":"[AB] ",},

{"ActivityID":403,"Title":"Module #3 Webinar: Learn Even More Stuff","ActivityType":"Webinar","TotalCredits":2,"Specialty":"[AB] [AE]",}

]

I think I'm really close but can't make the last step to getting it working. All I get is a blank grid after the spinner runs.

Grid

answered on 23 Aug 2013

1 answer

359 views

Help !!, need to know wich action trigger the dataBound event

Hi, we need to know if there is a way to identify if the dataBound event was triggered because a filter was applied or a pagination action was perform. Please someone that can help us.

Thanks in advance.

Grid

answered on 23 Aug 2013

0 answers

88 views

Pre-loader is missing when you bind with Grid.

Dear Members,

I am using Grid load tons of listing under Kendo Grid where Ajax Pre-loader is important. It stopped working when we bind anything with Grid.

When you use data-bind with Grid the Ajax Pre-loader is lost but it fetches data after sometimes. My wont wait until they see a Ajax Pre-loader.

Can anyone share any code sample to show Ajax Pre-loader for Grid with bind example under MVVM framework.

Grid

asked on 22 Aug 2013

3 answers

163 views

Issue with "Back" button

Hello,

I have used your example and I have found a problem with the button "back".
In your example on the left side of the screen there are categories. When is chosen a category, a list of products appears.
If I want to see the categories again, I have to press the button “back”.
The issue appears when I press the button "back" twice and after that I chose a category. When I chose a category, appears a list with products, but when I press the button “back” the button doesn’t work.
Steps:
1. Chose a category
2. Press the button "back" twice
3. Chose category again
4. See products
5. Press the button "back"
Result: User cannot go back in categories .

How could be avoid this case?

SplitView

answered on 22 Aug 2013