Opened 19 years ago

Closed 13 years ago

#13 closed New feature (fixed)

Related objects interface should be tighter (edit_inline)

Reported by: Adrian Holovaty Owned by: barbuza
Component: contrib.admin Version: dev
Severity: Normal Keywords: nfa-someday nfa-changelist
Cc: cmlenz@…, gary.wilson@…, tom@…, django@…, brosner@…, tom85@…, dan.popovici@…, django@…, lnielsen@…, to, patrick.lauber@…, mpjung@…, django@…, remco@…, barbuzaster@…, flavio.curella@…, semente@…, stephane@…, Odin Hørthe Omdal, bas@…, mathijs@… Triage Stage: Accepted
Has patch: yes Needs documentation: no
Needs tests: no Patch needs improvement: yes
Easy pickings: no UI/UX: no

Description (last modified by Wilson Miner)

The admin interface for related objects and the ordering interface need some tighter integration.

Currently, anything that can be ordered goes in the right sidebar of the admin change form, with no relation to the actual input fields for those objects.

The adding, removing, editing and ordering of related objects should be tied together in one part of the form.

Specific areas for enhancement:

  • Adding related objects should be easier. Now you have to "save and continue" to get an extra set of fields to add a new related object. You should be able to click "add new object" to add another set of blank fields inline on the page.
  • Deleting related objects should be easier. Now you have to clear the "core fields" of a related object to delete it. You should be able to click "delete" to delete the object, or at least mark it for deletion when you click save on the main object.
  • Ordering of related objects should be clearly tied to editing those objects. Now the ordering interface is completely separate. You should be use the same list of objects to set the order (by dragging) or select that object for editing or deleting (by clicking).

Attachments (2)

inline-tabular.diff (11.8 KB ) - added by barbuza 16 years ago.
dynamic adding and ajax deleting for tabular mode. to enable, add js to Media class in ModelAdmin of your models
Water lilies.jpg (81.8 KB ) - added by anonymous 15 years ago.

Download all attachments as: .zip

Change History (94)

comment:1 by Adrian Holovaty, 19 years ago

Owner: changed from Adrian Holovaty to Wilson Miner

comment:2 by Wilson Miner, 19 years ago

Description: modified (diff)

comment:3 by Wilson Miner, 19 years ago

Here is a mockup of a proposed interface for related objects (edit_inline).

http://media.wilsonminer.com/images/django/related-objects-mock.gif

Proposed changes (implemented with JS/Ajax):

  • Adding objects: Clicking the "Add another..." link below the related objects would dynamically add a new row with blank fields.
  • Deleting objects: Clicking the "delete" icon next to each related object row would "mark" that object for deletion when you click save. The row would be grayed out, the fields would be disabled. The delete link would transform to a "restore" icon, which would remove that object from the deletion list and reactivate the fields.
  • Ordering objects: Clicking the row outside the field or button areas would allow the entire row to be dragged with a "move" cursor and dropped in a new position in the order.

Obviously, this is a long way from being implemented, and the heavy lifting will need to be done in the javascript, but this should give us a starting point.

comment:4 by Simon Willison, 19 years ago

That mockup is very sexy indeed. There needs to be a fallback for when JS isn't available - maybe just a text box with an "order-by-this-number" integer in it that gets hidden when the JS is loaded.

comment:5 by anonymous, 19 years ago

That's exactly what I was thinking re: ordering. There would be an integer field at the beginning of each row that would be hidden by the javascript.

I'm not sure what the fallback is for the delete behavior. As I described it, I think it would require some Ajax hooks to store a list of objects to be deleted on save. Maybe just maintain the "clear core fields to delete" method as a noscript fallback.

comment:6 by robert@…, 19 years ago

Surely the fallback can just do multiple "POST"s to the same url, and only the one from the submit button means "Save this object". This could be done with validation in the manipulator I think. (Maybe manipulators need to be expanded to include the state "editing, but not finished", as distinct from errors.)

Then a normal up/down image buttons fallback can be used.

comment:7 by anonymous, 19 years ago

Just let the Neanderthals that don't have JS enabled or have a really old browser use the current way of doing things. It's not like it's impossible to do, it's just harder. If you want easier, use a newer browser. Netscape 4 compatibility is too much hassle these days, and should have the lowest possible priority.

comment:8 by Wilson Miner, 19 years ago

Also, here's a mockup of how edit_inline STACKED would work. This is going to be a little more complicated to set up, but this is the basic idea. Drag and drop the rows to reorder. Click a row to select. The fields on the right would be populated with information for the the currently selected field.

http://media.wilsonminer.com/images/django/related-objects-stacked.gif

comment:9 by Jacob, 19 years ago

milestone: Version 1.1

comment:10 by Jason Huggins, 19 years ago

1) wilson, can you post a higher res copy of the "X" (delete) icon, so I can patch my own version of Django in the meantime?

2) Would you consider using code from http://script.aculo.us/ to handle the sorting?
There is a demo for sortable elements: http://script.aculo.us/demos/ajax/sortable_elements
Ignoring the "AJAX" part of it, and only looking at the JavaScript source code, it looks like it would be very easy to integrate.

comment:11 by jim-django@…, 18 years ago

Has there been any progress on this since september? The new admin is integrated now, and it looks like the javascript debate has settled on Dojo; is this still being worked on?

comment:12 by Jacob, 18 years ago

Owner: changed from Wilson Miner to Jacob
Status: newassigned

Indeed it is -- I've been hacking on this behind the scenes. Expect to see the results pretty soon.

comment:13 by Christopher Lenz <cmlenz@…>, 18 years ago

Cc: cmlenz@… added

comment:14 by hi-world cup, 18 years ago

Cc: hi-world cup added; cmlenz@… removed
Keywords: rthml tab space editor js added
Summary: Related objects interface should be tighterhi-world cup

comment:15 by Adrian Holovaty, 18 years ago

Summary: hi-world cupRelated objects interface should be tighter

comment:16 by Gary Wilson <gary.wilson@…>, 17 years ago

Cc: cmlenz@… gary.wilson@… added; hi-world cup removed

restored and added to cc.

comment:17 by Eugene, 17 years ago

Hi!
Great feature! I've just thinked of this!
Is it possible to use it now? What could be done to make this feature ready for use?

comment:18 by anonymous, 17 years ago

Cc: mhf@… added

comment:19 by starplant@…, 17 years ago

I would very like to see this implemented!

comment:20 by (none), 17 years ago

Milestone Version 1.1 deleted

comment:21 by Gary Wilson <gary.wilson@…>, 17 years ago

Keywords: rthml tab space editor js removed
Triage Stage: UnreviewedAccepted

Removed keyword spam. Marking this accepted since many people seem interested, and there aren't really any drawbacks.

comment:22 by taavi223@…, 17 years ago

I wanted to add that if you have 'max_num_in_admin' set to something for the related object then the JS should respect that value to that and not allow you to add more sets of fields once you reach that number. I bring this up, because in certain instances you want to only have one related object. One example that springs to mind are users and profiles, and although you don't have to worry about 2 profiles being saved for a single user (unique = True in the ForeignKey would throw a validation error), it would be rather confusing if the interface allowed you to have two forms but wouldn't let you save both of them.

Finally, I think that since we're working on this, we should have some way to quickly clear a related object's inline form (perhaps the delete option could double for this). If I have a long form and I fill in all the fields, then decide I don't want to add that related object, I'd have to manually go back clear all the core=True fields, which could be very time consuming, especially if the I don't know which ones they are. Just my 2¢.

comment:23 by Gary Wilson <gary.wilson@…>, 17 years ago

Keywords: edit_inline added
Summary: Related objects interface should be tighterRelated objects interface should be tighter (edit_inline)

Thomas Steinacher has posted a link in a comment in #3433 to some code on his web site (that uses the mootools JavaScript library) for adding of a new set of edit_inline fields, though I'm not positive that he gives Django the right to use it.

comment:24 by Thomas Steinacher <tom@…>, 17 years ago

Cc: tom@… added

Feel free to use my code in Django. Should I attach the code to this ticket? And it wouldn't be difficult to remove the mootools dependency, if you don't like it.

in reply to:  24 ; comment:25 by Gary Wilson <gary.wilson@…>, 17 years ago

Replying to Thomas Steinacher <tom@eggdrop.ch>:

Feel free to use my code in Django. Should I attach the code to this ticket? And it wouldn't be difficult to remove the mootools dependency, if you don't like it.

If you could create a patch to attach to the ticket, that would be very helpful. As far as the mootools dependency, I don't think the core developers want to couple Django to any specific JavaScript library.

in reply to:  25 comment:26 by Thomas Steinacher <tom@…>, 17 years ago

If you could create a patch to attach to the ticket, that would be very helpful. As far as the mootools dependency, I don't think the core developers want to couple Django to any specific JavaScript library.

Everything I could attach right now are the files that you can already download on my website (dynamicforms.py/js). But I don't have a patch against the Django admin application.

comment:27 by Florian Apolloner <florian@…>, 17 years ago

Cc: django@… added

comment:28 by brosner <brosner@…>, 17 years ago

Cc: brosner@… added

comment:29 by anonymous, 17 years ago

Cc: tom85@… added

comment:30 by anonymous, 17 years ago

Cc: oliver@… added

comment:31 by anonymous, 17 years ago

Component: Admin interfaceTranslations
Triage Stage: AcceptedDesign decision needed
Version: 0.96

comment:32 by Brian Rosner <brosner@…>, 17 years ago

Component: TranslationsAdmin interface
Triage Stage: Design decision neededAccepted
Version: 0.96newforms-admin

Reverting spam.

comment:33 by xuefeng8@…, 17 years ago

I would very like to see this implemented! 月餅

comment:34 by cammmm@…, 17 years ago

+1 for this feature. Can we get a status update? (I may be willing to code this myself)

comment:35 by anonymous, 17 years ago

Cc: dan.popovici@… added

in reply to:  34 comment:36 by James Bennett, 17 years ago

Replying to cammmm@gmail.com:

+1 for this feature. Can we get a status update? (I may be willing to code this myself)

It's being worked on as part of newforms-admin.

comment:37 by anonymous, 17 years ago

django is beautiful. compliments

comment:38 by anonymous, 16 years ago

Resolution: fixed
Status: assignedclosed

comment:39 by Brian Rosner, 16 years ago

Resolution: fixed
Status: closedreopened

This ticket is not fixed, but very close ;) Probably a bot of some sort.

comment:40 by James Wheare <django@…>, 16 years ago

Cc: django@… added

comment:41 by lnielsen, 16 years ago

Cc: lnielsen@… added

comment:42 by Brian Rosner, 16 years ago

Keywords: nfa-someday added; edit_inline removed

Tagging with nfa-someday as this is functionality that is not critical to the merge of the newforms-admin branch.

comment:43 by Patrick Lauber <patrick.lauber@…>, 16 years ago

Cc: patrick.lauber@… added

comment:44 by cecil, 16 years ago

Cc: oliver@… cmlenz@… gary.wilson@… mhf@… tom@… django@… brosner@… tom85@… dan.popovici@… django@… lnielsen@… patrick.lauber@… removed

Well,as you pointed in your story, it's difficult to find a way from this situation. I'm crossing fingers for everybody who is in this situation. Good Luck!

comment:45 by Patrick Lauber <patrick.lauber@…>, 16 years ago

Cc: oliver@… cmlenz@… gary.wilson@… mhf@… tom@… django@… brosner@… tom85@… dan.popovici@… django@… lnielsen@… to patrick.lauber@… added

comment:46 by jakub_vysoky, 16 years ago

Keywords: nfa-changelist added

comment:47 by anonymous, 16 years ago

cc changed from oliver@…, cmlenz@…, gary.wilson@…, mhf@…, tom@…, django@…, brosner@…, tom85@… to oliver@…, ouzze@yahoo.net, cmlenz@…, gary.wilson@…, mhf@…, tom@…, django@…, brosner@…, tom85@…, dan.popovici@….

comment:48 by anonymous, 16 years ago

cc changed from oliver@…, cmlenz@…, gary.wilson@…, mhf@…, tom@…, django@…, brosner@…, tom85@… to oliver@…, ouzze@…, servil@yahoo.com, cmlenz@…, gary.wilson@…, mhf@…, tom@…, django@…, brosner@…, tom85@…, dan.popovici@….

comment:49 by anonymous, 16 years ago

cc changed from oliver@…, cmlenz@…, gary.wilson@…, mhf@…, tom@…, django@…, brosner@…, tom85@… to oliver@…, ouzze@…, servil@yahoo.net!, cmlenz@…, gary.wilson@…, mhf@…, tom@…, django@…, brosner@…, tom85@…, dan.popovici@….

comment:50 by Michael P. Jung <mpjung@…>, 16 years ago

Cc: mpjung@… added

Very sexy interface mock up. :)

comment:51 by Julien Phalip, 16 years ago

Cc: django@… added

comment:52 by Remco Wendt, 16 years ago

Cc: remco@… added

comment:53 by mrts, 16 years ago

milestone: post-1.0

Marking as post-1.0 as it clearly is not in scope for 1.0.

comment:54 by barbuza, 16 years ago

Owner: changed from nobody to barbuza
Status: reopenednew

comment:55 by Alex Gaynor, 16 years ago

Version: newforms-adminSVN

comment:56 by barbuza, 16 years ago

Cc: barbuzaster@… added
Status: newassigned

by barbuza, 16 years ago

Attachment: inline-tabular.diff added

dynamic adding and ajax deleting for tabular mode. to enable, add js to Media class in ModelAdmin of your models

comment:57 by barbuza, 16 years ago

for STACKED editing, i think, we should use one of javascript libraries. there will be tons of work without one of them.

comment:58 by barbuza, 16 years ago

Patch needs improvement: set

comment:59 by Frank Malina, 16 years ago

I've tested the diff, you enclosed.

One other problem is that when a new empty line is added, it should automatically have a delete icon to remove the added node. It's needed in case user added more nodes than needed or intended.

There is no draggable, as Wilson proposed for sorting. Draggables are quite easy to do with JQuery and JQuery UI library. I guess JQquery is the favorite library amongst Django people and core developers, so it makes sense. There is some code that could be used: http://www.isocra.com/2008/02/table-drag-and-drop-jquery-plugin/

Frank http://vizualbod.com

comment:60 by anonymous, 16 years ago

I'm running latest django svn trunk and I've applied inline-tabular.diff patch.
I was getting a javascript syntax error and I've changed the 121 line in django/contrib/admin/media/js/admin/InlineObjectsTabular.js to:

xmlhttp.open('POST', "delete-inline/"+name+'/'+id+'/', true);

But I can't see any change in the admin forms.
What should I do?

Thanks in advance.

comment:61 by anonymous, 16 years ago

Cc: flavio.curella@… added

comment:62 by anonymous, 15 years ago

Resolution: fixed
Status: assignedclosed

comment:63 by anonymous, 15 years ago

a

comment:64 by anonymous, 15 years ago

Resolution: fixed
Status: closedreopened

comment:65 by Guilherme M. Gondim <semente@…>, 15 years ago

Cc: semente@… added

comment:66 by Patrick Kranzlmueller, 15 years ago

about a year ago, the status was "This ticket is not fixed, but very close ;)".
any updates on this?

comment:68 by anonymous, 15 years ago

Cc: stephane@… added

comment:69 by anonymous, 15 years ago

Resolution: fixed
Status: reopenedclosed

comment:70 by Florian Apolloner, 15 years ago

Resolution: fixed
Status: closedreopened

anonymous having fun?!

comment:71 by (none), 15 years ago

milestone: post-1.0

Milestone post-1.0 deleted

comment:72 by juriejan, 15 years ago

i'm looking at implementing this. anyone made any progress that i can possibly build upon? should i start a discussion on django-developers about this?

comment:73 by juriejan, 15 years ago

Cc: juriejanbotha@… added

comment:74 by Collin Anderson, 15 years ago

Correct me if I am wrong, but there are already some implementations out there using jQuery, and we just need to make our own implementation without requiring a library.

http://www.arnebrodowski.de/blog/507-Add-and-remove-Django-Admin-Inlines-with-JavaScript.html

http://www.djangosnippets.org/snippets/1053/ (Simon's Orderable inlines using drag and drop with jQuery UI)

comment:75 by juriejan, 15 years ago

That's the way it seems to me too. But I believe there is a whole discussion on using too much Javascript in the standard shipment of Django. It seems to me that this would be better suited for distribution as a separate application.

Let's continue the discussion at http://groups.google.co.za/group/django-developers/browse_thread/thread/50dd66128b2f486f

by anonymous, 15 years ago

Attachment: Water lilies.jpg added

comment:76 by anonymous, 15 years ago

"That's the way it seems to me too. But I believe there is a whole discussion on using too much Javascript in the standard shipment of Django. It seems to me that this would be better suited for distribution as a separate application. "

Well obviously django doesnt want to favor any js lib but on the other hand it would be rather stupid to reinvent the wheel. I guess this is why this issue is still open. Obiviously this is a bad circle. We want nice js and ajax bells and whistles but we dont want to favor any js lib (even if jquery is the best ;) the result? the admin will remain rigid. third party admins like http://code.google.com/p/sorl-curator/ will take over.

comment:77 by James Wheare, 15 years ago

Um, hate to break it to you but... the admin already is a contrib app so I'm not sure choosing a JS library would suggest any sort of core endorsement of a library. It's possible to get too shackled to ideals of impartiality sometimes. Occasionally you know... building things is good. :)

comment:78 by anonymous, 15 years ago

Not choosing a js lib just wastes human resource.

comment:79 by anonymous, 15 years ago

please, choose a js library

comment:80 by Odin Hørthe Omdal, 14 years ago

Cc: Odin Hørthe Omdal added

comment:81 by Smith, 14 years ago

test

comment:82 by Jannis Leidel, 14 years ago

(In [12297]) Fixed #12508 - Added ability to dynamically add inlines in the admin app.

Refs #13. Also introduces an empty_form attribute on formsets to make it easier to implement dynamic forms.

Many thanks to Zain Memon for the initial patch from his Summer of Code 2009 project, Stanislaus Madueke for his django-dynamic-formset app and all the other people helping out.

comment:83 by anonymous, 14 years ago

Cc: bas@… added

comment:84 by juriejan, 14 years ago

Cc: juriejanbotha@… removed

comment:85 by anonymous, 13 years ago

Resolution: fixed
Status: reopenedclosed

comment:86 by anonymous, 13 years ago

Resolution: fixed
Status: closedreopened

comment:87 by Mathijs de Bruin, 13 years ago

Cc: mathijs@… added
Has patch: set

So far, it seems that no work has been done on this issue for a long time. Meanwhile, I am sure that it is still a feature that many users would like to see integrated into the Django admin. Given that, by now, people have made the wise decision to ship jQuery with the Django admin, it seems to me as about time to start fixing this issue.

Currently, if order_with_respect_to is specifeid in a Model's Meta field is specified, a cute _order field is indeed added to the Model's database table. However (AFAIK because of the underscore), this field is not represented at all in the Admin interface. This implies that - for now - it is still easier to explicitly add some Integer ordering field to a Model rather than using the much more elegant, available, but disfunctional, API that ships with Django.

As fixing/completing this feature should be fairly easy for someone who's used to getting into the debts of the (very scarcely documented) Admin/Model internals, it might not even be too unrealistic to have this fixed before 1.3 or the first point release after.

To make it a bit easier, I have made a start by providing this patch which fixes at least the get_ordered_objects method of Model's _meta. This causes the Admin to load a non-existant file dom-drag.js which should be replaced by a jQuery equivalent thereof. This one's attached to #2137 for now. Furthermore, the InlineModelAdmin's formset should have it's can_order parameter set to True, I believe, to allow for the ordering to get through to the Admin in the first place. A (broken) patch for this is attached to #9338.

Meanwhile, I have spotted the following tickets relating to this same issue - parts of which I used for writing the - still very incomplete - patch:

Last edited 13 years ago by Mathijs de Bruin (previous) (diff)

comment:88 by Jannis Leidel, 13 years ago

Which patch are you referring to?

comment:89 by Mathijs de Bruin, 13 years ago

@jezdez Apparently I could not attach my patch to the message itself. It should have become clear in this last edit. :)

comment:90 by Łukasz Rekucki, 13 years ago

Severity: normalNormal
Type: defectNew feature

comment:91 by Oliver Beattie, 13 years ago

Cc: oliver@… removed

comment:92 by mhf@…, 13 years ago

Cc: mhf@… removed
Easy pickings: unset
UI/UX: unset

comment:93 by Jacob, 13 years ago

Resolution: fixed
Status: reopenedclosed

Results of a discussion with Russ:

This ticket has basically been "fixed" by Zain's GSoC project adding dynamic add/remove. Since then it's sorta become a dumping ground for slightly related features, but there really isn't anything that can be done to move this ticket forward any more. It's become a laundry list. Thus, I'm closing this as fixed; the various relation issues here should be moved (and in most part have been already moved) to new tickets.

Note: See TracTickets for help on using tickets.
Back to Top