Sample.html
<body ng-controller="demoController">
<jqx-docking class="docking" id="jqxDockingwindow1">
<div>
<div>
<div sampleDirective></div>
</div>
</div>
</jqx-docking>
</body>
Directive.js
demoApp.directive('sampleDirective', function() {
return {
templateUrl : 'directive.html',
link : function(scope, iElement, iAttrs) {
scope.value = false;
scope.open = function() {
if (this.value == false) {
$('#Window').jqxWindow('open');
this.value = true;
} else {
$('#Window').jqxWindow('close');
this.value = false;
}
};
}
};
});
directive.html
<div class="picker">
<input type="text" name="input"><img src="images/icon-calendar.png" ng-click="open()">
</div>
<jqx-window id="Window" jqx-width="345" jqx-height="200" jqx-auto-open="false" jqx-show-close-button="false">
<div id="title">Title</div>
<div>Content</div>
</jqx-window>
If I use, <div sampleDirective></div>
outside isolated scope its working fine, When I click the image icon, the window is opening but If I put this directive inside docking its not working.