Bhavin Patel

Angular, PWA, C#, ASP.NET, Node.js, Docker, React, IONIC, IoT & more …

Angularjs With JQuery UI Dialog – First and Only example of non model windows


AngularJS Question :
I want to create Modeless / Nonmodal window plugin using Angularjs.
Basically , I have one button on my page and on click of it, i want to keep creating new small non-modal dialog window multiple instances.

– Angular JS with JQueryUI Dialog (created dialog service in angular which uses jquery ui dialog)

– capable of handling multiple instance of dialog windows on same page with same html template.

– uses ng-template in all instances of dialogs without interfering with eachother.

  1. Finally – Download plunker –     http://plnkr.co/edit/IacJX1mlsQ09h44LXV2f?p=preview
  2.  Github for Dialog-service.js      https://github.com/jwstadler/angular-jquery-dialog-service

Another BootStrap option is  – Bootstrap Window

/bootstrap-window

Happy Coding… 🙂

More Posts

7 responses to “Angularjs With JQuery UI Dialog – First and Only example of non model windows”

  1. Bill Krueger Avatar
    Bill Krueger

    Hi Bhavin,

    I’m working on an Angularjs based project here at work and while researching thru all the dialog/modal posts with regards to drag and drop and ran across your post and github project “angular-jquery-dialog-service”. I’d love to try it out in our product but our company has some strict rules about licensing and I noticed your code did not have any license information. Is there any way for you to either approve it’s use without restrictions or add a LICENSE file so I can get this approved?

    Regards, and great work,

    Bill

    Like

    Reply
    1. Bhavin Patel Avatar
      Bhavin Patel

      Hello Bill,

      Feel free to use it without any restriction of license. I am glad that it’s useful for you in your project. Your one thank you would be enough for me to boost my work.

      Thank you,

      Like

      Reply
  2. Ven Avatar
    Ven

    Great article. I was using Kendo UI window and I customized to be compatible with ng-template. The best thing is to use angular plugins since it would keep syntax uniform across the application

    Like

    Reply
    1. Bhavin Patel Avatar
      Bhavin Patel

      Thank you Ven. Glad that article is helpful to you..

      Happy Coding 🙂

      Like

      Reply
  3. aravinda kailasapu Avatar
    aravinda kailasapu

    i want to add minimize option to, how can we add that? could you tell me

    Like

    Reply
  4. aravinda kailasapu Avatar
    aravinda kailasapu

    could you tell me how to add minimize button to the dialog

    Like

    Reply
    1. Bhavin Patel Avatar
      Bhavin Patel

      I think we need to have windows js library for that. I will see if i can have it in my free time.

      Like

      Reply

Leave a comment