Does anyone know of a way to customize or remove the Callout for the Fluent UI SearchBox? - search-box

I'm working on an autocomplete for the React Search Box but because it doesn't have an open interface, the Callout will popup if you have done a previous search. I want to either turn it off or customize it so I don't have to use a separate component.
Thanks in advance.

I know it's a little late but I found setting autoComplete attribute on the SearchBox to "off" works.

Related

is there a way to change the icons of the stepper form in Vuetify-jsonschema-form Vue js?

I'm trying to build a form wizard, and would like to over ride the default icons / steps in the stepper, I don't seem to be able to find an option but I might be missing something. Is there anyway to customize the Icons for each step?
button that I'm trying to change
Without some "tricks", you can change 3 icons
Complete, Edit and Error. Check them here
If you need something more you'll probably need more work.

Reactivesearch, Datasearch component: Is there a way to extend the component on SearchIconClick?

I would like to extend the Datasearch component by a function that reacts on the event that the search icon is clicked. In https://github.com/appbaseio/reactivesearch/pull/747/files there is a handler for this, called handleSearchIconClick. However, it seems that this handler can't be overwritten. Is there another way to react in a meaningful way on this event? If yes, are there examples around that help to solve this problem? Thank's in advance!
Yes, you can have a custom click event with custom search icon, here is a sample which demonstrates that
https://codesandbox.io/s/datasearch-igd89

DOJO 1.9. FilteringSelect ComboBox scroll to last selected item on show [IE]

How to make dropdown scroll to the last selected option after dropdown is re-opened?
Calling filtering_select_ref.dropdown.set('selected', selected_node_ref) or filtering_select_ref.set('scrollOnFocus', true) did not work for me on IE 11.
If you just need to scroll to the option, you could use win.scrollIntoView(node_ref) from "dojo/window" module as shown in the docs and pass the id or the node reference to the option as an argument.
You may also find these methods interesting to help solve your problem:
filtering_select_ref.openDropDown()
var dropdown = filtering_select_ref.dropdown;
dropdown.selectFirstNode()
dropdown.selectNextNode()
dropdown.selectPreviousNode()
dropdown.selectLastNode()
#Carlos Nantes suggested good options however I was aware of them and my problem with them was that I could not "catch" the moment when dropdown got opened.
I finally found a way to "catch" that moment with filtering_select_ref.watch('_opened', function()...
watch doc can be found here

ExtJS - Changing default button styles and fonts

I have this requirement where I have to change the default styles on my Ext JS application. I am not talking about changing stuff in CSS files yet. I am not that ambitious yet. Here is what I am looking for:
Suppose I need a Submit and Cancel buttons, I use xtype:button and text:Save ( or Cancel ). This will render buttons with the text on them. What should I do if I want to change the look and feel of the button? Or replace the button with a cool Save or Cancel image?
Right now I have all the texts on the application with the default font that ExtJS shows. What am I supposed to do if I want all the text on the application changed to a different font? Everything right from the data in forms/grids and the titles of each component should be changed to some other font my customer prefers. What am I supposed to do?
I understand these are very basic and a generic questions, but I am looking for a good headsup before I proceed with my task.
Thank you all in advance. Waiting for answers :)
Update: So, I found out how we deal with CSS and change the fonts. Can anyone help about the Chaning the look and feel for Submit/Cancel buttons.
I recommend you to use SASS and compass to build your own themes, or better said to change one the existing themes. In the Ext JS documentation you can find the css variables which you can set according to your needs.
If you are not ready for theming with SASS just yet take a look at this example of button configs from the sencha docs:
Stanadalone Example page: http://docs.sencha.com/extjs/4.1.3/extjs-build/examples/button/button.html
CSS that adds customized images to the buttons: http://docs.sencha.com/extjs/4.1.3/extjs-build/examples/button/button.css
JS that shows button configs: http://docs.sencha.com/extjs/4.1.3/extjs-build/examples/button/button.js
Essentially this shows how to use iconCls property on the button config along with a simple CSS class to add desired image to your button.

How to make a custom ListVIewItem on Secha2?

I am trying to make a custom listview with his items bigger, with an image in the background and a text over it.
I'm trying to use the Kiva example on the docs, but I cannot understand nothing about how is doing that.
Someone could help me understand how to make that? or ar approach to do?
If you want to use sencha-touch 2.0, I think Sencha-touch2.0 guide helps you.
Of course if you want to edit style, you must change via css or template of listview (via listview's tpl attribute).