I am trying to add a list of strings to the autocomplete values returned to the autcomplete Text bar
when these values are selected i must process them locally before retrieving information from the google servers.
this is the code which binds the AutoComplete entity to the auto text field.
final AutoCompleteOptions options = new AutoCompleteOptions();
options.setTypes(Arrays.asList(new String[] { "geocode" }));
final AutoComplete autoComplete = new AutoComplete(this.auto.getElement(), options);
autoComplete.bindTo("bounds", (com.google.gwt.maps.client.Map) this.mapWidget.getMap());
Any ideas?
Related
Hi I just created the ionic accordion dropdowns by following a tutorial blog link which used widgets for creating an accordion dropdowns, Below is the link of that blog.
http://masteringionic.com/blog/2019-01-27-creating-a-simple-accordion-widget-in-ionic-4/
updated: here is the my project demo link https://stackblitz.com/github/dSaif/search-accordion
Everything is working perfect, but i want to add Ion-searchbar at the top of the accordions sothat the dropdowns gets filter by inputing text.
please assist me how can i do that. Thank you.
You are going to have to create a variable in your homepage to store your filtered results. Then you need to have a filter function that will take the input from the search bar and filter your master list. Keep in mind you should not set the new variable to the master list, this could cause issues due to object referencing.
So you should have something like
in your html
<ion-searchbar placeholder="Search a name." [(ngModel)]="searchValue" (ionChange)="filterList()"></ion-searchbar>
In your ts file
searchValue: string = '';
filteredList: Array<{ name: string, description: string, image: string }> = this.technologies;
// function called in the html whenever you change the ion searchbar value
private filterList(){
//Make a variable so as to avoid any flashing on the screen if you set it to an empty array
const localFilteredList = []
this.technologies.forEach(currentItem => {
//here goes your search criteria, in the if statement
if(currentItem.name && currentItem.name.toLowerCase().includes(this.searchValue.toLowerCase())) {
localFilteredList.push(currentItem);
}
});
//finally set the global filter list to your newly filtered list
this.filteredList = localFilteredList;
}
You also need to make sure to reference the filterList variable instead of the current one you are referencing.
I have a question and maybe someone could help me find the best solution. I want a user to be able to add items to a drop down list dynamically in a form. I have a form with text boxes and drop down lists and want the user to be able to add items to the drop down list if they don't find it. I would make the drop down lists text boxes but I want to try and keep the names consistent. An example of a form would be have the user enter a name and then have drop down lists for colors and shapes. If the user does not see the color in the drop down I want them to be able to click a link next to the drop down and enter the name or the color. Another link to add shapes to the drop down list.
I'm trying to do this in an MVC Razor environment. I tried using partial views by having the link open a modal box of a partial view to enter the name, but then I have a form within a form and cannot submit the inner form. If I open a small window to enter the name then how do I add it back to the original parent window form without loosing what they already entered in the text box? I know there has to be a good solution out there.
If you want the users new input to be saved for later use, you could use Ajax to submit the new data into the database, and then have the controller return a partial view with your new dropdown.
So your dropdown would be an action Like this:
public PartialViewResult Dropdown()
{
var model = new DropdownModel()
{
Data = yourdata;
}
return PartialView("Dropdown.cshtml", model)
}
And your action to insert new data would look something like this:
public PartialViewResult AddDataToDropdown(string data)
{
var newDropdown = repository.AddData(data);
var model = new DropdownModel()
{
Data = newDropdown;
}
return PartialView("Dropdown.cshtml", model)
}
So bascially, you can resplace the HTML in the div that contains the dropdown with Ajax like this:
$(".someButton").on("click", function () {
var newData = ("$someTextbox").val();
$.ajax({
url: "/YourController/AddDataToDropdown",
type: "GET",
data: { data: newData}
})
.success(function (partialView) {
$(".someDiv").html(partialView);
});
});
This way you save the data and the dropdown is refreshed without refreshing the entire page
I have a toolBar where i am using plenty of item now when i am clicking on any item i am creating a tab.Something like this code
public static void openNewTab(String title, String path, Tabbox mainTab) {
Tab tab = new Tab(title);
tab.setClosable(true);
tab.setParent(mainTab.getTabs());
Tabpanel tabpanel = new Tabpanel();
Include include = new Include(path);
include.setParent(tabpanel);
tabpanel.setParent(mainTab.getTabpanels());
mainTab.setSelectedTab(tab);
}
Now i will want to get the ViewModel of selected tab When any Ctrl Key press in ZUL...
I have this
#Wire("#mainTab")
Tabbox mainTab;
Tab tab = mainTab.getSelectedTab( );
Can it possible to get ViewModel from the selectedTab varaibles?
And i am doing like this
Include include = new Include(path);
include.setParent(tabpanel);
Object object = include.getAttribute("viewModel");
Now object is giving null Can we get ViewModel from here while i am including a ZUl here?
It seems the id is the attribute name to get vm, see sample at zkfiddle
Btw "binder" is the attribute name to get binder, for more information please refer to Source code of binder
You can also try to use Component.getAttributes to get the attribute map and check all attributes in it, see Javadoc: Component#getAttributes
Working in Google Web Toolkit (GWT) I am using a CellList to render the details of a list of Tariffs (using a CompositeCell to show a CheckBoxCell next to a custom cell of my own).
I want to filter the list by tariff length (12, 18, 24, 36 months etc). I would like to render a checkbox for each tariff length at the top of the list, and update the dataProvider as necessary when users uncheck and recheck a box.
I do not know in advance the set of tariff lengths, they will be extracted from the result set when the page is rendered. There could just be two (requiring two checkboxes), but possibly there could be 10 (requiring 10 checkboxes) - I only want to render a checkbox for each as needed.
So somehow I need to associate an int value with each checkbox, and then pass that int to a function that updates the list by removing all tariffs that match. I'm just not sure how to add the handler for the checkboxes and how to get the value for that particular box.
This is what I'm thinking:
// panel to hold boxes
private Panel contractLengthPanel = new HorizontalPanel();
textPanel2.add(contractLengthPanel);
// create a set of the terms, by looping the result set
Set<String> contractTerms = new HashSet<String>();
for(ElecTariff tariff : tariffs)
{
contractTerms.add(Integer.toString(tariff.getContractLength()));
}
// loop that set, creating a CheckBox for each value
for(String term : contractTerms)
{
CheckBox box = new CheckBox(term + " Months");
// set all boxes with the same name, and a unique id
box.getElement().setAttribute("name", "termBoxes");
box.getElement().setAttribute("id", "termBox" + term);
contractLengthPanel.add(box);
}
Now I'm not sure if I'm along the right lines here, but now I have each box as part of the same group (they have the same name) I would like to use that to add a handler that is called when a box is checked or unchecked, passing the box id (which contains the tariff length) to that function.
I hope this wasn't too confusingly written. Help appreciated.
There really is nothing like a "group of checkboxes" in HTML, and neither there is in GWT. There are kind of "groups of radiobuttons" though, but it's only about having their checked state mutually exclusive, it doesn't change anything to the way you work with them from code.
You have to listen to changes on each and every checkbox.
What you can do though is to use the same event handler for all your checkboxes; something like:
ValueChangeHandler<Boolean> handler = new ValueChangeHandler<Boolean>() {
#Override
public void onValueChange(ValueChangeEvent<Boolean> event) {
CheckBox box = (CheckBox) event.getSource();
String id = box.getFormValue();
boolean checked = box.getValue();
…
}
};
(note: I used getFormValue() rather than getElement().getId(); I believe it's a better choice: it's specifically made to associate a value with the checkbox)
I'm writing a plugin for TinyMCE, and I want to have ListBox B dependent on what's selected in Listbox A. I can make it so the initial selection in ListBox A fills ListBox B, but I cannot make a second selection, wipe ListBox B clean, and fill ListBox B with the new items.
I've tried using just Native ListBoxes and JQuery functions but JQuery can't find them on the page.
Thanks!
TinyMCE creates an iframe to hold the content it's editing, so the list boxes you're searching for are in there rather than in the main document. You can use the tinymce.get('editor_id').getDoc() function to retrieve the document from the iframe (see http://tinymce.ephox.com/documentation/api/index.html#class_tinymce.Editor.html-getDoc). If you target your standard JQuery functions on that document it should work.
Regards,
Adrian Sutton.
http://tinymce.ephox.com
Here is a workaround which works for me. My ListBox holds classnames (cssclass is a variable holding a simple string):
listbox = ed.controlManager.get('p_style'); // listboxname
if (typeof listbox == "undefined") return;
// after rendering, no new listbox elements can be entered -> workaround
if (listbox && listbox.isMenuRendered) {
listbox.menu.destroy();
listbox.isMenuRendered = false;
listbox.oldID = 0;
}
// class zu Listboxen hinzufügen
if (listbox)
listbox.add(cssclass, cssclass);