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. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Enable/Disable items

Thread ID:

Created:

Updated:

Platform:

Replies:

143434 Mar 20,2019 08:51 AM UTC Mar 26,2019 05:49 AM UTC ASP.NET MVC 3
loading
Tags: ListView
sateesh kumar
Asked On March 20, 2019 08:51 AM UTC

Hi Team,

Am using Lisv view  and assign the data source in java script.
in java script am trying for, list items should be checked and disable.

i need to enable/ disable the total list items and particular item also.

Here is my code,

@Html.EJ().ListView("list").ShowHeader(true).HeaderTitle("Meida").EnableCheckMark(true).ClientSideEvents(e => e.MouseUp("btnState"))

  promise.done(function (e) {
 $("#list").ejListView({
                dataSource: e.result,
                fieldSettings: { "text": "Name", "id": "Id", "checked": "true", "deactive": "true", "disableItem": "true" },
                option: { "enableAjax": "false" }
                })
}

Thanks for the advance

Silambarasan I [Syncfusion]
Replied On March 21, 2019 10:49 AM UTC

Hi Sai, 
 
Thank you for contacting Syncfusion support. 
 
We have looked into your query with EJ ListView. We suggest you to check out the below properties available in the ListView to achieve your requirement of enable/disable li elements and check/ uncheck items in the ListView. 
 
  • checkedIndices - Set the index values to be selected on initial loading. This works only when enableCheckMark is set true.
 
 
 
  • checkItem() – check specific item in the ListView control.
 
  • unCheckItem() – un check specific item from the ListView control.
 
Please refer the below code sample that demonstrate your requirement. You can also disable items on initialization by adding class e-disable to any dataSource object as depicted in the below code sample. 
 
@{IDictionary<string, object> datepickerHtmlAttribute = new Dictionary<string, object>(); 
    dataHtmlAttribute.Add("class", "e-disable"); 
} 
 
@Html.EJ().ListView("checklist").ShowHeader(false).EnableCheckMark(true).Items(items => 
{ 
    items.Add().Text("Artwork").Checked(true).HtmlAttributes(dataHtmlAttribute); 
    items.Add().Text("Abstract"); 
    items.Add().Text("2 Acrylic Mediums").Checked(true).HtmlAttributes(datepickerHtmlAttribute); 
    items.Add().Text("Creative Acrylic"); 
    items.Add().Text("Modern Painting"); 
    items.Add().Text("Canvas Art"); 
    items.Add().Text("Black white"); 
    items.Add().Text("Children"); 
}).ClientSideEvents(evt => evt.Create("onCompleteLoad")) 
 
<script> 
    function onCompleteLoad() { 
        var obj = $("#checklist").ejListView("instance"); 
        //obj.checkAllItem(); 
        //obj.option("checkedIndices", [2, 3]); 
        obj.disableItem(0) 
        obj.disableItem(1) 
        obj.enableItem(0); 
        obj.enableItem(1); 
    }; 
</script> 
 
 
Could you please check the above solution and get back to us if you need further assistance on this? 
 
Regards, 
Silambarasan 


sateesh kumar
Replied On March 25, 2019 11:52 AM UTC

Hi,

i was used disableItem true while assigning data source, why its not working.

@Html.EJ().ListView("list").ShowHeader(true).HeaderTitle("Meida").EnableCheckMark(true).ClientSideEvents(e => e.MouseUp("btnState"))

  promise.done(function (e) {
 $("#list").ejListView({
                dataSource: e.result,
                fieldSettings: { "text": "Name", "id": "Id", "checked": "true", "deactive": "true","disableItem": "true"
},
                option: { "enableAjax": "false" }
                })
}

now my script after adding one for loop enable/disable
 promise.done(function (e) {
 $("#list").ejListView({
                dataSource: e.result,
                fieldSettings: { "text": "Name", "id": "Id", "checked": "true", "deactive": "true", "disableItem": "true" },
                option: { "enableAjax": "false" }
                })
}

var ltype = //get result from other source false or true 


        var obj= $("#ist").ejListView("instance"); 
        for (var y = 0; y < obj.model.dataSource.length; y++) {

            if (ltype ) {
                obj.enableItem(y);}
            else {
                obj.disableItem(y);}
        } 

am able enable/disable listitems now with looping.
let me know ,is there any option to avoid the looping.
i want to enable all  or disable all with single condition. 

Thanks for the advance


Deepa Loganathan [Syncfusion]
Replied On March 26, 2019 05:49 AM UTC

Hi Sai,  
 
Instead of disabling the items, you could prevent the selection of items by using preventSelection API.  However, if you wish to disable the items, you would need to add “e-disable” class to the list items.  
 
Please find the code snippet for your reference.  
 
 
window.dbitem = 
    [{ text: "Discover Music" , preventSelection: true, attributes :[{"name": "class", value: "e-disable"}]}, 
      { text: "Sales and Events" }, 
      { text: "Categories" , preventSelection: true}, 
      { text: "MP3 Albums" }, 
      {text: "More in Music" }]; 
  $(function () { 
    $("#defaultlistbox").ejListView({showHeader: true, headerTitle: "Favorite", width:400, dataSource: dbitem, enableGroupList: false }); 
    $("[data-preventselection*=true]").addClass("e-disable"); 
   
  }); 
 
 
We have depicted it in the below sample. Please check it.  
 
 
We would like to let you know that we have developed a whole new set of next generation controls (EJ2) that is improvised in performance, made more modular with a lot more improvisations when compared to EJ1. We kindly suggest you look at our next generation controls.  
 
Also, your requirement could be easily achieved in EJ2 Listview by simply setting the attributes in Listitems.  
 
For your reference, we have prepared a sample with EJ2 Listview.  
 
 
Please check and let us know if you have any further queries or concerns.  
 
Regards,  
Deepa L. 


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.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

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

Live Chat Icon For mobile
Live Chat Icon