11 Replies Latest reply on Nov 28, 2011 4:34 AM by siteburn

    InplaceSelect filter

    Tomislav Tkal?evi? Novice

      Is there a possibility to implement filter on this component.
      To enable manual input of some text in input text to filter the select items data.

      That would be very useful because standard HTML select has a basic filter on first word of the select item.

      Rich combo box can filter data but also provides you a possibility to enter
      data that you want, data that is not in its select item list.

      So my question is:
      Is there a possibility, to use text filter with inplace select component on its list of select items?

        • 1. Re: InplaceSelect filter
          Ilya Shaikovsky Master

          you mean to combine the combobox with select functionality? No it not possible out-of-the-box.

          • 2. Re: InplaceSelect filter
            Ilya Shaikovsky Master

            comboBox is just input component with suggestions and inplaceSelect is just select component

            • 3. Re: InplaceSelect filter
              Tomislav Tkal?evi? Novice

               

              "ilya_shaikovsky" wrote:
              comboBox is just input component with suggestions and inplaceSelect is just select component


              I know.
              Thanks on response Iya.
              I have a list of select items which is big enough, and in it one of those items must be selected.

              There comes inplaceSelect, but again that component doesn't have ANY
              filter, not even on FIRST letter of the select item value.

              Could that be added to the component in future releases, some kind of filter string??



              • 4. Re: InplaceSelect filter
                Nick Belaevski Master

                Hello,

                Can you please clarify: are you asking about quick keyboard search feature as in standard SELECT element or do you want full-featured filtering?

                • 5. Re: InplaceSelect filter
                  Tomislav Tkal?evi? Novice

                   

                  "nbelaevski" wrote:
                  Hello,

                  Can you please clarify: are you asking about quick keyboard search feature as in standard SELECT element or do you want full-featured filtering?


                  Hy.
                  Any kind of filtering...
                  But if you will do the work already, it would be better to implement a full-featured filtering because of the reason to go ahead of the standard SELECT element filtering...

                  • 6. Re: InplaceSelect filter
                    Ilya Shaikovsky Master

                    I still not sure that quite understand how should it work.. It seems for me that you could reuse suggestion box for your selects. It could works better for huge suggestion lists.

                    • 7. Re: InplaceSelect filter
                      Tomislav Tkal?evi? Novice

                       

                      "ilya_shaikovsky" wrote:
                      I still not sure that quite understand how should it work.. It seems for me that you could reuse suggestion box for your selects. It could works better for huge suggestion lists.


                      In a select list like this http://img206.imageshack.us/img206/3698/screenshotfo2.png value which is selected must be from list or nothing,
                      not some dummy text that you could enter through combo box, or suggestion box!
                      They suggest you, ok, but allowing you to enter any data that could finish in the model or the backing bean, data which is not from the select item list value.

                      inplaceSelect:
                      -filtering
                      -data is from the select list or nothing if filtering is enabled

                      For my work ordinary HTML SELECT element which is rendered is ok,
                      it implements that prevent feature that i need but has poor filtering.

                      Your component looks better but has no filtering at all on keypress event of the keyboard when is selected...

                      I hope that you know what am I trying to say to you Iya...







                      • 8. Re: InplaceSelect filter
                        Ilya Shaikovsky Master

                        so.. seems we could agreed that there we talking about keyboard search in select feature(like in select). If so feel free to create an RFC for this one in our jira.

                        I just can't imagine clear how to allow real characters input(for "real" filtering) in this component and prevent dummy text submit. So standard selects search seems more simple and standard way.

                        • 9. Re: InplaceSelect filter
                          Tomislav Tkal?evi? Novice

                           

                          "ilya_shaikovsky" wrote:
                          so.. seems we could agreed that there we talking about keyboard search in select feature(like in select). If so feel free to create an RFC for this one in our jira.

                          I just can't imagine clear how to allow real characters input(for "real" filtering) in this component and prevent dummy text submit. So standard selects search seems more simple and standard way.


                          Ok, thank you!

                          Jira reference is here:
                          https://jira.jboss.org/jira/browse/RF-5839


                          • 10. Re: InplaceSelect filter
                            Enzo Pierfelice Newbie

                            function

                             

                            rich_inplaceSelect_keydown(inplaceEle){

                             

                            //alert(alonso);

                             

                            if(!inplaceEle.component)return true;

                             

                            var inplaceS = inplaceEle.component;

                             

                            var itemsList = inplaceS.comboList.getItems();

                             

                            if(!itemsList.length || itemsList.length == 0) return true;

                             

                            if((event.keyCode >= 48 && event.keyCode <= 90) || (event.keyCode >= 96 && event.keyCode <= 111) || event.keyCode == 32){

                             

                            var startIndex = (inplaceS.comboList.activeItem) ? inplaceS.comboList.activeItem.value*1 + 1: 0;

                             

                            if(startIndex == 0 && inplaceS.getValue() != null){

                            startIndex = inplaceS.getValue()*1 + 1;

                            }

                             

                             

                            var i = 0;

                             

                             

                            for(i = startIndex; i < itemsList.length; i++){

                             

                            if(itemsList[i].innerText.charAt(0).toLowerCase() == String.fromCharCode(event.keyCode).toLowerCase()){

                            inplaceS.comboList.doActiveItem(itemsList[i]);

                            inplaceS.comboList.scrollingUpToItem(itemsList[i]);

                             

                            return true;

                            }

                            }

                             

                            for(i = 0; i < itemsList.length; i++){

                             

                            if(itemsList[i].innerText.charAt(0).toLowerCase() == String.fromCharCode(event.keyCode).toLowerCase()){

                            inplaceS.comboList.doActiveItem(itemsList[i]);

                            inplaceS.comboList.scrollingUpToItem(itemsList[i]);

                             

                            return true;

                            }

                            }

                            }

                             

                            return true;

                            }

                             

                             

                            ....

                            <

                             

                             

                            rich:inplaceSelect ... onkeydown="rich_inplaceSelect_keydown(this);"

                            >

                            • 11. Re: InplaceSelect filter
                              siteburn Newbie

                              The above script is only working for internet explorer and i modified this for ie and firefox. Thanks to Enzo

                               

                              function rich_inplaceSelect_keydown(inplaceEle, e) {

                               

                                  var myKey;

                                 

                                  //condition IE/Firefox

                                  if (!e) {

                                      myKey = window.event;

                                  } else {

                                      myKey = e.keyCode;

                                  }

                                 

                                  if (!inplaceEle.component) {

                                      return true;

                                  }

                                     

                                  var inplaceS = inplaceEle.component;

                                  var itemsList = inplaceS.comboList.getItems();

                                  if (!itemsList.length || itemsList.length == 0) {

                                      return true;

                                  }

                                     

                                  if ((myKey >= 48 && myKey <= 90)

                                          || (myKey >= 96 && myKey <= 111)

                                          || myKey == 32) {

                                      var startIndex = (inplaceS.comboList.activeItem) ? inplaceS.comboList.activeItem.value * 1 + 1

                                              : 0;

                                      if (startIndex == 0 && inplaceS.getValue() != null) {

                                          startIndex = inplaceS.getValue() * 1 + 1;

                                      }

                                      var i = 0;

                                     

                                      //condition - innerText ist not available at Firefox (textContent)

                                      if (document.all) {

                                          for (i = startIndex; i < itemsList.length; i++) {

                                              if (itemsList[i].innerText.charAt(0).toLowerCase() == String

                                                      .fromCharCode(myKey).toLowerCase()) {

                                                  inplaceS.comboList.doActiveItem(itemsList[i]);

                                                  inplaceS.comboList.scrollingUpToItem(itemsList[i]);

                                                  return true;

                                              }

                                          }

                                      } else {

                                          for (i = startIndex; i < itemsList.length; i++) {

                                              if (itemsList[i].textContent.charAt(0).toLowerCase() == String

                                                      .fromCharCode(myKey).toLowerCase()) {

                                                  inplaceS.comboList.doActiveItem(itemsList[i]);

                                                  inplaceS.comboList.scrollingUpToItem(itemsList[i]);

                                                  return true;

                                              }

                                          }

                                      }

                                     

                                    //condition - innerText ist not available at Firefox (textContent)

                                      if (document.all) {

                                          for (i = 0; i < itemsList.length; i++) {

                                              if (itemsList[i].innerText.charAt(0).toLowerCase() == String

                                                      .fromCharCode(myKey).toLowerCase()) {

                                                  inplaceS.comboList.doActiveItem(itemsList[i]);

                                                  inplaceS.comboList.scrollingUpToItem(itemsList[i]);

                                                  return true;

                                              }

                                          }

                                      } else {

                                          for (i = 0; i < itemsList.length; i++) {

                                              if (itemsList[i].textContent.charAt(0).toLowerCase() == String

                                                      .fromCharCode(myKey).toLowerCase()) {

                                                  inplaceS.comboList.doActiveItem(itemsList[i]);

                                                  inplaceS.comboList.scrollingUpToItem(itemsList[i]);

                                                  return true;

                                              }

                                          }

                                      }

                                  }

                                  return true;

                              }