Related objects interface should be tighter (edit_inline)

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.

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.

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.

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.

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.

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

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.

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?

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

restored and added to cc.

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?

I would very like to see this implemented!

Milestone Version 1.1 deleted

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

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

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.

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.

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.

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.

Reverting spam.

I would very like to see this implemented! 月餅

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

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.

django is beautiful. compliments

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

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

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!

cc changed from oliver@obeattie.com, cmlenz@gmx.de, gary.wilson@gmail.com, mhf@hex.no, tom@eggdrop.ch, django@apolloner.eu, brosner@gmail.com, tom85@lycos.nl to oliver@obeattie.com, ouzze@yahoo.net, cmlenz@gmx.de, gary.wilson@gmail.com, mhf@hex.no, tom@eggdrop.ch, django@apolloner.eu, brosner@gmail.com, tom85@lycos.nl, dan.popovici@gmail.com.

cc changed from oliver@obeattie.com, cmlenz@gmx.de, gary.wilson@gmail.com, mhf@hex.no, tom@eggdrop.ch, django@apolloner.eu, brosner@gmail.com, tom85@lycos.nl to oliver@obeattie.com, ouzze@yahoo.net, servil@yahoo.com, cmlenz@gmx.de, gary.wilson@gmail.com, mhf@hex.no, tom@eggdrop.ch, django@apolloner.eu, brosner@gmail.com, tom85@lycos.nl, dan.popovici@gmail.com.

cc changed from oliver@obeattie.com, cmlenz@gmx.de, gary.wilson@gmail.com, mhf@hex.no, tom@eggdrop.ch, django@apolloner.eu, brosner@gmail.com, tom85@lycos.nl to oliver@obeattie.com, ouzze@yahoo.net, servil@yahoo.net!, cmlenz@gmx.de, gary.wilson@gmail.com, mhf@hex.no, tom@eggdrop.ch, django@apolloner.eu, brosner@gmail.com, tom85@lycos.nl, dan.popovici@gmail.com.

Very sexy interface mock up. :)