CODEWITHSUNDEEP
angularkendo-ui-angular2
John Smith
John Smith

Reputation: 77

KendoUI Dialog Service with Inputs

I am trying to use the KendoUI dialog service to gather textual input data from the user using Ok and Cancel buttons. Any examples of how to do this? Thanks!

Upvotes: 1

Views: 1215

Answers (1)

Anton Semenov
Anton Semenov

Reputation: 461

I use this way. Example:

I have service:

import { Injectable, TemplateRef } from '@angular/core';

import { DialogService, DialogRef, } from '@progress/kendo-angular-dialog';

@Injectable()
export class MyDialogService {

private _currentDialog: DialogRef;

constructor(private dialogService: DialogService) {

}

open(title: string, content: Function) {
    this._currentDialog = this.dialogService.open({
        title: title,
        content: content
    });
};

close() {
    this._currentDialog.close();
}
}

From code my calls look like this: 

this.myDialogService.open('Buying', PopupAuthBuyComponent);

MyComponent:

@Component({
    templateUrl: './popup-auth-buy.component.html'
})
export class PopupAuthBuyComponent implements OnInit {
... your logic that handles form and works with model
}

MyTemplate: 

<div>
    <form (ngSubmit)="onSubmit()" #buyForm="ngForm">
        <YOUR INPUTS HERE />
        <kendo-dialog-actions>
            <button  kendoButton [primary]="true" type="submit" [disabled]="!buyForm.form.valid">Submit</button>
        </kendo-dialog-actions>
    </form>
</div>

Hope, this helps.

Upvotes: 1

Related Questions