I have created a custom widget with open textbox and search button in Thingsboard IoT open-source platform. On click of button i want to filter the telemetry rows listed in thermometers widget.
e.g. In attached image, if i enter Thermometer-1A in red highlighted textbox then on click of search button Entity Name highlighted in blue color should be filtered with the input value in Thermometers widget.
Any help would be greatly appreciated.
Thingboard Dashboard custom widget
Intercommunication is only possible between custom widgets. Our standard widgets do not provide an API for communication.
If you only want to filter data in the table widget, the easiest way is to use 'search' button in the top right corner of the table widget.
If the first option does not work for you, you should implement your custom table widget and add an API for intercommunication. For example, Search widget will broadcast some event when a button is pressed. And custom table widget will listen to messages of a specific type and acts accordingly.
Here is a link that describes to messaging works inside AngularJS
https://toddmotto.com/all-about-angulars-emit-broadcast-on-publish-subscribing/
Related
Hi :) I would like to ask you about how to treat elements that compose a list, but whom have assiged a button role and are put in side panel ( so it is not a menu or dropdown). My main problem is how to decide is to where ARROWS should works and where TAB.
Moreover I have a differ types of list items that consist of:
checkbox/ radiobutton only
checkbox/ radiobutton with a link to another panel
two icons/ buttons that has defined an activities etc.
Please look at pictures and help me please :)
PINK - "arrows"
BLUE - "TAB"key
You should hardly decide which component will use TAB key or Arrow Keys. Keyboard accessibility for a large number of components is already defined in WAI-ARIA Authoring Practices.
Adding a different behavior could create issues to both sighted, and non-sighted users because they'll already be knowing which key to use based on the component or they'll know intuitively because of standard roles or they'll know as they use keyboard more to browse.
Offer List
Listbox will work. Arrow Keys to navigate and Enter key to perform the action.
List of Checkboxes and Radio Buttons
I would recommend to keep Checkboxes and Radio Buttons to their default keyboard behavior. Since your cases are more of a list, you can convert the list of checkboxes and radio buttons to Single Select and Multi Select Listboxes and use Checkbox and Radio Button as a font icon or graphic to show the selection, similar to how tick is shown in this Listbox example. When you convert to a Listbox, you'll meet the Arrow Keys requirement.
Selected Fruits List
There are some issues in the required keyboard behavior: How will user know if Arrow-Left or Arrow-Right need to be presed, think about non-sighted users.
Fruit Name and i icon button
In your need, you want both Fruit Name and i icon button to open a panel, suggest to NOT use Arrow-Right to i icon button and only use the Enter key to open the panel. May be you don't need i icon button at all.
Delete icon button
Suggest to use DEL key to delete the item
Conclusion
Remove i icon button. If you can't just keep it as graphic element without any events
Use Enter key to open the panel
Use DEL key to delete the item
I think the whole list will then become a listbox, navigable using Arrow Keys and Enter to invoke an operation
Vegetables List
Neither Accordion nor Nested List works here because you have two actions to do: Make a selection, and Expand and Collapse. I haven't tried TreeView but you can check.
We are using Custom SignUpSignIn Policy, and on our signUp form we have textbox, dropdown and a checkbox which are all required fields.
When a user does not fill in the necessary details,
for the text box, it is highlighted with red line around the text box and as we enter the text box, it says "This information is required." in red color text on top of the text box which is good.
But for the Dropdown and checkbox, a simple message "Missing required element [Country]" is displayed at the top of the form(not even red color text) and no highlighting on the field. User may not even notice that.
How can I achieve the same behavior as the textbox for dropdown and checkbox?
Thanks,
Wait for the ability to use JavaScript via the "shared domain" feature.
UserVoice item reference.
...as a result of ‘shared domains’ this means that you will be able to start using your tenant as a subdomain of a ‘shared domain’, in the form of {tenant name}.b2clogin.com where b2clogin.com is the ‘shared domain’. You will be able to run Javascript when you are running on this shared domain...
I just want a way for all the required field validation messages to display in Red ...
That you can achieve with custom CSS which you can do today.
But for the Dropdown and checkbox, ... , is displayed at the top of the form
Moving stuff around would require JavaScript.
I have a page with two buttons in header. I need to display same data on click of both buttons resp. but in different layout, means at click of first button i want to display a kendo asp.net mvc grid and at click of second i want tot display that data in a form of listview. So the question is, is it possible to display the data initially as a grid or listview (any one ) and at runtime we can change the format from grid to listview so that we don't have to create seperate controls partial views for that. Or any better idea on how to implement it is also welcomed.
I have a xpage which contains one big table with 1 row and 2 columns. I created this table to separate the xpage into 2 parts: the left one where I have some buttons and the right one where I want to display some views.
From the container controls I drag a View on the right column, but is there any chance to do this in such a way that 1st button clicked => 1st view is shown, 2nd button clicked => 2nd view is shown and so on.
Or every xpage should contain one view?
I raise this question considering the fact that in Lotus Notes if you had one frameset with 2 frames, you could easily create an outline in one frame, and some views that will be open by every outline entry in the 2nd frame. What I want to do is quite the same thing.
I appreciate your time. If you think this question isn't 'good' enough, I will just delete it. I'm new in XPages development.
Use simple table with one row and two columns. Place your buttons inside the left cell. Put the switch control (mentioned by Tim) to the right one.
More about the control in extlib demo DB... online demo here
Create separate custom control for each view and drag and drop "Include Page" from container control to the right column of your table and compute the page name instead of selecting an XPage. You can compute like this sessionScope.CCName + ".xsp". And onclick of the button set appropriate custom control(which contains the view) name as the value to the sessionScope variable and reload the page. This will do what you want. I hope this too helps.
You could do this on a single XPage using a xe:navigator control in the left column and an xe:dynamicViewPanel control in the right. These controls are available in the Extension Library if you are running 8.5.3 and natively available in release 9.
The Dynamic View Panel control is the dynamic content control for displaying one of several Domino views. Only the component for the displayed view is loaded in the component tree so it is highly efficient compared to alternative designs (like an xp:viewPanel control in each facet of an xe:switchFacet control as each viewPanel is loaded in the component tree on the server, not just the one that is rendered).
See this online demo http://xpages.jp/demos/xpagesext.nsf/Domino_DynamicView.xsp
put each content on a seperate panel in a custom control.
Have those custom controls in seperate divs and show/hide divs based on button click.
If you are using different xpages, you can use IncludePage(from container controls), which will act like a computed subform.
My project consists of two Dialogs.
The first one contains ado data control and datagrid used for searching a specific record.
The result is displayed in DataGrid
Double clicking the row of the Grid suppose to opens the details Dialog with the record in the row which clicked.
I'm using mfc visual c++6
Any help would be appreciated.
you can use MFC Grid control for grid display and you can catch double click event of grid control.
detail implementation of mfc grid is given in following link.
http://www.codeproject.com/Articles/8/MFC-Grid-control-2-27