Questions on UI for ASP.NET MVC Forum

2 answers

131 views

How to get Slider ID in event function

For example, if I have a change event as below

function sliderChange(e)
{
var msg = "View is changed to " + e.value;
$("#e.ID").html(msg);
}

How can I get slider ID then I can change some control related to this ID?

Thanks

Slider

answered on 07 Mar 2016

1 answer

309 views

how to trigger a grid event?

I have two grids, A and B, in one page. After modifying data on A grid, I like to trigger changes in B grid and save it to the server. Is there method I can call through JavaScript to save grid B?

thanks

Grid

answered on 07 Mar 2016

3 answers

1.4K+ views

Row style based on content

I've been working on change the class added to a table row of the grid based on the value of a specific cell. For some reason however my code doesn't actually seem to do anything. There are no errors it just doesn't apply a class to the row cell and I don't know why. Can someone do a sanity check for me and make sure I have the code correctly structured please.

The Grid

@(Html.Kendo().Grid<Spoton_Areas_Test.ViewModels.VesselsViewModel>()

.Name("Grid")

.Columns(columns => {

columns.Bound(c => c.fixture_work)

.Title("Work");

columns.Bound(c => c.vessel_status)

.Title("Status");

})

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

.Pageable()

.Events(e=>e.DataBound("OnDataBound"))

.DataSource(dataSource => dataSource

.Ajax()

.Sort(sort =>

{

sort.Add(

company => company.owner_company).Ascending();

})

.PageSize(40)

.Model(model =>

{

model.Id(p => p.vessel_idx);

})

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

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

))

My Javascript

function onDataBound(e) {

var kendoGrid = $("#Grid").data("kendoGrid");

var rows = e.sender.element.find("tbody tr");

for (var i = 0; i < rows.length; i++) {

var row = rows[i];

var status = kendoGrid.dataItem(row).vessel_status;

if (status = "PPT") {

$(row.cells[3]).addClass("customRed");

}

Not sure what's wrong but any help is appreciated

Grid

answered on 07 Mar 2016

5 answers

318 views

Grid Aggregates in Batch Mode

I have a grouped Grid in batch mode. My aggregates aren't refreshing as edits are made to the aggregated data until after a .saveChanges is performed. I want the aggregate to update as soon as the focus leaves a cell that is aggregated.

My Columns look like this:

    columns.Bound(c => c.Period1)
       .HeaderTemplate("<a>" + @title1 + "<br>" + @title2 + "</a>")
       //.ClientGroupHeaderTemplate("#= sum #")
       .ClientGroupFooterTemplate("#= sum #")
       .ClientFooterTemplate("#= sum #")
       .Filterable(false)
       .Width(100);

My Datasource is configured as such:

    .DataSource(dataSource => dataSource
    .Ajax()
    .AutoSync(false)
    .Aggregates(aggregates =>

    {
       if (Model.Count() > 0) { aggregates.Add(p => p.Period1).Sum(); }
       //more aggregate properties here

})
.Batch(true)
.ServerOperation(false)
.Events(events => events.Error("error_handler"))
.Group(groups => groups.Add(p => p.ProjectType))
.Model(model =>
{
model.Id(prop => prop.ID);

//other model properties here

})
.Create(create => create.Action("CreateManpowerProjectEstimates", "Manpower"))
.Read(read => read.Action("ReadManpowerProjectEstimates", "Manpower"))
.Update(edit => edit.Action("UpdateManpowerProjectEstimates", "Manpower"))
.Destroy(delete => delete.Action("DestroyManpowerProjectEstimates", "Manpower"))
.PageSize(20)
)

Grid

answered on 07 Mar 2016

3 answers

2.2K+ views

How to get checked/Unchecked Nodes and its children in kendo Treeview

Hi,

Could anybody suggest me to get checked/Unchecked nodes and its children in Kendo Treeview.

Thanks,
Srikanth

TreeView

answered on 07 Mar 2016

1 answer

299 views

Grid -> Column -> Form Post

I am attempting to post to an action in the controller from a custom button in the Grid component. At first the Grid would render the form outside of the column, this was fixed by {}.Render() which appears to generate the form in the correct location.

My problem is that the items being passed to the form are always null, regardles:

I'll simply my example:

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

.Name("IterationGrid")

.Sortable()

.Columns(columns =>

{

columns.Tempate(@<text>

using (Html.BeginForm("RemindEmployee", "Evaluations", FormMethod.Post))

{

Html.Hidden("employeeID", item.Employee.EmployeeID);

Html.Hidden("reviewID", item.ReviewId);

Html.Hidden("fullname", item.Employee.Fullname);

<input type="submit" name="Remind" value="Remind" class="btn btn-primary btn-k-grid" />

}@</text>).Title("Action"); }).Render(); }

As I mentioned this appears to work fine, and the Controller has:

[HttpPost]

public ActionResult RemindEmployee(int? employeeID, int? reviewID, string fullname) { }

Though the parameters are always passed as null. What's the best way to handle this example here?

Note: I've already used some javascript $.post() to do the same thing, but I would like to know the proper way to get the above to work with hidden forms for my own benefit.

Grid

answered on 07 Mar 2016

1 answer

98 views

Error with popup open and without annotation

Hi,

It’s posible not close grid popup if I have added in modelstate an error on créate or update method of controller.

public ActionResult DirectInCreate([DataSourceRequest]DataSourceRequest request, DirectInViewModel service)

{

if (ModelState.IsValid)

{

if (service.OrigenID == 0)

{

string errorMessage = string.Format("El camp Productor es obligatori.");

ModelState.AddModelError("", errorMessage);

}

Else

function onError(e, gridName) {

if (e.errors) {

var message = "Errors:\n";

$.each(e.errors, function (key, value) {

if ('errors' in value) {

$.each(value.errors, function () {

message += this + "\n";

});

}

});

var grid = $("#" + gridName).data("kendoGrid");

grid.one("dataBinding", function (e) {

e.preventDefault();

})

alert(message);

grid.cancelChanges();

}

Thanks in advance.

Xavier de la Rubia.

Grid

answered on 04 Mar 2016

5 answers

161 views

Chart - Local Data Error

Hello,

I have a donut chart that uses local data and I'm getting an error on my series of:

Cannot convert lambda expression to type 'System.Collections.IEnumerable' because it is not a delegate type

The chart is being used in a partial view. Here is my source code.

Partial View

@model IEnumerable<MyProject.ViewModels.UtilisationViewModel>

<div class="row">

<div class="col-md-6">

<div class="demo-section k-content wide">

@(Html.Kendo().Chart(Model)

.Name("chart")

.Title("Utilisation")

.Legend(legend => legend

.Position(ChartLegendPosition.Bottom))

.Series(series =>

{

series.Donut(

model => model.ahts

);

})

)

</div>

The ViewModel

using System;

using System.Collections.Generic;

using System.ComponentModel.DataAnnotations;

using System.Linq;

using System.Data.Entity;

using System.Web;

using Spoton_Areas_Test.Models;

namespace MyProject.ViewModels

{

    public class UtilisationViewModel

    {

        public int idx_index { get; set; }

        public Nullable<System.DateTime> applies_date { get; set; }

        public Nullable<decimal> ahts { get; set; }

        public Nullable<decimal> psv { get; set; }

        public Nullable<int> region_idx { get; set; }

        public string region_name { get; set; }

    }

}

Can anyone point me in the direction of what is going wrong?

Many thanks

Chart

answered on 04 Mar 2016

5 answers

550 views

Telerik overriding htmlattributes?

I have an existing .NET MVC app where I upgraded it to a Telerik MVC app, and I'm noticing my controls htmlattributes are being overridden it seems.

In my view I have controls like this:

@Html.EditorFor(model => model.CompanyName, new {htmlAttributes = new {@class = "form-control", required = "true"}})

which would previously render like:

Now with Telerik, they render like this:

You can see I'm losing my form-control, etc classes, and the required attribute. What is overriding this and how should I handle this?

General Discussions

answered on 04 Mar 2016

2 answers

128 views

Delete issue in grid with subgrids

Hi,

I have a grid with subgrids on page. And I had to make custom delete button which shows delete dialog window (default kendo behaviour - show alert, not acceptable in my app).
But when someone press delete-button in subgrid, it invokes click on delete button in main grid (via injected.js, I understood that in debug proccess in chrome). I dont need that behaviour. How to prevent click on delete button in main grid?

Provide part of code here, and all code of this page in Attachment

Code :

//Main grid

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

.Name("TerminalsGrid")

.Columns(c =>

{

c.Bound(x => x.Brand.Name)

c.Bound(x => x.TerminalModel.Name)

c.Bound(x => x.SerialNumber)

c.Bound(x => x.CommissioningDate)

c.Bound(x => x.CurrentAZS)

c.Command(command => command.Edit()

.HtmlAttributes(new { style = "text-align: center;" })

.Width(131);

c.Command(command => command.Custom("Delete")

.Text("<span class='k-icon k-delete'></span>Удалить")

.Click("prepareToDelete"))

.HtmlAttributes(new { style = "text-align: center;" });

})

.Events(x => x

.Save("onSaveDisableUpdateButton")

.DataBound("onDataBoundHideControlButtons"))

.DataSource(ds => ds

.Ajax()

.Events(e => e

.Error("onErrorInCatalogs"))

.Model(m =>

{

m.Id(x => x.Id);

m.Field(x => x.Brand).DefaultValue(new ListItemIntViewModel { Name = "" });

m.Field(x => x.TerminalModel).DefaultValue(new ListItemIntViewModel { Name = "" });

m.Field(x => x.Organization).DefaultValue(new ListItemViewModel { Name = "" });

m.Field(x => x.Contractor).DefaultValue(new ListItemViewModel { Name = "" });

})

.Read(r => r.Action("JsonRead", "Terminals"))

.Create(c => c.Action("JsonCreate", "Terminals"))

.Update(u => u.Action("JsonUpdate", "Terminals"))

)

.Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("EditTerminal")

.Window(x => x.Width(550).Title("Данные терминала")))

.ToolBar(t => t.Create())

.Sortable(s => s.AllowUnsort(true))

.Filterable(ftb => ftb.Mode(GridFilterMode.Row))

.ClientDetailTemplateId("template")

.Scrollable(scroll => scroll.Height("auto"))

.Pageable()

.Events(events => events

.DetailExpand("detailExpand")

.DetailCollapse("detailCollapse"))

)

// Helper for Delete Window

@Html.DeleteModal()

//Subgrid

@helper StateChanges()

{

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

.Name("grid_state_changes_#=Id#")

.Columns(columns =>

{

columns.Bound(col => col.TerminalState.Name)

.EditorTemplateName("EditTerminalState");

columns.Bound(col => col.StartTime)

.EditorTemplateName("DateTimeEditor");

columns.Bound(col => col.EndTime)

.EditorTemplateName("DateTimeNullableEditor");

columns.Command(c => c.Edit())

.HtmlAttributes(new { style = "text-align: center;" });

columns.Command(command => command.Custom("Delete")

.Text("<span class='k-icon k-delete'></span>Удалить")

.Click("prepareToDeleteInSubgrid"))

.HtmlAttributes(new { style = "text-align: center;" });

})

.Sortable()

.Events(x => x

.Save("onSaveDisableUpdateButton")

.DataBound("onDataBoundHideControlButtons"))

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

.ToolBar(toolbar => { toolbar.Create(); })

.DataSource(data => data

.Ajax()

.Sort(sort => sort.Add("StartTime").Descending())

.Events(events =>

{

events.Error("onErrorInSubgrid.bind({ WidgetID: 'grid_state_changes_#=Id#'})");

events.Sync("onSubgridSync.bind({ WidgetID: 'grid_state_changes_#=Id#'})");

})

.Model(model =>

{

model.Id(m => m.Id);

model.Field(x => x.TerminalState).DefaultValue(new ListItemIntViewModel());

model.Field(x => x.StartTime).DefaultValue(DateTime.Now);

})

.Create(update => update.Action("StateChangesCreate", "Terminals", new { terminalId = "#= Id #" }))

.Read(read => read.Action("StateChangesRead", "Terminals", new { terminalId = "#= Id #" }))

.Update(update => update.Action("StateChangesUpdate", "Terminals"))

)

.Pageable(pager => pager.Refresh(true))

.ToClientTemplate()

)

}


<script>
function prepareToDeleteInSubgrid(e) {
        e.preventDefault();
        var gridId = this.element[0].id;
        if (gridId.indexOf("state_changes") > 0) {
            deleteUrl = deleteStateChangeUrl;
        }
        else if (gridId.indexOf("fuel_station_changes") > 0) {
            deleteUrl = deleteFuelStationChangeUrl;
        }
        else return;
        showDelete(e, this);
    }
    function prepareToDelete(e) {
        var gridId = this.element[0].id;
        deleteUrl = deleteTerminalUrl;
        showDelete(e, this);
    }


function showDelete(e, gridWidget) {
    if (gridWidget == undefined) {
        gridWidget = this;
    }
    var target = $('#deleteModal');
    var id = gridWidget.dataItem($(e.currentTarget).closest("tr")).id;
    gridname = '#' + gridWidget.element[0].id;
    target.find('#entryId').val(id);
    $('#PopupDeleteExceptionSection').css("display", "none");
    target.modal();
}


</script>

Grid

answered on 04 Mar 2016