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

Limit item drop to a particular listbox

Thread ID:

Created:

Updated:

Platform:

Replies:

141092 Nov 23,2018 08:34 AM UTC Nov 26,2018 09:44 AM UTC ASP.NET MVC 1
loading
Tags: ListBox
Alis
Asked On November 23, 2018 08:34 AM UTC

I have the following code which allows item drag and drop between 2 listbox:

@Html.EJ().ListBox(inclusionId).Width("100%").Datasource(Model.Inclusions).ListBoxFields(incl => incl.Text("Label").Value("TypeOfInclusionId")).AllowDrag(true).AllowDrop(true).Enabled(true).EnablePersistence(true).ClientSideEvents(evt => evt.ItemDragStop("checkItem"))

@Html.EJ().ListBox(exclusionId).Width("100%").Datasource(Model.Exclusions).ListBoxFields(excl => excl.Text("Label").Value("TypeOfInclusionId")).AllowDrag(true).AllowDrop(true).Enabled(true).EnablePersistence(true).ClientSideEvents(evt => evt.ItemDragStop("checkItem"))

However, since I will have several listbox in my view, I need to restrict the drag and drop of an item.  For example, allow drag and drop from the inclusion listbox to its 'paired' exclusion listbox and not to another inclusion listbox.

I have tried the ItemDragStop event, but this give me the event when the item of a listbox is dragged.

Is there any other way where I can do the above?  Like allow drag and drop only between a set of inclusion and exclusion listbox?




Deepa Loganathan [Syncfusion]
Replied On November 26, 2018 09:44 AM UTC

Hi Alis,  
 
Thanks for contacting Syncufsion support.  
 
Currently we do not have support to pair between two listbox control in the drag drop action.  
 
Also as mentioned, you can achieve this by using the itemDragStop event by checking the target of Drop action as given in the below code.  
 
 
function onDragStop1(args) { 
 
        // you can also use  args.target.parentElement.id to find the  id 
 
        if ($($(args.target).find("ul")[0]).attr("id") != "Exclusions") // take the item dropped target id and then restrict it being dropped like this 
 
            args.cancel = true; 
 
    } 
 
 
 
 
Please find the Sample in the below link. 
 
 
Kindly get back to us if you have any further queries. 
 
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