Questions on Kendo UI for Angular Forum

0 answers

84 views

How to select user from kendo dropdown then click kendo button do add row to Database table and displayed with kendo grid passing JSON to ajax function

//Controller
[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Create([DataSourceRequest] DataSourceRequest request, Model x)
{
    if (x!= null && ModelState.IsValid)
    {
        DataLayer.Create();
    }
 
    return Json(new[] { x }.ToDataSourceResult(request, ModelState)); 
}
//DAL
internal static Model Create()
{
    int iRows = 0;
    Guid guid = Guid.NewGuid(); (why is guid repeated twice?)
 
    string query = @"INSERT INTO Table2" +
                    "([Column1], [Column2], [Column3], [Column4], 
                      [Column5], [Column6], [Column7], [Column8],
                      [Column9], [Column10], [Column11], [Column12], [Column13] ) " +
" VALUES " + "(@Column1," + ConfigurationManager.AppSettings["Column2"] + ", ' ', GETDATE(), 
0 ,@Column6,1,@Column8,@Column9,@BEGDATE, @END_DATE,@Column12, @Column13)";
 
    using (IDbConnection _db = OpenConnection())
    {
        iRows = _db.Execute(query);
    }
 
    if (iRows > 0)
    {
        string query2 = @"SELECT * FROM Table2 WHERE PrimaryID2 = ";
 
        using (IDbConnection _db = OpenConnection())
        {
            return _db.Query<Model>(query2, new { PrimaryID2 = guid.ToString() }).FirstOrDefault();
        }
    }
    else
    {
        return null;
    }
}
//MODEL has all the properties (Column1,2, etc)
//VIEW/AJAX
   <div class="col">
    @(Html.Kendo().Button()
    .Name("create")
    .Content("Add new row")
    .HtmlAttributes(new { type = "button",  = "btn btn-primary" })
    .Events(ev => ev.Click("create")))
   </div>
 
   <div class="col">
    .DropDownListFor(a => a.model.primarykey1,     (IEnumerable<SelectListItem>)ViewBag.dropdownlist, "-- Select id1--", new {  @class= "form-control",  @id = "id1" })
  </div>
</div>`
for my AJAX
 
function create(items) {
 
  var selectedResident = $("#primaryid1").val();
 
$.ajax({
  url: "/user/Create",
  type: "POST",
  data: { grid: items },
  traditional: true, // add this
  success: function (result) {
  $('#grid').data('kendoGrid').dataSource.read();
  $('#grid').data('kendoGrid').refresh();
  },
  error:
    function (response) {
    alert("Error: " + response);
    }
 
    });
}

Button

DropDownList

General Discussions

Grid

updated question on 08 Oct 2024

1 answer

211 views

FORCE USE FORMAT US FOR SPANISH LOCALE USING ANGULAR?

I have a question on this, i have a service in my application that is switching the language of website (including this

(<CldrIntlService>this.intlService).localeId = language;

Also i have some kendo-numerictextbox in my project that need to be force set to USA currency format always, how can i achieve this.

FormField

NumericTextBox

answered on 07 Oct 2024

0 answers

112 views

How to make the file list appear to the right of to the 'Select' button and dropzone rather than beneath it.

The <ul> containing the list of files by default appears beneath the button and dropzone. How can I move it so it appears to the right instead?

FileSelect

asked on 07 Oct 2024

2 answers

246 views

[Solved] Bug: Unnecessary console warning when sticky grid set with responsive column enabled

I've got a kendo grid with a responsive column set up as described in the docs

I also made a column sticky on the part of the grid that renders when the screen is larger.

I get this console warning because my responsive column does not (and cannot have) an explicit width set:

"Sticky columns feature requires all columns to have set width."

Grid

answered on 04 Oct 2024

0 answers

108 views

Is Kendo grid having legends?

I am using kendo grid to show the data and the data consist of different types of status with colour indication. So i have to show a legend explaining the status colour in the grid.

Do we have an option to show a grid with legend in kendo ?

Grid

updated question on 03 Oct 2024

0 answers

82 views

Can I use a custom TimeSelectorComponent in a DateTimePickerComponent ?

I want to be able to change the logic for handleNow(). This function is a part TimeSelectorComponent which is use in DateTimePickerComponet.

My initial thought was create a component class that extends TimeSelectorComponent and use it like this

<kendo-datetimepicker> 
    <custom-time-selector></custom-time-selector>
</kendo-datetimepicker>

But this doesn't seem to work. Is this even possible ?

DateTimePicker

asked on 01 Oct 2024

1 answer

122 views

Integration example

I have an open source Angular custom scrollbar library. I wanted to add an integration example with Kendo UI Grid at this page https://www.npmjs.com/package/ngx-scrollbar. but when I tried to add to the demo, it looked bad because of the watermark.

In the stackblitz the grid example doesn't show a watermark. I am wondering if there is a way to display the grid example without it for demonstration purpose.

Thanks,

Grid

Licensing

updated question on 25 Sep 2024

0 answers

126 views

Editable Cell Templates Default Back to Inputs When One Row

Hello,

I have come across an issue that I was able to replicate in a stackblitz. When using dynamic columns to display a Kendo Grid's data, specifically when the grid only contains one row, the editTemplate unexpectedly reverts to a standard input field. This behavior does not occur when the grid has multiple rows.

In my example stackblitz below, I have a dropdownlist as the edit template for the column Product Type. Upon clicking it, (sometimes a double click) it turns into a input.

To repeat:
1) add product type in multi select above grid to display row
2) Click Dropdown
3) Dropdown becomes input

I'd appreciate any help, I've tried a few things like event.preventDefault and other ways to try and stop this behavior, but I cannot figure out a way. Again, it only happens when there is one row.

Thanks in advance!

Kendo UI for Angular Example Application (stackblitz.io)

https://stackblitz.com/edit/angular-ppvmbg?file=src%2Fapp%2Fapp.module.ts

Editor

Grid

asked on 24 Sep 2024

1 answer

124 views

Treelist Angular

I have a kendo-treelist in Angular

Edit mode has only Number, Text or boolean,

 <kendo-treelist-column field="Enhed" title="Enhed"  editor="text" 
    [style]="{'text-align': 'left','min-width':'100px','padding': '0px'}"
      [headerStyle]="{'text-align': 'left'}">
       <ng-template kendoTreeListCellTemplate let-dataItem let-rowIndex="rowIndex" let-column="Enhed">
        <span *ngIf="!kendotreelist.isEditingCell()">{{dataItem.Enhed}}</span>
        <select *ngIf="kendotreelist.isEditingCell()" type="text" [(ngModel)]="dataItem.Enhed" >
          <option *ngFor="let enhed of enheder" [value]="enhed">{{enhed}}</option>
        </select>
      </ng-template> 
    </kendo-treelist-column>

I need to make it custom select instead.

Is there any one who knows how?

DropDownList

TreeList

answered on 24 Sep 2024

0 answers

450 views

Getting error while using DialogService

Hello!

I'm trying to implement the DialgService as described in the example (Angular Dialogs Dialog Angular Service - Kendo UI for Angular (telerik.com) but I keep getting the following error:

Cannot attach dialog to the page.
Add an element that uses the kendoDialogContainer directive, or set the 'appendTo' property.

Yes, I tried to google for a solution and some answers suggested, to put the

<div kendoDialogContainer></div>

into my app.component.html but that didn't change anything. Setting the "appendTo" property only resulted in a typescript error.

Does anyone have a suggestion for me on how to fix this error?

Thanks for any help in advance!

Cheers

Joerg

Dialog

asked on 20 Sep 2024