0

i developed drag and drop element in fiddle but there is one problem i don't knoew how to disguise it by parent element

I have common jQuery function and two div tags. Both div tags have different names but both containing elements of identical ids and classes now i want to use this common Jquery function for them both? I have implemented common function but it's not working for both.

here is my fiddle jsfiddle.net/Er2Ef/9/ in my fiddle you can see that there is two div newdiv and newdiv2 they conduct identical element which have same class and id but i want some amd same shopping cart so my problem is that if i pick post 3 then post1 element also blink and same things for post2 and post4 so how can i code that allows only parent element to put and blink at particular place?? some body please help me here is my problem image problem image

hiren panchal
  • 289
  • 1
  • 3
  • 15
  • "same class and id" same ID ?? You must not have differents elements having the same ID. – TCHdvlp Dec 16 '13 at 09:31
  • but in my jquery i am using the class so i think it not matter – hiren panchal Dec 16 '13 at 09:36
  • post1/post3 have same classes, post2/post4 have same classes. and your Account droppable area are the same. In addition to `$(".shoppingCart ol").droppable({... accept:'.credit1',` I'd add an other criteria on something like `topPosts` and `bottomPosts` – TCHdvlp Dec 16 '13 at 09:39
  • can you explain me it on fiddle if you have time? – hiren panchal Dec 16 '13 at 09:44
  • Your document seems to be completely broken. You have a master div having class `products`. In this div, you have a table, of one row, one cell (why using a table ??) containing an other div of class `products`, containing an other table of one cell etc... But, you use this class as a selector in your jQuery code `$(".products li").draggable({`. I can spend a little time to help you but I think you'd better clean your code first. For you ! – TCHdvlp Dec 16 '13 at 09:53
  • for your little information bro in this case i have two exrcise http://jsfiddle.net/Er2Ef/10/ http://jsfiddle.net/Er2Ef/11/ and i have common js file for above two exrcise and i am going to run this exrcise on one html page that is seems like this fiddle http://jsfiddle.net/Er2Ef/9/ so how can i run this two ercise in one page and my real problem is in this image http://screencast.com/t/Vimi7Zjb2lkc i dont want to blink and accept the value which are not related to element hope you will help me soon – hiren panchal Dec 16 '13 at 10:03
  • let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/43247/discussion-between-tchdvlp-and-hiren-panchal) – TCHdvlp Dec 16 '13 at 10:31

1 Answers1

0

In this fiddle, I have just modifyed the binding between posts and droppable area using unique IDs. For more readability, a function makes the binding and is called for each pair post/drop

    function attachPostToBank(i){
        var bankable = "bank"+i;
        $("#"+bankable).droppable({ ...

http://jsfiddle.net/TCHdevlp/Er2Ef/12/

TCHdvlp
  • 1,334
  • 1
  • 9
  • 15
  • can you do this without modify ids because i has to change it for many exercise if you can then please help me – hiren panchal Dec 16 '13 at 11:55
  • I saw you used `data-id`. You can of course use these data to match an element, in the `attachPostToBank` function, instead of `accept:'#'+i,` you can replace by `accept : "[data-id='"+i+"']",` – TCHdvlp Dec 16 '13 at 12:02