SELECT LSIT - search in select list with a lot of entries

  • Karlheinz68
  • Karlheinz68's Avatar Topic Author
  • Offline
  • Junior Boarder
  • Junior Boarder
  • Patron (Hero Patron)
  • Posts: 23
  • Thank you received: 2

Karlheinz68 created the topic: SELECT LSIT - search in select list with a lot of entries

is there a solution for my problem?

i have a select list with a lot of entries (> 300).

i need a comfortable solution for search in the select list. i think of a textfield, where i can make entries to restrict the selection in the select list.

when i choose in the select list, the cursor jump only to the letter with the word beginn ( i need also a search in the middle of the word or parts of the word) - (sorry for my school english - was in the 80 and 90 years)

see the picture -


thx for help.... :)
#238333
Attachments:
  • Posts: 3128
  • Karma: 105
  • Thank you received: 413

mihaela replied the topic: SELECT LSIT - search in select list with a lot of entries

Hello,

I have answered on the ServiceDesk ticket that you have created:

After some looking into this, I have come up with a quite simple solution.

Just do as follows.
Go to the Advanced properties of the "search" field and in the Actionscript section set Type to Custom.
Under Actions check the "Change" checkbox.
In the code area below that appeared, put the following code:

function ff_search_action(element, action)
{

jQuery('option').prop('hidden', false);
jQuery('option').not(jQuery('option:contains('+element.value+')')).prop('hidden', true);

} // ff_search_action

This should work as you wanted. In the select list, only options containing the string that was entered in the search field will be shown.
NOTE: The change in select list options based on the search field will be made after you click anywhere on the form.

Let me know whether you have managed to apply this to your form and whether this is working as you wanted.


We can continue our conversation through the ticket raised.

Regards,

Mihaela
#238341
The following user(s) said Thank You: Karlheinz68, Eddy.vh
  • Posts: 326
  • Karma: 2
  • Thank you received: 51

Eddy.vh replied the topic: SELECT LSIT - search in select list with a lot of entries

Hello Mihaela.

How to make the same thing work when you have several lists on the same form? How to target the search on a specific list?
#238344
  • Karlheinz68
  • Karlheinz68's Avatar Topic Author
  • Offline
  • Junior Boarder
  • Junior Boarder
  • Patron (Hero Patron)
  • Posts: 23
  • Thank you received: 2

Karlheinz68 replied the topic: SELECT LSIT - search in select list with a lot of entries

@mihaela
thank you very much - works absolutely fine -

is there a possibly that the select list is always "open" when i make an input in the textfield "search".

then can i see the choise directly in the select list

thanks again
#238345
  • Karlheinz68
  • Karlheinz68's Avatar Topic Author
  • Offline
  • Junior Boarder
  • Junior Boarder
  • Patron (Hero Patron)
  • Posts: 23
  • Thank you received: 2

Karlheinz68 replied the topic: SELECT LSIT - search in select list with a lot of entries

here is the example form

also works with insert the data from database

form pieces --> costum before form

$this->execPieceByName('ff_InitLib'); //Include BreezingForms Library
$db = JFactory::getDBO();//Get Database Object

//Create your own query here
$db->setQuery('Select FIELD From #__Database ');

$result = $db->loadColumn(); //load the result from the query
$test = "";
for ($i = 0; $i < count($result); $i++)
{
$test .= "0;".$result[$i].";".$result[$i]."\n";
}

function ff_setSelectList($name, $value)
{
global $ff_processor;
for ($r = 0; $r < $ff_processor->rowcount; $r++)
{
$row =& $ff_processor->rows[$r];
if ($row->name==$name)
$row->data2 = $value;
unset($row);
} // for
} // ff_setSelectList

ff_setSelectList('select1', $test);[
#238347
Attachments:
  • Posts: 3128
  • Karma: 105
  • Thank you received: 413

mihaela replied the topic: SELECT LSIT - search in select list with a lot of entries

Hello,

Eddy, here is how you can target a specific select list only.
    jQuery('[name="ff_nm_selectlistname[]"] option').prop('hidden', false);
    jQuery('[name="ff_nm_selectlistname[]"] option').not(jQuery('[name="ff_nm_selectlistname[]"] option:contains('+element.value+')')).prop('hidden', true);
NOTE: You have to replace selectlistname with the name of the select list element that you want to apply the search to.

Furthermore, here is the improved version of the code that will make the search case INSENSITIVE:
function ff_search_action(element, action)
{  
    jQuery('[name="ff_nm_selectlistname[]"] option').prop('hidden', false);
    jQuery('[name="ff_nm_selectlistname[]"] option').not(jQuery('[name="ff_nm_selectlistname[]"] option:icontains('+element.value+')')).prop('hidden', true);

} // ff_search_action

jQuery.expr[':'].icontains = function(a, i, m) {
  return jQuery(a).text().toUpperCase()
      .indexOf(m[3].toUpperCase()) >= 0;
};
Basically, a new selecteor is defined which finds strings that contain another string regardless of uppercase/lowercase.

@Karlheinz68 as I wrote on the ticket, there is a way to make the select list always "open". You can go to Properties of the select list element and check there the "Multiple" checkbox.
NOTE that this will allow the user to choose more options in that select list.

Let me know whether this helped.

Regards,

Mihaela
#238353
The following user(s) said Thank You: Eddy.vh
Moderators: ForumSupport
Time to create page: 0.051 seconds

We Are Doing Our Part

Massive discounts on all of our extension subscription plans to help you and your business in these times.

Get Your Subscription Here

New Icon Packs Category!

Crosstec is now offering icon packs.

If you are a paying subscriber, icon packs are automatically added to your account.

Check out our icon packs page!

News and Updates

Get informed about new downloads, updates and more in our News and Updates newsletter.

All Extensions Subscription

We are doing our part and support your business with extremely low prices -- For example 6-Months-Subscription for only $9 USD. For as long as necessary.

No support per domain or website installation limits! Includes all of our current and future Joomla!® extensions, Joomla!® templates for the duration of your membership. This means, by purchasing an All Extensions Subscription you'll have it all covered!

Get it from here

3rd Party Discount - 25% Off

We help you to keep your costs under control. If you are a new member and purchased a form building tool from a different form vendor, then you'll get a 25% discount on our subscription plans.

How to receive the discount:

Send us a quick email to sales@crosstec.org with a proof of purchase (for example a paypal receipt), await payment instructions and enjoy your membership!