Telerik Forums
UI for ASP.NET MVC Forum
3 answers
624 views

I have inline grid, I want to edit one field if the model.ebs is true or edit another field if the model.ebs is false.

 

@(Html.Kendo().Grid<ViewModels.Payment.ProviderServiceRRViewModel>()
.Name("PRRServiceGrid")
.Columns(columns =>
{
    columns.Bound(p => p.Id).Hidden(true);
    columns.Bound(p => p.IsEbsOnly).Hidden(true);
    columns.Bound(p => p.ServiceName);
    columns.Bound(p => p.Units);
    columns.Bound(p => p.ReduceUnits);
    columns.Bound(p => p.ReimbursementAmount).Format("{0:c}");
    columns.Command(command =>
    {
        command.Edit().HtmlAttributes(new { @class = "btn-primary k-grid-edit" });   
})
.Pageable(pageable => pageable.Refresh(true).PageSizes(true).ButtonCount(5))
.Sortable()   
.Selectable()
.Events(e => e.Edit("onPRRServiceGridEdit"))
.Resizable(resize => resize.Columns(true))
.DataSource(dataSource => dataSource.Ajax().ServerOperation(false).PageSize(5).Read(read => read.Action("PrrServiceGridRead", "ReimbursementRequest", new { prrId = @Html.Raw(Json.Encode(Model.PrrId)), serviceType = @Html.Raw(Json.Encode(Model.ServiceType)) }))
.Model(model =>
{
    model.Id(p => p.Id); model.Field(p => p.Id).Editable(false);
    model.Field(p => p.ServiceName).Editable(false); //I did not make Units, reduce units column editable false
    model.Field(p => p.ReimbursementAmount).Editable(false);
})
.Update(update => update.Action("Update_PrrServiceGrid", "ReimbursementRequest"))
))
 
 
function onPRRServiceGridEdit(e) {
 
    var isEbsOnly = e.model.IsEbsOnly;
    
        if(isEbsOnly) //I made it disable but I want to close the cell. I dont want to make it editable if the value is true            
            $(e.container).find('input[name="ReduceUnits"]').attr("disabled", true);
         
         else
            $(e.container).find('input[name="Units"]').attr("disabled", true);
  
}

Rosen
Telerik team
 answered on 26 Apr 2016
2 answers
401 views

Is there a way to add a new sheet to the e.workbook.sheets[] array in my ExcelExport() grid event function?  I'm trying to create an Excel export that has two sheets.  One sheet will be formatted just as the grid displays.  The other sheet will require some custom code to format the sheet as desired.

 

Thanks!

Matthew
Top achievements
Rank 1
 answered on 26 Apr 2016
3 answers
297 views

I am not sure if this is by design but when i click on button that exports to excel when the grid has no data, it invokes the ajax read call first and then export the result in excel. If the grid already has the result, it seems like it doesn't call the read function and it exports the result right away. 

In the following code, 'GetPurchaseOrders' gets invoked whenever excel button is clicked whenever excel to export button is clicked. 

Any idea why this is happening?

Thanks.

@(Html.Kendo().Grid<SupplierPortal.ViewModels.PoViewModel>()
            .Name("GridPOSearchHeaderInfo")
            .Columns(columns =>
            {
                columns.Bound(e => e.Revision).Width("120px").HtmlAttributes(new { @style = "text-align:right;" });
                columns.Bound(e => e.SupplierNumber).Width("170px").HtmlAttributes(new { @style = "text-align:right;" });
                columns.Bound(e => e.SupplierName).Width("160px");
            })
             .Excel(excel => excel
             .FileName("PurchaseOrders.xlsx")
             .ProxyURL(Url.Action("Excel_Export_Save", "Supplier"))
             .AllPages(true)
            )
            .ToolBar(tools =>
            {
            tools.Template(@<text>
                <div class="col-lg-1 col-md-2 col-sm-2 col-xs-4 pull-right" style="padding-left: 0; margin-top: 2px; text-align: right;">
                    @Html.ActionLink(" ", "SaveView", "PurchaseOrder", null, new { @class = "modal-link k-button POcolumn", @style = "padding-left: 10px;", @title = "Customize Grid" })
                    <a class="k-button k-button-icontext k-grid-excel POexport" href="#" style="padding-left: 10px;" title="Export to Excel"><span class="k-icon k-i-excel"></span></a>
                </div>               
                </text>);
            })
            .Pageable(x => x.PageSizes(new int[] { 10, 20, 50, 100 }).ButtonCount(4))
            .Reorderable(reorder => reorder.Columns(true))
            .AutoBind(false)
            .Sortable(sortable => sortable
                .AllowUnsort(true)
                .SortMode(GridSortMode.MultipleColumn))
            .Selectable()
            .ColumnMenu()
            .Scrollable(scr => scr.Height(322))
            .Filterable(filterable => filterable
              .Extra(false)
              .Operators(operators => operators
              .ForString(str => str.Clear()
                        .Contains("Contains")
                        .StartsWith("Starts with")
                        .IsEqualTo("Is equal to")
                        .IsNotEqualTo("Is not equal to")
                       ))
                      )
               .Resizable(resize => resize.Columns(true))
               .DataSource(dataSource => dataSource
                                        .Ajax()
                                        .PageSize(10)
                                        .Read(read => read.Action("GetPurchaseOrders", "PurchaseOrder").Data("GetSearchParameters"))
                                        .ServerOperation(false)
                          )
                .Events(events => events.DataBound("gridDataBound"))
                .Events(events => events.DataBinding("gridDataBinding"))
            )

Dimiter Madjarov
Telerik team
 answered on 26 Apr 2016
1 answer
858 views

I am adding selected row of a grid to another . My issue is my Grid has a combo box which is being initialized for first row only. Detail is in following link.

 

http://stackoverflow.com/questions/36793242/initialize-combobox-for-each-row-of-telerik-mvc-grid

Ianko
Telerik team
 answered on 26 Apr 2016
7 answers
121 views
I can not input chinese words, and I don't know how to support chinese.
Yilang
Top achievements
Rank 1
 answered on 26 Apr 2016
3 answers
259 views

Hi -

I am using .Net MVC and have a custom editor template for the scheduler with a new textbox for MasterCatalogID.  The value gets set via javascript from button.  When I try to save the session, in the Controller method, I do not see the value for MasterCatalogID.

However, if I manually type in the value, I can get it in the Controller method.

Is there something else I need to add to retrieve the value?

 

<div class="k-edit-label">
    @(Html.LabelFor( model => model.MasterCatalogID, "Course" ))
</div>
<div data-container-for="MasterCatalogID" class="k-edit-field input-group">
    @(Html.TextBoxFor( model => model.MasterCatalogID, new { @class = "k-textbox" } ))
</div>

Joe
Top achievements
Rank 1
 answered on 25 Apr 2016
2 answers
286 views

I have two grid views that performs pop up custom template editing, grid two is placed under tabstrip, please refer to following code:

        @(Html.Kendo().TabStrip()
                .Name("tabstrip")
                .Animation(animation => 
                    animation.Open(effect => 
                        effect.Fade(FadeDirection.In)))
                .Items(tabstrip =>
                {
                    tabstrip.Add().Text("Details")
                        .Selected(true)      
                        .LoadContentFrom(@Url.Action("Index", "AppGroup", new { AppID = ViewBag.AppID, AppName = ViewBag.AppName }).ToString());
                })
            )

If i change LoadContentFrom to Content, all functions working fine. However, i need to use LoadContentFrom due to heavy content load. once i change it back to LoadContentFrom, when i try to edit grid one, the following error is thrown.

VM37552:50 Uncaught TypeError: Cannot read property 'editRow' of undefined

 

I have investigated further and found out it is becaues of #grid.data("kendoGrid") is undefined and hence it breaks $("#Group").data("kendoGrid").editRow($(this)).

 

Thanks.

lucerias
Top achievements
Rank 1
 answered on 25 Apr 2016
1 answer
205 views

Hi

I'm very new to ASP.NET MVC and need some advice!

I have built a small  Telerik UI for ASP.NET MVC project using the project type: Telerik C# ASP.NET MVC Application project in Visual Studio 2010.

My aim is to build an app with the Scheduler widget and I need to see how this renders on mobile devices. I am able to see the project running in a browser on the development machine through the debug option in visual studio. However I need to test it on other devices.

Can any one please point me to documentation/ tutorials on how I can deploy the application to a server?

Thanks

Nik

Maria Ilieva
Telerik team
 answered on 25 Apr 2016
9 answers
1.5K+ views

I have a kendo grid where user can select list of columns from grid and save the selection by giving name (i.e view name). Each saved selection (view name) will show up as drop-down above grid so that user can change grid columns whenever they want. In current implementation, whenever user selects view name from one drop-down value to other, im calling action method to select that view name as current view name. Then page reloads to invoke Index' action method to retrieve current view names columns values. I am using visible attribute in grid to show and hide columns in grid.
Now i was wondering if i can update the grid columns without reloading the page when user change the view name from the dropdown. I know kendo has ColumnMenu which helps to choose and hide columns without reloading the page, however i couldn't figure out a way to save/reload user selection done in Columns section. 

It would be nice if the user could hide/show columns using 'ColumnMenu' and also be able to save the state in view  name and show the view name in the dropdown. I saw this example http://demos.telerik.com/kendo-ui/grid/persist-state to persist the state of the grid however as there is limitation with not being able to save toolbar information, i couldn't use this solution.

Any suggestion how i can resolve this issue?

ViewModel:

namespace MvcApplicatioin.Models
{
    public class EmployeeViewModel
    {
        public EmployeeColumns EmployeeColumns               { get; set; }
        public IEnumerable<SelectListItem> EmployeeViewNames { get; set; }
        public long EmployeeSelectedViewId                   { get; set; }
    }
 
    public class EmployeeResponse
    {
        public int Id           { get; set; }
        public string FirstName { get; set; }
        public string LastName  { get; set; }
    }
 
    public class EmployeeColumns
    {
        public bool Id        { get; set; }
        public bool FirstName { get; set; }
        public bool LastName  { get; set; }
    }
}

Controller:

public class EmployeeController : Controller
{
        // GET: Employee
        public ActionResult Index()
        {
            var service = new EmployeeService();
            EmployeeViewModel model = new EmployeeViewModel();
            long currentViewId;
 
            //setup views and column preferences
            EmployeeColumns employeeColumns = service.GetCurrentEmployeeColumnsPreferences();
            model.EmployeeColumns = employeeColumns;
            model.EmployeeViewNames = service.GetAllEmployeeViewNames(out currentViewId);
            model.EmployeeSelectedViewId = currentViewId;
 
            return View(model);
        }
 }

View:

@using Kendo.Mvc.UI
 
@{
    ViewBag.Title = "Employee Info:";
}
 
<h3 style="margin-bottom: 10px;">Employee Info</h3>
 
<input id="btnSearch" type="button" value="Search" class="btn_Search" />
 
<div class="row">
    <div class="col-sm-12">
        @(Html.Kendo().Grid<MvcApplicatioin.Models.EmployeeResponse>()
            .Name("GridEmployee")
            .Columns(columns =>
            {
                columns.Bound(e => e.Id).Width("170px").Visible(Model.EmployeeColumns.Id);
                columns.Bound(e => e.FirstName).Width("190px").Visible(Model.EmployeeColumns.FirstName);
                columns.Bound(e => e.LastName).Width("170px").Visible(Model.EmployeeColumns.LastName);               
            })
            .ToolBar(tools =>
            {
                tools.Template(@<text>
                    <div class="col-lg-4 col-md-5 col-sm-5 col-xs-7 pull-right" style="padding-right: 0;">
                        <div class="form-group" style="margin-bottom: 0;">
                            @Html.Label("Grid View:", new { @class = "col-sm-3 col-xs-4 control-label view" })
                            <div class="col-sm-7 col-xs-6" style="padding-left: 0;">
                                @Html.DropDownList("lstEmployeeViewNames", new SelectList(Model.EmployeeViewNames, "Value", "Text", Model.EmployeeSelectedViewId), "- Select View Name -", new { @class = "form-control", @style = "height: auto;" })
                            </div>
                        </div>
                    </div>
                </text>);
            })
            .Pageable(x => x.PageSizes(new int[] { 10, 20, 50, 100 }).ButtonCount(4))
            .AutoBind(false)
            .DataSource(dataSource => dataSource
                        .Ajax()
                        .PageSize(10)
                        .ServerOperation(false)
                        .Read(read => read.Action("SearchEmployee", "Employee")))
        )
    </div>
</div><!--//row-->
 
<script type="text/javascript">
    $('#btnSearch').click(function (e) {
        e.preventDefault(); //This prevent the submit button onclick from submitting by itself
 
        $('#GridEmployee').data('kendoGrid').dataSource.read();
    });
 
    //Change event for Dropdown placed inside the Grid's Toolbar - To Change the view
    $("#lstEmployeeViewNames").change(function (e) {
        var selectedViewId = $('select#lstEmployeeViewNames option:selected').val();
 
        if (selectedViewId == null || selectedViewId == '') {
            alert("Please select the view name from the dropdown first !!");
            return;
        }
 
        $.post("/Employee/SetEmployeeColumnsCurrentPreferences", { viewId: selectedViewId }, function (data) {
            window.top.location.reload();
        });
    });
</script>

 

 

Vasil
Telerik team
 answered on 25 Apr 2016
1 answer
219 views

I have 2 grids that work correcly, but one of the parameters used to get the data of the child grid is a date with a format that varies when using different web browsers.

When the controller action recieves the date, the string has different values according to the browser used. For example:

-IE: "Mon Oct 17 00:00:00 UTC-0300 2016"
-Chrome: "Mon Oct 17 2016 00:00:00 GMT-0300 (Hora estándar de Argentina)"
-Firefox: "Mon Oct 17 2016 00:00:00 GMT-0300"

I'd like to know if I can format the date before sending it to the controller.

This are my grids:

PARENT GRID:
@(Html.Kendo().Grid(Model)
        .Name("ParentGrid")
        .DataSource(dataSource => dataSource
        .Ajax()
            .Read(read => read.Action("Read", "controller")
            .Data("ParameterFunction"))
        .PageSize(30)
        )
        .Columns(columns =>
        {
            columns.Bound(foo => foo.fecha_venc).Title(Global.Fecha).Format("{0:dd/MM/yyyy}"); //This is the date I need formatted
            columns.Bound(foo => foo.espe_codigo).Title(Global.Especie);
            columns.Bound(foo => foo.clas_codigo).Title(Global.Clase);
           
        })
        .ClientDetailTemplateId("template")
    )

 

CHILD GRID:
@(Html.Kendo().Grid<SGMTrade.DAL.ViewModels.OperacionesOCTPorFecha>()
        .Name("ChildGrid")
        .DataSource(dataSource => dataSource
            .Ajax()
            .PageSize(10)
            .Read(read => read.Action("childGrid_Read", "controller", new { fecha = "#=fecha_venc#", especie = "#=espe_codigo#", cliente = @ViewBag.cliente, clase = "#=clas_codigo#" }))
        )
        .Columns(columns =>
        {
            columns.Bound(o => o.oper_numero).Title(Global.NumeroOperacion)
            .ClientTemplate("<a href='\\\\\\#' onclick=\"showDetails('\\#=oper_numero\\#')\">\\#=oper_numero\\#</a>");
            columns.Bound(o => o.oper_forigen).Title(Global.FechaOrigen).Format("{0:dd/MM/yyyy}");
            columns.Bound(o => o.espe_codigo).Title(Global.Especie);
            columns.Bound(o => o.clas_codigo).Title(Global.Clase);
        })
        .ToClientTemplate()
    )

 

CONTROLLER ACTION:

public ActionResult childGrid_Read([DataSourceRequest]DataSourceRequest request, string fecha, string especie, string cliente, string clase)
        {
            //the string fecha comes with the wrong formatting, and I need it to come as dd/MM/yyyy
        }

 

Thank you very much

Maria Ilieva
Telerik team
 answered on 25 Apr 2016
Narrow your results
Selected tags
Tags
+? more
Top users last month
Anislav
Top achievements
Rank 6
Silver
Bronze
Bronze
Jianxian
Top achievements
Rank 1
Iron
Marco
Top achievements
Rank 3
Iron
Iron
Iron
Jim
Top achievements
Rank 2
Iron
Iron
Nurik
Top achievements
Rank 2
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Anislav
Top achievements
Rank 6
Silver
Bronze
Bronze
Jianxian
Top achievements
Rank 1
Iron
Marco
Top achievements
Rank 3
Iron
Iron
Iron
Jim
Top achievements
Rank 2
Iron
Iron
Nurik
Top achievements
Rank 2
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?