Telerik Forums
UI for ASP.NET Core Forum
3 answers
128 views

Hello,

when i user colorField and user group in DataSource the color result is different  like image i attached

you can see here

https://dojo.telerik.com/aBOWINak

    group: {
                field: "symbol"
            },


            sort: {
                field: "date",
                dir: "asc"
            },

            schema: {
                model: {
                    fields: {
                        date: {
                            type: "date"
                        }
                    }
                }
            }
        });

        function createChart() {
            $("#chart").kendoChart({
                title: { text: "Stock Prices" },
                dataSource: stocksDataSource,
                series: [{
                    type: "column",
                    field: "close",
                    categoryField: "date",
                    name: "#= group.value # (close)",
                    colorField:"color"
                }],
                legend: {
                    position: "bottom"
                },

 

Amr
Top achievements
Rank 1
 answered on 08 Jun 2020
1 answer
382 views

     Hi

I am looking at the scheduler: https://demos.telerik.com/aspnet-core/scheduler/index and I am wondering when you double click in a day box (on the month view) a "event" dialog comes up. 

How does the start/end get populated. I understand if I click June 3rd box it will populate it with that date. I am guessing it is using the "DateTimePicker" but I am not sure how the correlation works.

I am after not having the "all day" even being checked and I would like to set a default time to the picker.

 

 

 

Ivan Danchev
Telerik team
 answered on 08 Jun 2020
1 answer
316 views

Hi all,

I don't know how to use template with the popup edit mode and the tag helpers.

I did not found any help in the documentation.

Is it possible ?

<kendo-grid>

    <editable mode="popup" template="???" />

</kendo-grid>

Veselin Tsvetanov
Telerik team
 answered on 08 Jun 2020
2 answers
2.1K+ views

Hi All,

 

I Have a page with  two different grids. A Parent grid and a child grid. Through JS i use the change event of the grid to refresh the datasource of the second grid (to view the child entries). I only want one row at a time to be selected. First i used the single selection mode, but i was not able to clear the selection bu clicking somewhere else in (whitespace of the the grid) or on that row again. SO i moved to checkbox selection. THis works like a charm (also un-selecting), but it allows for multiple rows to be selected. Is there any way (built in or (js) hack) to do this?

 

My grid:

                @(Html.Kendo().Grid<PortSupervisor.ViewModels.Worklist.BookingsViewModel>()
        .Name("Bookingsgrid")
        .Sortable()
        .Editable(editable => editable.Mode(GridEditMode.PopUp).TemplateName("BookingsEditor").Window(w=>w.Title("Insert/edit booking")))
        .Scrollable()
        .Selectable(s=>s.Mode(GridSelectionMode.Single))
        .Events(events =>
        {
            events.Change("onBookingsgridChange");
            events.Save("onSave");
        })
        .ToolBar(x =>
        {
            x.Create().Text("Add new Booking");
        })
        .Columns(columns =>
        {
            columns.Select().Width("2rem").ClientHeaderTemplate(" ");
            columns.Bound(c => c.ContainerNumber);
            columns.Bound(c => c.BookingReferenceOperator).Title("Ref. Operator");
            columns.Command(column =>
            {
                column
                    .Edit()
                    .Text(" ")
                    .IconClass("fa fa-edit")
                    .UpdateText("Save")
                    .UpdateIconClass(" ")
                    .CancelText("Cancel")
                    .CancelIconClass(" ")
                    .HtmlAttributes(new { data_tippy_content = "Edit" });
                column.Destroy().IconClass("fa fa-trash").Text(" ").HtmlAttributes(new { data_tippy_content = "Delete" });
            });
        })
        .DataSource(ds => ds.Ajax()
            .Events(events => events.Error("function(args){telerikGridErrorhandler(args,'Bookingsgrid');}"))
            .Read(r => r.Url("/Worklist/Journey/Bookingsgrid?handler=Read").Data("JourneyIdTokenAndVars"))
            .Update(u => u.Url("/Worklist/Journey/Bookingsgrid?handler=Update").Data("JourneyIdTokenAndVars"))
            .Create(c => c.Url("/Worklist/Journey/Bookingsgrid?handler=Create").Data("JourneyIdTokenAndVars"))
            .Destroy(d => d.Url("/Worklist/Journey/Bookingsgrid?handler=Destroy").Data("JourneyIdTokenAndVars"))
            .Model(m => {
                m.Id(field => field.BookingId);
                m.Field(field => field.BookingId).Editable(false);
            })
            .PageSize(5)
        )
        .Pageable()
        .Height("29rem")
    )

Alexander
Top achievements
Rank 1
Veteran
Iron
 answered on 08 Jun 2020
2 answers
442 views

Hi,

We are building grids for client using only tag helper.

I am trying to apply this solution showing only icon for commands buttons

https://docs.telerik.com/kendo-ui/knowledge-base/grid-icon-only-buttons

 

  <column  width="200">
                        <commands>
                            <column-command text=" " name="edit"></column-command>
                            <column-command text=" " name="destroy"></column-command>
                        </commands>
                    </column>
                </columns>

 

I tried to find the correct syntax taghelper without success

 

Yannick
Top achievements
Rank 1
Veteran
 answered on 05 Jun 2020
1 answer
339 views

Hello,

I am using kendo grid in ASP.net core. I have a grid on a view and as long as I don't scroll horizontally I can resize the columns.  Once I move the horizontal scrollbar just a little the resize handle moves also.  Instead of finding it on the line between the columns it is found over in the column header area.  Any idea what I am missing here? I did a search on the forum and I found it was a bug on old version but mine is update to last version.

<div class="row">
    <div class="col col-md-offset-11 mt-3 suite-projects-grid" data-archive-mode="false">
        @(Html.Kendo().Grid<Models.WebProject>
            ()
            .Name("suite-projects-grid")
            .Columns(columns =>
            {
                columns.Bound(p => p.name)
                        .ClientTemplate("# if (name != null) { #<a href='../project/#=name#/#=_id#'>#=name#</a># } else { #" + "" + "# } #")
                        .Title(Localizer.Text("Project Name")).Filterable(true);
                columns.Bound(p => p.created_date).Title("Created date").Format("{0: dd/MM/yyyy}").Filterable(false).Width(200);
                columns.Bound(p => p.model_count).Title("Revit File(s)").Width(120).Filterable(false).Sortable(false);
                columns.Bound(p => p.job_count).Title("Work Order(s)").Width(100).Filterable(false).Sortable(false);
                columns.Bound(p => p.panel_count).Title("Panel(s)").Width(100).Filterable(false).Sortable(false);
                //columns.Command(command => command.Custom("menu").Template("<i class='fas fa-bars'></i>").Click("showDetails")).Width(100);
                columns.Bound(p => p.archived)
                        .ClientTemplate("# if (!archived) { #<button class='btn btn-default' title='Archive Project'><i class='fas fa-file-archive'></i></button># } else { #<button class='btn btn-default' title='UnArchive Project'><i class='far fa-file-archive'></i></button># } #")
                        .HtmlAttributes(new { @class = "k-grid-archiveProject text-center" })
                        .Title(" ").Filterable(false).Width(70);
                columns.Command(command => command.Custom("PurgeProject").Text(" ").HtmlAttributes(new { @class = "btn-default", title = "Purge Project" })
                        .IconClass("fas fa-trash").Click("purgeProject")).Width(65);
                columns.Command(command => command.Custom("ManageProjectsUsers").Text(" ").HtmlAttributes(new { @class = "btn-default", title = "Manage Projects Users" })
                        .IconClass("fas fa-user").Click("manageProjectUsers")).Width(50);

            })

            .Sortable()
            .Filterable()
            .Resizable(resize => resize.Columns(true))
            .Pageable(pager => pager
                .Input(true)
                .Numeric(false)
                .Refresh(true)
            )
            .Scrollable()
            .DataSource(dataSource => dataSource
                .Ajax()
                .PageSize(100)
                .ServerOperation(false)
                .Events(events =>
                {
                })
                .Model(model =>
                {
                    model.Id(p => p._id);
                })
                .Read(read => read.Action("ProjectsPartial", "Project").Data("gerArchiveParam"))
            )
        )
    </div>
</div>

Viktor Tachev
Telerik team
 answered on 04 Jun 2020
1 answer
619 views

Hi ,

 

I am trying to use the export feature of the grid using tag helper but somehow I can't make it work using tag helper or even jquery

 

<toolbar>
    <toolbar-button name="excel"></toolbar-button>
</toolbar>
<excel file-name="Kendo.xlsx" filterable="true" proxy-url="/PlanCodeGroup/Excel_Export_Save" />

 

my entire grid

<kendo-grid name="plancodegroupgrid" height="600" on-data-bound="dataBound" on-remove="onremove">
    <datasource type="DataSourceTagHelperType.Ajax" server-filtering="true" server-paging="true" page-size="100" on-request-end="onrequestend">
        <transport>
            <read url="planCodeGroup/PlanCodeGroup_Read" />
            <update url="planCodeGroup/PlanCodeGroup_Update" />
        </transport>
        <schema>
            <model id="PlanCodeGroupID">
                <fields>
                    <field name="PlanCode" editable="false"></field>
                    <field name="RateScaleCode" editable="false"></field>
                    <field name="PolicyTypeCode" editable="false"></field>
                    <field name="RiskIntegrityGroupPrefixCode"></field>
                    <field name="SystemName" editable="false"></field>
                    <field name="StartDate" editable="false" type="date"></field>
                    <field name="EndDate" type="date"></field>
                </fields>
            </model>
        </schema>
    </datasource>
    <toolbar>
        <toolbar-button name="excel"></toolbar-button>
    </toolbar>
    <excel file-name="Kendo.xlsx" filterable="true" proxy-url="/PlanCodeGroup/Excel_Export_Save" />
    <sortable enabled="true" mode="multiple" indexes="true" />
    <filterable enabled="true" mode="row" />
    <editable mode="inline" confirmation="false" />
    <columns>
        <column field="PlanCode" title="@localizer["PlanCode"].Value">
            <filterable>
                <cell show-operators="false"></cell>
            </filterable>
        </column>
        <column width="150" field="RateScaleCode" title="@localizer["RateScale"].Value">
            <filterable>
                <cell show-operators="false"></cell>
            </filterable>
        </column>
        <column width="150" field="PolicyTypeCode" title="@localizer["PolicyType"].Value">
            <filterable>
                <cell show-operators="false"></cell>
            </filterable>
        </column>
        <column width="150" field="SystemName" title="@localizer["System"].Value">
            <filterable>
                <cell show-operators="false"></cell>
            </filterable>
        </column>
        <column field="RiskIntegrityGroupPrefixCode" editor="riskIntegrityGroupPrefixCodeEditor" title="@localizer["GroupPrefix"].Value">
            <filterable>
                <cell show-operators="false"></cell>
            </filterable>
        </column>
        <column field="StartDate" title="@localizer["Start Date"].Value" format="{0:MM/dd/yyyy}">
            <filterable>
                <cell show-operators="false"></cell>
            </filterable>
        </column>
        <column field="EndDate" title="@localizer["EndDate"].Value" format="{0:MM/dd/yyyy}">
            <filterable>
                <cell show-operators="false"></cell>
            </filterable>
        </column>
        <column width="150">
            <commands>
                <column-command text=" " name="edit"></column-command>
                <column-command text=" " name="destroy"></column-command>
            </commands>
        </column>
    </columns>
    <scrollable height="auto" enabled="true" />
</kendo-grid>


finally my controller
I can see my Read Action being read when I click the export button but after that nothing happen.

I even try via jquery to do a grid.SaveAsExcel(). same result nothing happen also no errors in console.

public IActionResult PlanCodeGroup_Read([DataSourceRequest] DataSourceRequest request)
{
    var plancodeGroups = _mapper.Map<List<PlanCodeGroupModel>>(_planCodeService.GetAllPlanGroups());
 
    return Json(plancodeGroups.ToDataSourceResult(request));
}
 
[HttpPost]
public ActionResult Excel_Export_Save(string contentType, string base64, string fileName)
{
    var fileContents = Convert.FromBase64String(base64);
 
    return File(fileContents, contentType, fileName);
}
Nikolay
Telerik team
 answered on 04 Jun 2020
2 answers
4.1K+ views
Read doesn't work :(


Here's the view:
@*@(Html.Kendo().Grid(Model.Forms)*@ - this one works, unlike the other two which are used with
    @*@(Html.Kendo().Grid<CTR.Models.Forms.Form>()*@
    @(Html.Kendo().Grid<CTR.Models.FormsViewModels.FormViewModel>()
            .Name("Forms")
            .Columns(columns =>
            {
                columns.Bound(p => p.ID);
                columns.Bound(p => p.Type);                
            })                                    
            .DataSource(datasource => datasource
                .Ajax()                                
                .Read(read => read.Action("List1", "Forms"))                
            )
    )

this works
public ActionResult Index()
        {
            var forms = _context.Forms.ToList();
            var model = new ListViewModel(forms);
            return View(model);
        }

None of the Read actions work, i.e. the grid receives zero items.
The actions do return data:
{"data":[{"id":3,"type":0,"questions":null},{"id":2,"type":0,"questions":null},{"id":1,"type":0,"questions":null}],"total":3,"aggregateResults":null,"errors":null}

        public async Task<IActionResult> List([DataSourceRequest] DataSourceRequest request)
        {
            var forms = await _context.Forms.ToListAsync<Form>();
            var list = new List<FormViewModel>();
            forms.ForEach(x => list.Add(new FormViewModel(x)));

            DataSourceResult result = await list.ToDataSourceResultAsync(request);
            return Json(result);
        }

        public ActionResult List1([DataSourceRequest] DataSourceRequest request)
        {            
            var forms = _context.Forms.ToList<Form>();
            var list = new List<FormViewModel>();
            forms.ForEach(x => list.Add(new FormViewModel(x)));
            
            DataSourceResult result = list.ToDataSourceResult(request);
            return Json(result);
        }

        public async Task<ActionResult> List2([DataSourceRequest] DataSourceRequest request)
        {
            IQueryable<Form> forms = _context.Forms;
            DataSourceResult result = await forms.ToDataSourceResultAsync(request);
            return Json(result);
        }




Kim
Top achievements
Rank 1
Veteran
 answered on 03 Jun 2020
1 answer
122 views

Hello,

 

In certain circumstances (for example the event is in the past or the user doesn't have write permission), I would like to able to double click on an event and display a read only version of that event in a popup. 

 

Much like how the edit works but with the items displayed and without inputs.  Ideally I would also like to be able to do this using some kind of display template.

 

I can't see anything in the samples or documentation on how to do this - if it is there , apologies, I missed it.

 

Thanks 

Cheryl 

Petar
Telerik team
 answered on 03 Jun 2020
2 answers
110 views

hi everyone. i use kendo grid in my asp.net core project v 2.1.  i have 3 table person and wife and child. i want use kendo with hierarchy tables. primary table is person and second table is wife or child. for filter the kendo grid i use kendo Filter component (not kendo grid filter). i add first filter component for primary table (person table) and it works fine. i want add secondary filter component for wife table. how i should do this? plz help me thanks.
picture 1:
http://s13.picofile.com/file/8397544592/Screenshot_87_.png

 

picture 2:
http://s12.picofile.com/file/8397544768/Screenshot_89_.png

 

<kendo-datasource type="DataSourceTagHelperType.Ajax" name="dataSource1" server-operation="true">
    <transport>
        <read url="@Url.Action("GetAllPerson", "Reports")" />
    </transport>
    <schema>
        <model id="PersonId"></model>
    </schema>
</kendo-datasource>
  
@(Html.Kendo().Filter<DomainClasses.Person.Person>()
  .Name("filter")
  .Operators()
  .ApplyButton(true)
  .Messages()
  .DataSource("dataSource1")
  .Fields(f =>
  {
      f.Add(p => p.PersonTypes).Label("Person Type");
      f.Add(p=>  p.PersonName).Label("Name");
      f.Add(p => p.PersonFamily).Label("Family");
      f.Add(p => p.PersonAliasName).Label("Alias Name);
      f.Add(p => p.PersonFatherName).Label("Father Name");
      f.Add(p => p.PersonBirthCertificate).Label("National Code");
      f.Add(p => p.PersonCategory).Label("Category");
      f.Add(p => p.PersonCounty).Label("City").DefaultValue(1).EditorTemplateHandler("getList");
  })
)
  
@(Html.Kendo().Grid<DomainClasses.Person.Person>()
    .Name("Grid")
    .Columns(columns =>
    {
        columns.Select().Width(50);
        columns.Bound(p => p.PersonId).Hidden();
        columns.Bound(p => p.PersonTypes).Width(100);
        columns.Bound(p => p.PersonName).Width(200);
        columns.Bound(p => p.PersonFamily).Width(200);
        columns.Bound(p => p.PersonAliasName).Width(150);
        columns.Bound(p => p.PersonFatherName).Width(150);
        columns.Bound(p => p.BirthDatePersian).Width(120);
        columns.Bound(p => p.PersonProvince).Width(100);
        columns.Bound(p => p.PersonCounty).Width(120);
        columns.Bound(p => p.PersonVillage).Width(150);
        columns.Bound(p => p.PersonStreet).Width(200);
        columns.Bound(p => p.PersonEducation).Width(120);
        columns.Bound(p => p.PersonBirthCertificate).Width(130);
    })
    .Pageable()
    .Sortable()
    .Scrollable()
    .Groupable()
    .Events(e=>e.Change("onChange"))
    .DataSource("dataSource1")
    .PersistSelection()
.ClientDetailTemplateId("spouseTemplate")
.Events(e => e.DataBound("dataBound"))
)
  
@(Html.Kendo().Grid<DomainClasses.Spouse.Spouse>()
    .Name("grid_#=PersonId#")
    .Columns(columns =>
    {
        columns.Bound(o => o.SpouseName).Width(200);
        columns.Bound(o => o.SpouseFamily).Width(200);
        columns.Bound(o => o.SpouseFatherName).Width(200);
        columns.Bound(o => o.SpouseIsAlive).Width(150);
        columns.Bound(o => o.SpouseHousingSituation).Width(150);
        columns.Bound(o => o.SpouseAddress).Width(200);
        columns.Bound(o => o.SpousePhone).Width(150);
    })
    .DataSource(dataSource => dataSource
        .Ajax()
        .PageSize(10)
        .Read(read => read.Action("GetSposes", "Reports", new { personId = "#=PersonId#" }))
    )
    .Pageable()
    .Sortable()
    .Filterable()
    .HtmlAttributes(new {style="width:1300px;" })
    .ToClientTemplate()
)
Alex Hajigeorgieva
Telerik team
 answered on 03 Jun 2020
Narrow your results
Selected tags
Tags
+? more
Top users last month
Rob
Top achievements
Rank 3
Iron
Iron
Iron
Atul
Top achievements
Rank 1
Iron
Iron
Alexander
Top achievements
Rank 1
Veteran
Iron
Serkan
Top achievements
Rank 1
Iron
Shawn
Top achievements
Rank 1
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Rob
Top achievements
Rank 3
Iron
Iron
Iron
Atul
Top achievements
Rank 1
Iron
Iron
Alexander
Top achievements
Rank 1
Veteran
Iron
Serkan
Top achievements
Rank 1
Iron
Shawn
Top achievements
Rank 1
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?