jQuery UI Widgets › Forums › Angular › angular jqxdocking layout questions
Tagged: Angular, jqxDockingLayout
This topic contains 9 replies, has 3 voices, and was last updated by Hristo 3 years, 10 months ago.
-
Author
-
I’m trying to make web idea tool like as pycharm or intellij by using jqxdocking layout in Angular.
questions
1. How can i disabled floating?, in default docking layout , every group or panel can be floating group or panel when user drag thems.
2. How can i make layoutPanel title verticle. In this link, “Toolbox” , “Help”, “Solution Expoler” , “Properties” these are display horizontal. i want to display each word verticle.
Like below :
T
o
o
l
b
o
x
——–
H
e
l
p3. also , how can i insert icon in each Panels title?
4. when click pinned left and rightside, each tabgroup title displayed bottom. how can i make each tabgroup title left and right side. In this demo , when i click leftside “Toolbox” pin , “Toolbox” and “Help” words are displayed in bottom layout by tabgroup. I want bottom tabgroup titles in left side.
5. How can i capture every events in docking layout. seleted , pinned , unpinned , ect..
Thank you for helping us.
- This topic was modified 3 years, 10 months ago by wonwoostar.
extra explain about #4 . side title remains side still , when I just select title. i just want to make like unpinned show as same as selected show.
another things in jqxdocking layout. in my code
<jqxDockingLayout #myDockingLayout [width]="getWidth()" [height]="900" [layout]='layout'> <!--left group--> <div data-container="NeuralNetPanel"> <jhi-module-example [moduleType]="neuralName"></jhi-module-example> </div> </jqxDockingLayout>
I’m triying to send string value to other component in jqxDockingLayout. It doen’t work. i don’t know reason. When I send string value to other component without jqxDockingLayout, it works fine.
<jhi-module-example [moduleType]="neuralName"></jhi-module-example>
Hello wonwoostar,
(1.) If you want the layouts to be not floating then you could use our another widget – jqxLayout.
About the vertical titles (2.), I would like to mention that this is not possible, unfortunately.
On point three (3.) I would suggest you add one
img
tag next to the title of the layout.
Please, take a look at this example.Unfortunately, there is no such option for verticalization of the headers of the pinned group. (4.)
(5.) You could find how to use and all available events for the jqxDockingLayout in its API Documentation page.
For example, to bind topin
event you should add “on” plus the name of the event with capital letter –(onPin)="Pin($event)"
.We have one another DockingLayout which is a Web Component.
Please, take a look at this example.
You could look on this page for its options and the available features for it.Best Regards,
Hristo HristovjQWidgets team
https://www.jqwidgets.comThanks, one more thing i need to know
another things in jqxdocking layout. in my code
<jqxDockingLayout #myDockingLayout [width]="getWidth()" [height]="900" [layout]='layout'> <!--left group--> <div data-container="NeuralNetPanel"> <jhi-module-example [moduleType]="neuralName"></jhi-module-example> </div> </jqxDockingLayout>
I’m triying to send string value to other component in jqxDockingLayout. It doen’t work. i don’t know reason. When I send string value to other component without jqxDockingLayout, it works fine.
<jhi-module-example [moduleType]="neuralName"></jhi-module-example>
or easy example how can i use initContent() call back funtion if i want use interpolation in docking layout or jqxlayout
<jqxDockingLayout #myDockingLayout [width]="getWidth()" [height]="900" [layout]='layout'> <!--left group--> <div data-container="NeuralNetPanel"> {{ name }} </div> </jqxDockingLayout>
is .ts file
name: string = "stars";
Our company buy jqwidgets component commercial version 1year. If we want use another component which you sugguest, is there any chance to use commercial version another components?
Thank for help.
- This reply was modified 3 years, 10 months ago by wonwoostar.
Hi wonwoostar,
The product which we suggest – Smart Web Components is built by jQWidgets and it is part of your annual subscription for updates and support.
Best Regards,
Peter StoevjQWidgets Team
https://www.jqwidgets.comThanks,
in before question , I need sample code which i question about .
<jqxDockingLayout #myDockingLayout [width]="getWidth()" [height]="900" [layout]='layout'> <!--left group--> <div data-container="NeuralNetPanel"> <jhi-module-example [moduleType]="neuralName"></jhi-module-example> </div> </jqxDockingLayout>
<jqxDockingLayout #myDockingLayout [width]="getWidth()" [height]="900" [layout]='layout'> <!--left group--> <div data-container="NeuralNetPanel"> {{ name }} </div> </jqxDockingLayout>
– how can i use initContent() call back funtion if i want use interpolation works in docking layout or jqxlayout
– In your reply means that we can use https://www.htmlelements.com/ component commercial version in our jqwidget annual subscription?- This reply was modified 3 years, 10 months ago by wonwoostar.
Hello wonwoostar,
Could you clarify it – what you mean with “i want use interpolation”?
If you want you could useinitContent
callback to make some changes in the particular layout.
Meanwhile, please, take a look at this example:
https://stackblitz.com/edit/github-lraahy-mfhmt8About the “Smart HTML Elements“ https://www.htmlelements.com/ – both products are by jQWidgets and your license is valid for both. Do not hesitate to use the one which fits better in your application.
Best Regards,
Hristo HristovjQWidgets team
https://www.jqwidgets.com- This reply was modified 3 years, 10 months ago by Peter Stoev.
Hello Hristo, I means ‘interpolation’ that below code {{ name }} in html . i dont know how to {{name}} works using
initContent
<jqxDockingLayout #myDockingLayout [width]="getWidth()" [height]="900" [layout]='layout'> <!--left group--> <div data-container="NeuralNetPanel"> {{ name }} </div> </jqxDockingLayout>
– second if i want send value to other component using @Input, @Ouput decorator. how can i use initContent fallback function. Example code below.
<jqxDockingLayout #myDockingLayout [width]="getWidth()" [height]="900" [layout]='layout'> <!--left group--> <div data-container="NeuralNetPanel"> <receive-component [name]="name"></receive-component> </div> </jqxDockingLayout>
- This reply was modified 3 years, 10 months ago by wonwoostar.
Hello wonwoostar,
About the jqxDockingLayout it use the internal structure and after its initialization it transform that structure.
The id of the inner elements is saved and for this purpose is used with “createInstance” method to create the internal widgets.On the other side one I think better approach for your case with custom component it will be the Dynamic Injection approach.
You could use this in the “initContent” callback to add there wanted component.
Please, take a look at this tutorial.Best Regards,
Hristo HristovjQWidgets team
https://www.jqwidgets.com -
AuthorPosts
You must be logged in to reply to this topic.