We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

how to display a message when it's empty

Thread ID:

Created:

Updated:

Platform:

Replies:

132286 Aug 24,2017 09:19 AM UTC Aug 28,2017 10:46 AM UTC JavaScript 3
loading
Tags: ejDropDownList
Luis Carlos
Asked On August 24, 2017 09:19 AM UTC

Hi.

When the ejDropdown is empty and I click on it, it doesn't show any message or action. I would like to show popup with a message, for instance, "there isn't any item" or "no items".


Image as is, when I click on it.


Image to be, when I click on it.

I hope you can support me, thanks in advance.

Regards, Luis Carlos.

Keerthana Rajendran [Syncfusion]
Replied On August 25, 2017 09:32 AM UTC

  
Hi Luis,   
   
Thank you for contacting Syncfusion support,   
   
We have prepared a sample based on your requirement. We have bound click event to DropDownList container and added “No Items”  to DropDownList if the datasource is empty. 
 
Please refer the below given link 
 
 
Regards,   
Keerthana.   
 


Luis Carlos
Replied On August 25, 2017 11:11 AM UTC

Hi again.

Thanks for your quick reply.

Unfortunately your solution doesn't work perfectly. I found two errors.

1º Error: The first time I run your sample, I need to click twice in order to show popup. The popup must show or hidden when I click only once.

2º Error: Once I insert any character into search input and then delete it, after that I can select the text "No Items" as you can see in the next image. This text mustn't be selected.

 

I hope you can support me as soon as possible, thanks again.

Regards, Luis Carlos.



Prince Oliver [Syncfusion]
Replied On August 28, 2017 10:46 AM UTC

Hi Luis, 

Thank you for your update. 

Query 1: The first time I run your sample, I need to click twice in order to show popup. The popup must show or hidden when I click only once. 

Response: You can use the showPopup method to show popup in the click function, once we have added the “No item” element. Kindly refer to the following code snippet. 

$("#skillsets_container").on('click',function(){ 
    var obj=$("#skillsets").data("ejDropDownList"); 
    if(obj.model.dataSource=="") 
    { 
        obj.popupListItems = noitem; 
        obj.ultag.empty(); 
        obj._isPlainType(obj.popupListItems) ? obj._plainArrayTypeBinding(noitem) : 
        obj._objectArrayTypeBinding(noitem, "search"); 
        if (obj.ultag.find("li").length == 1) { 
            obj.ultag.find("li").eq(0).addClass("e-disable"); 
        } 
        obj.inputSearch.attr("readonly",""); 
    }else{ 
        obj.inputSearch.removeAttr("readonly"); 
    } 
    obj.showPopup(); 
}); 

Query 2: Once I insert any character into search input and then delete it, after that I can select the text "No Items" as you can see in the next image. This text mustn't be selected. 

Response: We have modified the previous solution, instead of adding “No items” element using dataSource. We have directly added it to the popup list. so, if there are no items in the dataSource then you can make the search input to readonly.  

Kindly refer to the following playground sample: http://jsplayground.syncfusion.com/c3lx25qr 

Regards, 
Prince 


  


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;