Combox with Check Box cutting off list in textbox

9 posts, 0 answers
  1. Eric
    Eric avatar
    1 posts
    Member since:
    Mar 2012

    Posted 24 Jul 2014 Link to this post

    We have a ComboBox that has checkbox set to true.  As the user checks the different items it shows them comma deliminated in the text box.  When the list is to large it changes to the number checked.  The issue we are having is it seems that it does not relate to the size the of box.  At times it will cutoff part of the list before it switches to the number checked, other times if the item selected is short and there is no space in the box it does not switch to number checked until you select another item.

    We have a custom skin and did not know if there was a css that needed to be changed.  It appears that the space taken up with the text and the available space int eh combobox are not the same the the text thinks there is more space than the box. 
  2. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 25 Jul 2014 in reply to Eric Link to this post

    Hi Eric,

    Unfortunately I couldn't replicate the issue at my end. Please try to replicate the issue in this online demo or provide a sample project for further help.

    Thanks,
    Princy.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Frank
    Frank avatar
    86 posts
    Member since:
    Mar 2012

    Posted 25 Jul 2014 in reply to Princy Link to this post

    on the page in the drop down select Biographies, Children's Books,Cooking, History.   You will see that the text in the textbox area cuts off History at the o.
  5. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 28 Jul 2014 in reply to Frank Link to this post

    Hi Frank,

    Try to attach the OnClientItemChecked event of RadComboBox and based on the checked items length set the text.

    JavaScript:
    function checkedItemCount(sender, args) {
        if (sender.get_checkedItems().length > 3) {
            sender.set_text(sender.get_checkedItems().length + " items checked");
        }
    }

    Thanks,
    Princy.
  6. Frank
    Frank avatar
    86 posts
    Member since:
    Mar 2012

    Posted 29 Jul 2014 in reply to Princy Link to this post

    This isn't really looking at the text, this is simply stating that after 3 items checked to change the text.  What if 6 items would fit in the box, or what id on the second check it is to long and would cut off the text in the box?
  7. Boyan Dimitrov
    Admin
    Boyan Dimitrov avatar
    1746 posts

    Posted 01 Aug 2014 Link to this post

    Hello,

    I tried the described scenario with the following items Biographies, Children's Books,Cooking, History and it works fine at my side. Here you can watch a video.


    Regards,
    Boyan Dimitrov
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  8. Frank
    Frank avatar
    86 posts
    Member since:
    Mar 2012

    Posted 01 Aug 2014 in reply to Boyan Dimitrov Link to this post

    I have made a recording from the demo site I you will see how the text gets cut off when the last is Mystery and then again when it is Children Books
  9. Boyan Dimitrov
    Admin
    Boyan Dimitrov avatar
    1746 posts

    Posted 06 Aug 2014 Link to this post

    Hello,

    Thank you for the provided video.

    Indeed in this case the Mystery item is a bit cut off and the last sign is hidden behind the drop down arrow. I would like to clarify that this is caused due to fact that the entire string length fits in the input but the drop down arrow in the Silk skin does have a bit different dimensions. In general at most one or two signs could be hidden since the drop down image is small as size. So there are two possible solutions for this case:
       1. To limit the number of possible checked items as Princy suggested in one of the previous responses.
        2. To limit the RadComboBox text value length as shown in the code snippet below:
    //JavaScript
    function checkedItemCount(sender, args) {
        if (sender.get_text().length > 48) {
            sender.set_text(sender.get_checkedItems().length + " items checked");
        }
    }

    Please note that this function is the RadComboBox OnClientItemChecked  event handler.

    Regards,
    Boyan Dimitrov
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  10. Frank
    Frank avatar
    86 posts
    Member since:
    Mar 2012

    Posted 06 Aug 2014 Link to this post

    Cool that works perfectly.  I had figured it was something to do with the skin.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017