Issue creating a new refined list in a listbox

[Dale_]

Hi,

I have created a table using the following code from "ScriptUI for Dummies".

entry.onChanging = function ()
{
var temp = entry.text,
tempArray = [];
for (var i = 0; i < array.length; i++)
if (array.toLowerCase().indexOf (temp) == 0)
tempArray.push (array);
if (tempArray.length > 0)
{
// Create the new list with the same bounds as the one it will replace
tempList = w.add ("listbox", list.bounds, tempArray, {scrolling: true});
w.remove(list);
list = tempList;
list.selection = 0;
}
} // entry.onChanging

It works in CC2014, but in CC2017 it seems to mess up as soon as I change the edittext box.

From what I can see, the issue is on line 11 (above), where list.bounds seems to cause an issue, however I also believe the issue may be elsewhere.

Am I missing something?

Thanks in advance for your help.

[Chuck Uebele]

When you remove the listbox items, you have to replace them in the listbox, not just the array. Here's an example:

#target photoshop
var dlg = new Window('dialog','listbox text')
var list = ['one','two','three']//original list
var list2 = ['four','five','six']//new list
dlg.btn = dlg.add('button',undefined,'reset')
dlg.listBx = dlg.add('listbox',undefined,list,{numberOfColumns: 1});
dlg.btn.onClick = function(){
    dlg.listBx.removeAll();
    for(var i=0;i<list2.length;i++){
        dlg.listBx.add('item',list2)//adds the array items back to the listbox
        }
    }
dlg.show()

[Dale_]

Hi Chuck,

That replaces the list. I want to update the list with items I have.

So for example. When I type "Ma" - it will only show options that start with "ma"

My end goal is to create a listbox that will list a large number of items that I can search easily with an edittext search bar.

Would that be possible in CC2017?

[Chuck Uebele]

That would be the same sort of thing. You would have to use the text box, then loop through your original array doing a search for entries that match, push those to your temp array, then replace each item as I showed. You will want to leave the original array untouched, so that you could reset the listbox.

[Dale_]

Cheers Chuck, I am afraid I am not very comfortable with Javascript yet. I am primarily a retoucher.

Would you mind giving me an example that includes an 'edittext' search bar so I can see it in action.

I have tried changing a few things to follow your example, but I am not having any luck.

[Dale_]

Here is a sample of my code:

The actual code is much longer, so I have cleaned it to just show the important areas

#target Photoshop
picked = type_ahead ([ 'Apple','Apricot','Avocado','Banana','Bilberry','Blackberry','Blackcurrant','Blueberry','Boysenberry','Currant','Cherry','Cherimoya','Cloudberry','Coconut','Cranberry','Cucumber','Custard apple','Damson','Date','Durian','Elderberry','Feijoa','Goji berry','Gooseberry','Raisin','Guava','Honeyberry'
,'Huckleberry','Jabuticaba','Jackfruit','Jambul','Jujube','Juniper berry','Kiwifruit','Kumquat','Lemon','Loquat','Longan','Lychee','Mango','Marionberry','Melon','Cantaloupe','Honeydew','Watermelon','Mulberry','Nectarine','Nance','Olive','Orange','Blood orange','Clementine'
,'Mandarine','Tangerine','Papaya','Peach','Pear','Physalis','Plantain','Plum','Prune','Pineapple','Plumcot','Pomegranate','Pomelo','Quince','Raspberry','Salmonberry','Redcurrant','Salal berry','Salak','Soursop','Star fruit','Solanum quitoense','Strawberry','Tamarillo','Tamarind','Ugli fruit'
,'Yuzu']);
function type_ahead (fruits) {
var w = new Window ('dialog {text: "fruits", alignChildren: "fill"}', undefined, undefined, {closeButton: true});
var entry = w.add ('edittext {active: true}')
var list = w.add ('listbox', [0, 0, 120, 500], fruits);
list.selection = 0;
entry.onChanging = function () {
// entry changing logs fine
var temp = this.text,
tempArray = [];
for (var i = 0; i < fruits.length; i++) {
if (fruits.toLowerCase().search (temp) == 0) {
tempArray.push (fruits);
// upper and lower case changes log fine
} //lowercase
else if (fruits.toUpperCase().search (temp) == 0) {
tempArray.push (fruits);
} //uppercase
if (tempArray.length > 0)
{
var tempList = w.add ('listbox', list.bounds, tempArray);
w.remove(list);
list = tempList;
list.selection = 0;
} // templlist
} //for
}// entry.onChanging = function () {
ListItem.add
var btn = w.add ('button', undefined, 'OK', {name: 'ok'})
list.onDoubleClick=function(){
if (list.selected){
// do something here
} //if (list.selected){
w.close();
}// list.onDoubleClick=function(){
if (w.show () != 2){
     var clicked = list.selection.text
alert(clicked);
} // if (w.show () != 2){
w.close();
} //function type_ahead (fruits) {

Many Thanks in advance!

[Chuck Uebele · Accepted solution]

I adapted your code and my code to a new example. I still used your part where you search the original array and push that info into the tempArray. But rather than replacing the listbox, I just removed it's items and replaced them with the ones in the tempArray.

#target photoshop
var w = new Window('dialog','listbox text')
var list = ['one','two','three']
var list2 = ['four','five','six']
var entry = w.add('edittext',undefined,'');
entry.size = [200,20];
w.listBx = w.add('listbox',undefined,list,{numberOfColumns: 1,scrolling: true});
entry.onChanging = function ()  
{  
var temp = entry.text,  
tempArray = [];  
for (var i = 0; i < list.length; i++)  
if (list.toLowerCase().indexOf (temp) == 0)  
tempArray.push (list);  
if (tempArray.length > 0)  
{  
// Create the new listBx with the same bounds as the one it will replace  
w.listBx.removeAll()
for (var i=0;i<tempArray.length;i++){
    w.listBx.add('item',tempArray)
    }
w.listBx.selection = 0;
}  
} // entry.onChanging
w.show()

[Dale_]

Many thanks Chuck, this worked.

[Chuck Uebele]

Good!