Code

Opened 9 years ago

Closed 3 years ago

#13 closed New feature (fixed)

Related objects interface should be tighter (edit_inline)

Reported by: adrian Owned by: barbuza
Component: contrib.admin Version: master
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@…, velmont, 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)

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 6 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 5 years ago.

Download all attachments as: .zip

Change History (94)

comment:1 Changed 9 years ago by adrian

  • Owner changed from adrian to wilson

comment:2 Changed 9 years ago by wilson

  • Description modified (diff)

comment:3 Changed 9 years ago by wilson

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 Changed 9 years ago by Simon Willison

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 Changed 9 years ago by anonymous

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 Changed 9 years ago by robert@…

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 Changed 9 years ago by anonymous

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 Changed 9 years ago by wilson

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 Changed 9 years ago by jacob

  • milestone set to Version 1.1

comment:10 Changed 9 years ago by Jason Huggins

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 Changed 8 years ago by jim-django@…

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 Changed 8 years ago by jacob

  • Owner changed from wilson to jacob
  • Status changed from new to assigned

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

comment:13 Changed 8 years ago by Christopher Lenz <cmlenz@…>

  • Cc cmlenz@… added

comment:14 Changed 8 years ago by hi-world cup

  • Cc hi-world, cup added; cmlenz@… removed
  • Keywords rthml tab space editor js added
  • Summary changed from Related objects interface should be tighter to hi-world cup

comment:15 Changed 8 years ago by adrian

  • Summary changed from hi-world cup to Related objects interface should be tighter

comment:16 Changed 8 years ago by Gary Wilson <gary.wilson@…>

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

restored and added to cc.

comment:17 Changed 8 years ago by Eugene

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 Changed 8 years ago by anonymous

  • Cc mhf@… added

comment:19 Changed 8 years ago by starplant@…

I would very like to see this implemented!

comment:20 Changed 7 years ago by anonymous

Milestone Version 1.1 deleted

comment:21 Changed 7 years ago by Gary Wilson <gary.wilson@…>

  • Keywords rthml tab space editor js removed
  • Triage Stage changed from Unreviewed to Accepted

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

comment:22 Changed 7 years ago by taavi223@…

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 Changed 7 years ago by Gary Wilson <gary.wilson@…>

  • Keywords edit_inline added
  • Summary changed from Related objects interface should be tighter to Related 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 follow-up: Changed 7 years ago by Thomas Steinacher <tom@…>

  • 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.

comment:25 in reply to: ↑ 24 ; follow-up: Changed 7 years ago by Gary Wilson <gary.wilson@…>

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.

comment:26 in reply to: ↑ 25 Changed 7 years ago by Thomas Steinacher <tom@…>

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 Changed 7 years ago by Florian Apolloner <florian@…>

  • Cc django@… added

comment:28 Changed 7 years ago by brosner <brosner@…>

  • Cc brosner@… added

comment:29 Changed 7 years ago by anonymous

  • Cc tom85@… added

comment:30 Changed 7 years ago by anonymous

  • Cc oliver@… added

comment:31 Changed 7 years ago by anonymous

  • Component changed from Admin interface to Translations
  • Triage Stage changed from Accepted to Design decision needed
  • Version set to 0.96

comment:32 Changed 7 years ago by Brian Rosner <brosner@…>

  • Component changed from Translations to Admin interface
  • Triage Stage changed from Design decision needed to Accepted
  • Version changed from 0.96 to newforms-admin

Reverting spam.

comment:33 Changed 7 years ago by xuefeng8@…

I would very like to see this implemented! 月餅

comment:34 follow-up: Changed 7 years ago by cammmm@…

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

comment:35 Changed 7 years ago by anonymous

  • Cc dan.popovici@… added

comment:36 in reply to: ↑ 34 Changed 7 years ago by ubernostrum

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 Changed 7 years ago by anonymous

django is beautiful. compliments

comment:38 Changed 7 years ago by anonymous

  • Resolution set to fixed
  • Status changed from assigned to closed

comment:39 Changed 7 years ago by brosner

  • Resolution fixed deleted
  • Status changed from closed to reopened

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

comment:40 Changed 7 years ago by James Wheare <django@…>

  • Cc django@… added

comment:41 Changed 7 years ago by lnielsen

  • Cc lnielsen@… added

comment:42 Changed 7 years ago by brosner

  • 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 Changed 6 years ago by Patrick Lauber <patrick.lauber@…>

  • Cc patrick.lauber@… added

comment:44 Changed 6 years ago by cecil

  • 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 Changed 6 years ago by Patrick Lauber <patrick.lauber@…>

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

comment:46 Changed 6 years ago by jakub_vysoky

  • Keywords nfa-changelist added

comment:47 Changed 6 years ago by anonymous

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 Changed 6 years ago by anonymous

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 Changed 6 years ago by anonymous

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 Changed 6 years ago by Michael P. Jung <mpjung@…>

  • Cc mpjung@… added

Very sexy interface mock up. :)

comment:51 Changed 6 years ago by julien

  • Cc django@… added

comment:52 Changed 6 years ago by shanx

  • Cc remco@… added

comment:53 Changed 6 years ago by mrts

  • milestone set to post-1.0

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

comment:54 Changed 6 years ago by barbuza

  • Owner changed from nobody to barbuza
  • Status changed from reopened to new

comment:55 Changed 6 years ago by Alex

  • Version changed from newforms-admin to SVN

comment:56 Changed 6 years ago by barbuza

  • Cc barbuzaster@… added
  • Status changed from new to assigned

Changed 6 years ago by barbuza

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

comment:57 Changed 6 years ago by barbuza

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

comment:58 Changed 6 years ago by barbuza

  • Patch needs improvement set

comment:59 Changed 6 years ago by Frank Malina

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 Changed 6 years ago by anonymous

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 Changed 6 years ago by anonymous

  • Cc flavio.curella@… added

comment:62 Changed 6 years ago by anonymous

  • Resolution set to fixed
  • Status changed from assigned to closed

comment:63 Changed 6 years ago by anonymous

a

comment:64 Changed 6 years ago by anonymous

  • Resolution fixed deleted
  • Status changed from closed to reopened

comment:65 Changed 6 years ago by Guilherme M. Gondim <semente@…>

  • Cc semente@… added

comment:66 Changed 6 years ago by patrickk

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

comment:68 Changed 6 years ago by anonymous

  • Cc stephane@… added

comment:69 Changed 5 years ago by anonymous

  • Resolution set to fixed
  • Status changed from reopened to closed

comment:70 Changed 5 years ago by apollo13

  • Resolution fixed deleted
  • Status changed from closed to reopened

anonymous having fun?!

comment:71 Changed 5 years ago by anonymous

  • milestone post-1.0 deleted

Milestone post-1.0 deleted

comment:72 Changed 5 years ago by juriejan

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 Changed 5 years ago by juriejan

  • Cc juriejanbotha@… added

comment:74 Changed 5 years ago by CollinAnderson

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 Changed 5 years ago by juriejan

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

Changed 5 years ago by anonymous

comment:76 Changed 5 years ago by anonymous

"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 Changed 5 years ago by James Wheare

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 Changed 5 years ago by anonymous

Not choosing a js lib just wastes human resource.

comment:79 Changed 5 years ago by anonymous

please, choose a js library

comment:80 Changed 5 years ago by velmont

  • Cc velmont added

comment:81 Changed 5 years ago by test

test

comment:82 Changed 4 years ago by jezdez

(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 Changed 4 years ago by anonymous

  • Cc bas@… added

comment:84 Changed 4 years ago by juriejan

  • Cc juriejanbotha@… removed

comment:85 Changed 4 years ago by anonymous

  • Resolution set to fixed
  • Status changed from reopened to closed

comment:86 Changed 4 years ago by anonymous

  • Resolution fixed deleted
  • Status changed from closed to reopened

comment:87 Changed 3 years ago by dokterbob

  • 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. 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.

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

Version 0, edited 3 years ago by dokterbob (next)

comment:88 Changed 3 years ago by jezdez

Which patch are you referring to?

comment:89 Changed 3 years ago by dokterbob

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

comment:90 Changed 3 years ago by lrekucki

  • Severity changed from normal to Normal
  • Type changed from defect to New feature

comment:91 Changed 3 years ago by obeattie

  • Cc oliver@… removed

comment:92 Changed 3 years ago by mhf@…

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

comment:93 Changed 3 years ago by jacob

  • Resolution set to fixed
  • Status changed from reopened to closed

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.

Add Comment

Modify Ticket

Change Properties
<Author field>
Action
as closed
as The resolution will be set. Next status will be 'closed'
The resolution will be deleted. Next status will be 'new'
Author


E-mail address and user name can be saved in the Preferences.

 
Note: See TracTickets for help on using tickets.