Dialog change kendo.confirm title

15 posts, 1 answers
  1. Matjaž
    Matjaž avatar
    82 posts
    Member since:
    Jul 2015

    Posted 04 Oct 2016 Link to this post

    Please open Dialog form.

    How can I change title for dialog opened with kendo.confirm(... ?

    May I suggest that you extend kendo.confirm method with optional second parameter for title.

     

  2. Eduardo Serra
    Admin
    Eduardo Serra avatar
    119 posts

    Posted 04 Oct 2016 Link to this post

    Hello Matjaž,

    It is not possible to change the title for a dialog opened with kendo.confirm. Generally, the browser's confirm dialog supports only a single parameter, the text, so that you can't change the title; take a look at Mozilla's documentation for example.

    With the kendo.confirm, we are trying to imitate this behavior. If you still believe the developers should consider adding this feature in future releases, I encourage you to participate in the Kendo UI Feedback and Feature Request Portal and express your opinion.

    I hope this helps.

    Regards,
    Eduardo Serra
    Telerik by Progress
     
    Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
     
  3. Answer
    Jonathan
    Jonathan avatar
    12 posts
    Member since:
    Feb 2016

    Posted 04 Oct 2016 Link to this post

    Hello!

    Altho you cannot change the Title it's possible to hide it using css:

    .k-dialog .k-window-titlebar .k-dialog-title {
            visibility: hidden;
        }
  4. Jonathan
    Jonathan avatar
    12 posts
    Member since:
    Feb 2016

    Posted 04 Oct 2016 in reply to Jonathan Link to this post

    I suggest you hide some css to shrink it too because that result in a huge margin up top.
  5. Matjaž
    Matjaž avatar
    82 posts
    Member since:
    Jul 2015

    Posted 05 Oct 2016 Link to this post

    Thank you.
  6. Ben
    Ben avatar
    8 posts
    Member since:
    Nov 2015

    Posted 17 Oct 2016 Link to this post

    If you want to replace the text of the kendo.confirm title, this CSS is working for me:

    .k-confirm .k-window-titlebar::before {
        content: 'Confirmation';
    }

    .k-confirm .k-window-titlebar .k-dialog-title {
            visibility:collapse;
        }

    I hope this helps,

    Ben

     

  7. Matt
    Matt avatar
    6 posts
    Member since:
    May 2011

    Posted 27 Oct 2016 in reply to Ben Link to this post

    I had been using the MVC server wrappers however I also found you cannot set the title, however using the kendo.ui.Confirm you can use the following;

     

    function onArchiveCustomer(e) {
        ....
        $("#confirm").kendoConfirm({
            title: "Archive",
            content: "Are you sure you want to <strong>Archive</strong> this Customer?",
            messages:{
                okText: "Archive"
            }
        }).data("kendoConfirm").result.done(function()
        {
          ......
  8. Matt
    Matt avatar
    6 posts
    Member since:
    May 2011

    Posted 27 Oct 2016 in reply to Ben Link to this post

     
    function onArchiveCustomer(e) {
            ....
            $("#confirm").kendoConfirm({
                title: "Archive",
                content: "Are you sure you want to <strong>Archive</strong> this Customer?",
                messages:{
                    okText: "Archive"
                }
            }).data("kendoConfirm").result.done(function()
            {
             ...

     

    Using the code above utilising the kendo.ui.Confirm you can set the title, previously I was using the MVC server wrappers but also found there was no way to set the title.  Hope this helps ...

  9. Chris
    Chris avatar
    1 posts
    Member since:
    Dec 2016

    Posted 21 Feb in reply to Eduardo Serra Link to this post

    Really... is this how Telerik-developers think???? That's a huge disappointment...
    I don't need you to "imitate"; I expect you to improve! Otherwise I might as well use the original browsers' confirm.
  10. Ianko
    Admin
    Ianko avatar
    1800 posts

    Posted 23 Feb Link to this post

    Hi Chris,

    I can assure you that here, at Progress, we are looking into improving our products as per to the best understandings of our clients and the developers using Kendo UI. In order to best put all feedback, feature requests and ideas into a well-organized planning procedure we are using the feedback portal as a channel: http://kendoui-feedback.telerik.com/forums/127393-kendo-ui-feedback. This is why we encourage everyone to post ideas, feedback and opinion on the product there. That way every single item is evaluated and planned according to votes, which affects the importance of the task. That way we can make sure that every single feature/improvement is added based on exact demand.

    With that said, I suggest you to vote for this item here: http://kendoui-feedback.telerik.com/forums/127393-kendo-ui-feedback/suggestions/17024842-modify-the-title-of-the-predefined-dialogs. That way the task about including a title option in the predefined dialogs will gain more priority and put it closer to the to-do features. 

    As for the predefined Dialogs, maybe, using imitate is a wrong word here. In terms of design concepts and specification of the provided predefined dialogs, the requirement was to create Alert, Confirm and Prompt dialogs that function just like the browser's predefined dialogs. The ones we provide, however, have the Kendo themes and stylization, which improves the UX behavior of the web application. Generally, when using a Kendo theme, the predefined dialogs will look like a part of the web application instead of a plain browser dialog. And that is the main idea of having the Kendo UI predefined dialogs.

    I entirely understand that there are many cases that customization is needed. And there are application requirements that those predefined dialogs may not be suitable for. However, such needs can be also accomplished, by using directly the Kendo Dialog widget and define a dialog that best accomplishes the needs of the particular application. The Kendo Dialog is the base of the predefined widget and you can set it up the way you need it. 

    Regards,
    Ianko
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  11. Jonathan
    Jonathan avatar
    12 posts
    Member since:
    Feb 2016

    Posted 23 Feb in reply to Chris Link to this post

    Keep in mind that even if these Dialog reproduce the original browser Dialogs in behavior, there's a huge advantage to used them over.
    When you use the browser dialogs after a page pop one a 2nd time the browser offer users an option to mute pop-up from the given site. While the Kendo being 100% HTML based dialogs, they bypass that browser feature. That and the aforementioned theme integration to them makes them a very must go alternative in my opinion.
  12. Greg
    Greg avatar
    8 posts
    Member since:
    Apr 2018

    Posted 19 Jun in reply to Matjaž Link to this post

    the title in the dialog is in it's own html span, you can change the value using jquery (or straight javascript) with

    $("span.k-dialog-title").html("New Title For Modal");

  13. samk
    samk avatar
    4 posts
    Member since:
    May 2018

    Posted 05 Sep in reply to Matt Link to this post

    I am calling this function on a button click to render a confirm dialog. It works fine when I click the button the first time. If I click again , it says "cannot  read property .... on undefined".Any help will be greatly appreciated.
  14. samk
    samk avatar
    4 posts
    Member since:
    May 2018

    Posted 05 Sep in reply to samk Link to this post

    I mean this fucntion

     

    function onArchiveCustomer(e) {
            ....
            $("#confirm").kendoConfirm({
                title: "Archive",
                content: "Are you sure you want to <strong>Archive</strong> this Customer?",
                messages:{
                    okText: "Archive"
                }
            }).data("kendoConfirm").result.done(function()
            {
             ...

  15. Veselin Tsvetanov
    Admin
    Veselin Tsvetanov avatar
    795 posts

    Posted 07 Sep Link to this post

    Hi Samk,

    After being closed, the Kendo Confirm will be automatically destroyed and its HTML element will be removed from the DOM of the page. Therefore, in order to be able to open it again, you will need to append again its DOM element to the page:
    $("#confirm").kendoConfirm({
      title: "Archive",
      content: "Are you sure you want to <strong>Archive</strong> this Customer?",
      messages:{
        okText: "Archive"
      }
    }).data("kendoConfirm").result.done(function(){
      $('body').append($('<div id="confirm">'));
    }).fail(function(){
      $('body').append($('<div id="confirm">'));
    });

    Here you will find a small sample implementing the above suggestion.

    Regards,
    Veselin Tsvetanov
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top