Help to create a custom selector with html

Question

Hi everyone!!

My idea is to replicate a multiselection dropdown selector as it is in knowage by default but changing some features. I've tried with the html widget editor, using the same source code as it is on git copying and pasting it, but i don't know how to make it work and i feel very lost.

The code used is in https://github.com/KnowageLabs/Knowage-Server/tree/master/knowagecockpitengine/src/main/webapp/js/src/angular_1.4/cockpit/directives/cockpit-widget/widget/selectorWidget/templates . I have a very basic idea of html so i don't understand if the code has dependencies or where can be the problem exactly.

Also, i've tried to look into the documentation but i cannot find a solution to what i need.

In addition to this, i was wondering where can i download widget templates to add them to my widget gallery becuse for the moment is totally empty. Maybe this can be helpful in order to understand how widgets are created i can learn from that.

Thanks in advance.

Answer 1

Hello kmorabul,

there are different paths to do what you are trying to do:

1. change the sourcecode, like you tried, but that will require to take care of the many event chained to selections.
   You can easily customize the css if you want, changing it here. Remember to process the css after those changes with a tool like koala to generate the customStyle.css
2. using the HTML widget to create a custom html template and using the kn-selection attribute to generate the selection, but it will just work on clicks. For more informations on it please read the documentation here. 
3. using the Custom Chart widget (you will have to enable it in the roles management I guess). With it you can create a custom html template for the widget, and also provide some custom js code. I suggest you to create a method to call on selector change that will use the datastore.clickManager. The selection will follow up. For more informations on it read here.

Regarding the templates we are preparing a github repository/website to share with the community and where you will be able to participate to share your custom widgets. I think it will be available very soon, so stay tuned on Knowage channels!

Kind Regards

Comments

Hi!

I've tried the third option you commented because with the html editor im not able to create this multiselector dropdown.

With this custom chart widget i've been having some other problems. First is that if i add a dataset to the widget i get an error like this:

"TYPEERROR: $SCE.TRUSTAS(...).$$UNWRAPTRUSTEDVALUE IS NOT A FUNCTION"

I don't know why it appears and how to solve it 

Besides this, if i don't add any dataset, the widget remains loading and doesn't show anything.

It would be great if you can help me with this.

Thanks in advace.

---

Hi

Please were you able to find the solution to implement a custom selector ?

If you did it would be great to give some hints to implement it .

Thanks in advane