1

Hello I want to create multiple div which have connectivity with each other with a lines,While dragging those divs, connections(i.e: Lines) should drag accordingly with div (** I want same structure AS .edmx database file which shows in .net project**). **

I want This using Jquery only. Please Help me.

**

Swaraj
  • 79
  • 1
  • 8

1 Answers1

0

You can use Jsplumb Community Edition or Toolkit edition.

Pro-grammatically get your Entities/Models and add jsplumb widgets for each entitiy on the canvas with connections(lines).

They are very reliable with many addition functionality.

Additionally on Double-Clicking you can show the attrributes/paramenter of entities etc using Dialogs/overlay/popup.

You can also get different alternative for jsPlumb here

Update: Links to learn jsPlumb:

Fiddle 1

Fiddle 2

Can read this also: ExtJs

This one is good too Fiddle

Other than this read jsPlumb documentation and demos

Community
  • 1
  • 1
rhitz
  • 1,892
  • 2
  • 21
  • 26
  • Is there any other solution for that.?? – Swaraj Jan 07 '16 at 17:18
  • I am not aware of it, you can use jQuery UI drag and drop and make your own widget connections, but using a plugin like jsPlumb will be recommended. – rhitz Jan 08 '16 at 04:30
  • But JsPlumb is not free. And I want connection between multiple draggable divs – Swaraj Jan 08 '16 at 05:55
  • I am using jsPlumb community edition which is free and which has multiple draggable divs feature with path and you download from here https://jsplumbtoolkit.com/download or direct download link here: https://jsplumbtoolkit.com/lib/jsPlumb-2.0.5.js – rhitz Jan 08 '16 at 06:05
  • Rohit : Hey I download the community version, But I am new in jquery, would you please give me some example how to use this community version. (example: Please create 2 or 3 div and applied "ANGULAR INTEGRATION" Demo on those div please.) Thanks in Advance. Rohit – Swaraj Jan 08 '16 at 06:19