Questions on UI for ASP.NET MVC Forum

1 answer

122 views

Unable to get property 'data' error while updating Grid

Hello,

I am trying to update the grid through popup

I am getting the below error
0x800a138f - JavaScript runtime error: Unable to get property 'data' of undefined or null reference
also if I click the Edit button and again click on cancel in the Edit popup , the record i have used is missing in the grid
Please help me
here is my code.
dataSource: {
type: "json",
transport: {
read: URL,
update: {
url: UpdateURL,
dataType: "json",
type: "POST"
},
parameterMap: function (data, operation) {
if (operation !== "read") {
return kendo.stringify(data);
}
}
},
requestStart: function(e) {
if (e.type == "update") {
//My LOGIC
debugger;
}
},

schema: {

type: "json",
id: "ID",
model: {
fields: {
ID: { type: "number", editable: false},
Name: { type: "string", validation: { required: true } },
Status: { type: "string" },
Access: { type: "string", nullable: true },
Address: { type: "string" },
Comment: { type: "string", validation: { required: true } },
ParentID: { type: "number", validation: { required: true } },
ParentName: { type: "string" },
}
}
},
serverPaging: false,
serverFiltering: false,
serverSorting: false
},
height: 550,
filterable: true,
sortable: true,
pageable: {
pageSize: 100,
refresh: true
},

columns: [

{ command: ["edit"], title: " ", width: "100px" },
{ field: "ID", title: "ID", width: "300px" },
{ field: "Name", title: "SubInventory", width: "300px" },
{ field: "Status", title: "Active", width: "75px" },
{ field: "Access", title: "Access", width: "200px" },
{ field: "Address" },
{ field: "Comment", tite: "Comments", width: "250px" },
{ field: "ParentID", title: "ParentName", width: "180px", editor: dropdownforParent}
]
, filterMenuInit: onFilterMenuInitSI,
editable: "popup",
}).data("kendoGrid");

Grid

answered on 27 Aug 2015

1 answer

2.3K+ views

Background color for excel cell on Export

Hello there. So I have a gridwhich I can export to Excel.

When doing the export, I'm having two problems.

This is my function.

function excelExport(e) {

var sheet = e.workbook.sheets[0];

for (var rowIndex = 1; rowIndex < sheet.rows.length; rowIndex++) {

var row = sheet.rows[rowIndex];

for (var colIndex = 0; colIndex < (sheet.columns.length-2); colIndex++) {

if (row.cells[colIndex].value == "Weekend-") {row.cells[colIndex].format = "[Blue];";}

if (row.cells[colIndex].value == "Vacation Day-") { row.cells[colIndex].format = "[Yellow];"; }

if (row.cells[colIndex].value == "Holiday-") { row.cells[colIndex].format = "[Green];"; }

if (row.cells[colIndex].value == "Critical Task-") { row.cells[colIndex].format = "[Red];"; }

}

Problem Num1: Is there any other way to choose other colors?... I only found very few so far like these: Green, Red, Blue and Yellow. If I try colors such as Orange, Light Blue, Purple, which are colors that I really need, it doesn't work. Instead of "[ColorName;"], is there another way.

Problem Num2: With this format I'm only formatting the text itself, but what I really want is, for example, whenever in the cell there is the "CriticalTask-" value, I want the cell background color to be red.

Thanks for the help!

Grid

answered on 27 Aug 2015

5 answers

1.6K+ views

Expand and Collapse in Panel bar div

Hi,

I am trying to do the below demo :

http://demos.telerik.com/aspnet-mvc/sortable/sortable-panels

I am not interested in the panel. All I want is a div which is expandable and collapsible. But i don't see anything working, when i copy all the code as it is. I have tried only the div i want and tried but still it is not working. I don't see k-i-arrowhead-n , I have the latest version. I have all css too.

<div class="panel-wrap">

<div id="main-content">

<div id="news" class="widget">

<h3>News <span class="collapse k-icon k-i-arrowhead-n"></span></h3>

<div>

<h4><span>Jan 22, 2014</span> Stanford Speaker Series Looks at the Rising Tide of Eastern European High Tech Firms with Telerik CEO Vassil Terziev</h4>

<h4><span>Dec 10, 2013</span

> Telerik Test Studio Now Offers Cross-Browser Test Recording and Subscription-Based Pricing for 1M-Strong Developer Community</

h4>

<h4><span>Nov 22, 2013</span> Telerik AD is Named "Best Employer in Bulgaria" for Sixth Consecutive Year</h4>

<h4><span>Nov 20, 2013</span> Telerik Embraces the Responsive Web with Latest Kendo UI Improvements</h4>

</div>

<script>

$(document).ready(function () {

//exapand

$(".panel-wrap").on("click", "span.k-i-arrowhead-s", function (e) {

var contentElement = $(e.target).closest(".widget").find(">div");

$(e.target)

.removeClass("k-i-arrowhead-s")

.addClass("k-i-arrowhead-n");

kendo.fx(contentElement).expand("vertical").stop().play();

});

//collapse

$(".panel-wrap").on("click", "span.k-i-arrowhead-n", function (e) {

var contentElement = $(e.target).closest(".widget").find(">div");

$(e.target)

.removeClass("k-i-arrowhead-n")

.addClass("k-i-arrowhead-s");

kendo.fx(contentElement).expand("vertical").stop().reverse();

});

</script>

Thanks,

Veena

PanelBar

answered on 26 Aug 2015

1 answer

162 views

using GridEditMode.PopUp

Hello,

I use KendoMvcGrid in my webproject, i choose the option "GridEditMode.PopUp" for add and edit features. I search to not display the modification in grid when my popup in display.

Thank you

Grid

answered on 26 Aug 2015

3 answers

158 views

NumericTextBox Select on Focus (Safari 8.0.8)

var input = e.container.find("input");

input.focus(function (e) {

setTimeout(function () {

input.select();

});

The above code snippet allows for selection of all text in the NumericTextBox upon focus in all browsers except the latest version of Safari on Mac OSX Yosemite (Version 10.10.5). Is there an update for this solution? Or is there an alternative solution that works for all browsers?

NumericTextBox

answered on 26 Aug 2015

4 answers

644 views

Custom popup editor problem

Hi,
We use MVC 4 and EF 4.5.
I have grid with " .Editable(e => e.Mode(GridEditMode.PopUp).TemplateName("Company"))".
My EditorTemplate looks like this:

...

<div class="editor-label">

@Html.LabelFor(model => model.CompanyUrl)

</div>

<div class="editor-field">

@Html.DisplayFor(model => model.CompanyUrl)

</div>

<div class="editor-label">

@Html.LabelFor(model => model.FirstName)

</div>

<div class="editor-field">

@Html.EditorFor(model => model.FirstName)

@Html.ValidationMessageFor(model => model.FirstName)

</div>

...

I want the field "CompanyUrl" to be readonly and for that I call "DisplayFor" but when I click for editing DisplayFor shows
nothing.

When I'm using GridEditMode.InLine and m.Field(f => f.CompanyUrl).DefaultValue(string.Empty).Editable(false); everything is OK. I want to use popup because my class has too many fields and default popup editor shows too many unwanted fields.
Am I doing something wrong ?
Thanks

P.S One more thing. I want a field edited with kendo editor to be shown formatted in the grid column, not like now "<p>Some Text</p><p><strong>New Line</strong></p>
". The column is in " .ClientDetailTemplateId("clientCommentsTemplate")"

Grid

answered on 26 Aug 2015

1 answer

844 views

Cannot read property 'uid' of undefined

Hi,

My jobs are loading properly in the scheduler. And creating a job by double clicking on the scheduler and save from the popup is OK. But the problem is when I open the the newly created job and click Cancel button, nothing happens. I checked on the browser console. Error is "Uncaught TypeError: Cannot read property 'uid' of undefined"

In my case, "Job 101", "Job 102", "Job 103", "Job 104" are loading from back end. Suppose, I have just created a new job titled "Job 105" and when I open the job again by double clicking and click on Cancel button, error occurs, "Uncaught TypeError: Cannot read property 'uid' of undefined"

What am I doing wrong here?

@(Html.Kendo().Scheduler<TaskViewModel>()

.Name("schedulerVertical")

.Date(new DateTime(2015, 5, 27))

.StartTime(new DateTime(2015, 5, 27, 7, 00, 00))

.Height(600)

.Views(views =>

{

views.DayView();

views.WeekView();

views.MonthView();

views.TimelineView(t => t.Selected(true));

})

.Timezone("Etc/UTC")

.Group(group => group.Resources("Techs").Orientation(SchedulerGroupOrientation.Vertical))

.Resources(resource =>

{

resource.Add(m => m.TechID)

.Title("Techs")

.Name("Techs")

.DataTextField("TechName")

.DataValueField("TechID")

.DataSource(d => d.Read("Techs", "Scheduler"));

})

.DataSource(d => d

.Model(m =>

{

m.Id(r => r.TaskID);

m.Field(r => r.TechID);

})

.Read("Vertical_Read", "Scheduler")

)

public ActionResult Techs()

{

List<Tech> techs = new List<Tech>

{

new Tech

{

TechName = "Jack",

TechID = 1,

Color = "#6eb3fa"

},

new Tech

{

TechName = "Lochlan",

TechID = 2,

Color = "#f58a8a"

},

new Tech

{

TechName = "Arefin",

TechID = 3,

Color = "#0583fa"

},

new Tech

{

TechName = "Faisal",

TechID = 4,

Color = "#9635a0"

}

};

return Json(techs, JsonRequestBehavior.AllowGet);

}

public ActionResult Vertical_Read([DataSourceRequest] DataSourceRequest request)

{

List<TaskViewModel> tasks = new List<TaskViewModel>

{

new TaskViewModel {

TaskID = 1,

TechID = 2,

Title = "Job 101",

Start = new DateTime(2015, 5, 27, 20, 00, 00),

End = new DateTime(2015, 5, 27, 20, 30, 00),

Description = "Description 101",

IsAllDay = false

},

new TaskViewModel {

TaskID = 2,

TechID = 1,

Title = "Job 102",

Start = new DateTime(2015, 5, 27, 21, 00, 00),

End = new DateTime(2015, 5, 27, 21, 30, 00),

Description = "Description 102",

IsAllDay = false

},

new TaskViewModel {

TaskID = 3,

TechID = 3,

Title = "Job 103",

Start = new DateTime(2015, 5, 27, 20, 00, 00),

End = new DateTime(2015, 5, 27, 20, 30, 00),

Description = "Description 103",

IsAllDay = false

},

new TaskViewModel {

TaskID = 4,

TechID = 4,

Title = "Job 104",

Start = new DateTime(2015, 5, 25, 1, 00, 00),

End = new DateTime(2015, 5, 25, 1, 30, 00),

Description = "Description 104",

IsAllDay = true

}

};

return Json(tasks.ToDataSourceResult(request));

}

Thanks in advance.

Scheduler

answered on 26 Aug 2015

3 answers

808 views

Format DateTimePicker dynamically in kendo.grid

Hi,

Can't figure out how to format a DateTimePicker dynamically in a grid.

Sample:

@(Html.Kendo().Grid<TheViewModel>()

.Name("aGrid")

.ToolBar(toolbar => toolbar.Create())

.Columns(c =>

{

c.Bound(e => e.ID);

c.Bound(e => e.Decimal).Format("{0:n5}");

c.Bound(e => e.Stamp);

c.Command(command => { command.Edit(); });

})

.Selectable(p => p.Mode(GridSelectionMode.Single))

.Editable(editable => editable.Mode(GridEditMode.InLine))

.DataSource(dataSource => dataSource

.Ajax()

.ServerOperation(true)

.Model(model => model.Id(e => e.ID))

.Create(create => create.Action("create", "Home"))

.Read(read => read.Action("read", "Home"))

.Update(update => update.Action("update", "Home"))

)

What I would like to do is something similar to this:

c.Bound(e => e.Stamp).Format("{0:#=kendo.culture().calendar.patterns.d#}");

Thanks

General Discussions

answered on 26 Aug 2015

3 answers

820 views

Telerik Reporting - MVC5

HI

Is there have a learning video forTelerik Reporting + MVC 5 (MVC 5, not MVC 4) like this :

Using Telerik Reporting in ASP.NET MVC 4 projects
https://www.youtube.com/watch?v=U2ZC9W9FYS0fs

The content of this old video is not works for MVC 5 (View Engine options for ASPX/Razor was removed).

Best regards

Chris

General Discussions

answered on 26 Aug 2015

0 answers

138 views

Add row using popup in Grid

I need to provide a Button like 'Add new record' on Grid. On Click of that Button I need to display a Popup with displays rows from database in Grid. On selection of any row from Popup Grid I need to add that row to the Main Grid.

Please suggest me.

Grid

asked on 26 Aug 2015