Hey guys! I have a dijit.form.ComboBox that needs have value checking applied against it.
Specifically the box is below...
<input dojoType="dijit.form.ComboBox"
store="xvarStore"
value="[% xv %]"
searchAttr="name"
name="xvar_names_[% section_count %]_arg_[% loop.count %]"
id="xvar_names_[% section_count %]_arg_[% loop.count %]"
/>
the [% ..... %] stuff are values from Template Toolkit.
Anywho, the point of a ComboBox of course is that you can select a value or put your own in and that functionality I am not looking to change. What I do need to do is pop up or somehow nag someone if they put a value in that not in the list.
Anyone have a clue how I might do this. I thought about an onBlur event but I'm still a little mystified.
Any pointers in the right direction would be appreciated.
Janie
If you want to require that the user enter a value that is in the list, then you probably want FilteringSelect, not ComboBox. FilteringSelect does exactly this.
http://dojotoolkit.org/reference-guide/dijit/form/FilteringSelect.html
I've contrasted these two widgets in a blog post:
http://kennethfranqueiro.com/2010/06/combobox-vs-filteringselect/
The documentation for dijit.form.ComboBox is probably the best place to start, but you have the right idea. The onChange or onBlur events seem the most appropriate, but you could also write a custom validate function that would nag the user if values weren't in the list.
Related
I finally managed to get my events out of the google calendar, but a executive decission was made and it was to switch the list of events around so that the last event is first on-screen. I think that the easiest way would be to change the optParams 'orderBy' to something other than startTime. So that it arrieves in descending order instead. But I have no idea how to alter this, so thats why I am here. If anyone have a way to flip the gianorums array around, then that is fine too.
It might be a bit too little to work with, but if you have done this before, you might know what I mean. Otherwise, please just leave it.
Possible late, but my coarse of action with objects and displaying results is to have an array in between. In this case I would use
$eventList = $service->events->listEvents($calendar->getId() , $optParams);
then I would use this:
foreach($eventList->getItems() as $event) {
$eventArray[]=$event->getSummary();
}
And then this:
$reverseEventArray = array_reverse($eventArray, false);
I have a ItemSelector component inside a Window. I have implemented a search functionality that dynamically finds the matching entry based on user's keyboard input.
Now I just want to highlight/focus such item inside the ItemSelector.
I'm looking for something like:
// when the search returned a result and got the related index in the store
function onSearchPerformed(index) {
var cmp = this;
cmp.itemSelector.setSelected(index); // here I'd be highlighting the entry
}
Example
Imagine a simple ItemSelector like this one taken from the web.
User types 'Delaw' and my search function detects that there is an entry with name Delaware and it's at position 3 in the store.
All I want to do is to programmatically highlight the row/entry 'Delaware' just as if you clicked on it.
This ux component uses a boundList, or better 2 of them.
A from and a toList.
You need to get a reference to the right boundlist.
More on that you will find here: http://docs.sencha.com/extjs/6.0.1/classic/src/ItemSelector.js.html
Basically you can do something like this:
https://fiddle.sencha.com/#view/editor&fiddle/24ec
afterrender: function(cmp){
Ext.defer(function(){
var boundlist = cmp.down('boundlist');
item = boundlist.all.item(1);
boundlist.highlightItem(item);
},300);
}
After you have a ref to the correct boundlist, you can simply highlight the item using:
http://docs.sencha.com/extjs/6.0.1/classic/Ext.view.BoundList.html#method-highlightItem
Take care that you may need to call following function before:
http://docs.sencha.com/extjs/6.0.1/classic/Ext.view.BoundList.html#method-clearHighlight
To find the correct item should't be too hard.
There are two ways to solve the issue
One is by following #devbnz answer, marked as correct. This is preferable, if you just want to graphically highlight the entry without triggering any event.
However, by hovering on other entries, you will lose the highlight on your current entry.
The second one, as suggested by #guilherme-lopes in the comments, may be preferable in cases in which you want the selection to act as if you actually clicked on an entry, which will trigger the selectionchange event and similar...
Depending on the situation, I ended up using either.
I have a combobox with values being populated from a managed bean like so:
keywordlist.setConnDB("jdbc:sqlserver://xx.xx.x.xx:1433;DatabaseName=xxx");
keywordlist.setConnUserName("xxx");
keywordlist.setConnPassword("xxx");
keywordlist.setSQLQuery("SELECT DisplayText as Keyword From Glossary WHERE SUBSTRING(DisplayText, 1, 2)= 'RV'");
keywordlist.keywords;
I'd like to be able to set the default to '--- Select ---', but no matter what I do the keyword list always picks the first of the returned keywords as the default.
Any assistance would be much appreciated.
Thanks,
Dan
Add another value pair (on first position), type "formula item" with the following SSJS return value:
"-- Select --|"
Notice the pipe!
That should display this at first position and should also be defaulted as "empty" is the default value. If not, set the "alias" (the value after the pipe) to something that you can define as default value porperty for the combo item.
It might be because you're binding to the bean directly. You might have to add that value to your keyword list itself. I think I have an example of this in a NotesIn9 show: http://notesin9.com/index.php/2014/03/13/notesin9-138-xpages-combobox-improvements/
I'm not sure. If I don't have a default in the java code you can probably see how it might be done.
Try that. If that doesn't work at all then maybe you don't bind the combo box to the bean directly. Maybe bind it to a viewScope var... since that can be anything it'll take a blank... then you just need to move the viewScope var value back up to your bean in the onChange event or something.
Just a quick thought...
Basically, the following pattern could be a start point for such a combobox:
<xp:comboBox
id="comboBox1"
defaultValue=""
value="#{document1.someField}">
<xp:selectItem
itemLabel="--- Select ---"
itemValue=""></xp:selectItem>
<xp:selectItems>
<xp:this.value><![CDATA[#{javascript:
// Your SSJS code...
// Should return some kind of list...
return items;
}]]></xp:this.value>
</xp:selectItems>
</xp:comboBox>
Alternatively, you can grab the keyword values from a Java bean:
<xp:selectItems value=#{yourBean.yourValue}></xp:selectItems>
Still, it's important to return a list value. It might also have "label|value" format.
Inside my itemSelector's value config, I have set the values like so:
value:["A","B","C"]
A,B, and C are mandatory and thus cannot be deselected. How do I stop these values from being deselected?
Thanks
You can capture the beforedeselect event and return false for these items. It would help people answer question more appropriately if you post your code here.
I've been puzzling over the tabIndex config for ExtJS's Ext.form.field.Base (generic field, in other words). I didn't find much information in the documentation (but then maybe I looked in the wrong place), so I went with trial and error and here's how I understand it now.
Fields where tabIndex is set explicitly with an integer value strictly greater than 0 are ordered by ascending tabIndex. If several fields have been set with the same tabIndex value, they are sub-ordered by creation: the first field created goes first and so on.
Fields where tabIndex is set explicitly with 0, or where tabIndex is not set explicitly, go next, with the same sub-order by creation.
Fields where tabIndex is set exlicitly with an integer value strictly lesser than 0 are out of the order: you cannot reach them with Tab.
(I'll admit that I didn't try to set tabIndex with non-integer values.)
Can someone confirm that this is the way it works, or better yet, point out mistakes or omissions in the above, please ?
The nice folks at sencha have confirmed it : http://www.sencha.com/forum/showthread.php?250586-Can-someone-please-confirm-tabIndex-behavior-with-Ext.form.field.Base&p=918558#post918558
They also pointed out that it was the same in HTML, which is quite right but I had had no inkling of it. Silly me. Well, I hope someone else will find this useful.