JSFiddle - React, Tailwind, and code Playground

by Danish Farman

HTML

<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/ng-dialog/0.2.13/css/ngDialog-theme-default.css">
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/ng-dialog/0.2.13/css/ngDialog.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/ng-dialog/0.2.13/js/ngDialog.js"></script>
<div data-ng-app="myApplication">
    <div data-ng-controller="MainController">
<a href="" ng-click="ShowNgDialog()">Open Dialog to edit values below</a>
        <br>

        AccountNumber:<input type="text" ng-model="FormData.accountNum" readonly="readonly" />
        <span>{{FormData.accountNum}}</span>
        <br/>
         AccountName:<input type="text" ng-model="FormData.accountName" readonly="readonly" />
        <span>{{FormData.accountName}}</span>

    </div>
</div>

JavaScript

var myApplication = angular.module('myApplication', ['ngDialog']);

myApplication.controller('MainController', function ($scope, ngDialog) {
    $scope.FormData = {
        accountNum:'Add Number',
        accountName:'Add Name',
                      };
    $scope.ShowNgDialog = function () {
        ngDialog.openConfirm({            
            template: '<div><input type="text" ng-model="FormData.accountNum"/>' +
            '<input type="text" ng-model="FormData.accountName"/>' +
               '<input type="button" value="confirm" ng-click="confirm(FormData)"/>' +
                '<input type="button" value="close" ng-click="closeThisDialog()"/></div>' ,
            plain: true,
            scope:$scope           
        }).then(function(value){
            console.log(value);           
            
        },function(reject){
            console.log(reject);
            
            
        });
    };    
});