Comments (17)
So all you should need to do to save/post it is put it inside a form element and send it to the server.
FormFactory and the collections stuff should be compatible with http://www.hanselman.com/blog/ASPNETWireFormatForModelBindingToArraysListsCollectionsDictionaries.aspx (or at least it was about 3 years ago, last time i checked!). I haven't checked, but maybe the code which does moveup/movedown/drop needs to do some array renumbering...
If you want to use ajax, or something, you can serialize the form using form2js https://github.com/lookfirst/form2js
from formfactory.
A link to some code http://j.mp/1nraN6T
from formfactory.
Hi I am interested in this feature as well 👍 can I ask you guys how do you persist this in the database table? what structure do you follow.
from formfactory.
Are you guys talking about drag/drop for the existing icollection stuff on
the demo site (which handles moveup/movedown)
On 24 Jan 2016 19:00, "manualshifter" [email protected] wrote:
Hi I am interested in this feature as well [image: 👍] can I ask you
guys how do you persist this in the database table? what structure do you
follow.—
Reply to this email directly or view it on GitHub
#19 (comment)
.
from formfactory.
Yes, in your demo you have the list to move up and down.
In my application, I am using this and need it for nested lists and sortable:
- Within the same list
- Across two lists nice to Have
First one is better rubuxa is better
1 http://j.mp/1OQNh9G
2 http://j.mp/1NtXKWS
I was thinking it would be nice if we could specify the target lists with an Attribute like this where the drop handles would work.
[DragSourceEnabled]
[DropTargetEnabled]
Obj/model - SourceListCollection
[DropTargetEnabled]
Obj - TargetListCollection
from formfactory.
I'm unlikely to work on this any time soon, but I do think it would be a good feature to have, and would happily accept a pull request*.
*with certain coding standard to be met e.g.
- example on docs page
- works with nested collections
- need good justification to use an external library, as we already depend on jquery ui
- probably some other things :P
from formfactory.
I would love to, I would need some help on how to wire it up. I am not as proficient as you :))
The good thing is I clearly understand what would make a good user experience. So I would need to be guided on where all I would need to make changes.
Rather than update the current collection item you have, I was planning on adding support for a new one.
Just know that I might fail (pretty poorly) and you/someone here might need to help me. I see its getting popular recently.
thanks
drive baby drive :)
from formfactory.
I tried myself as well, could not get it working so I gave up after sometime. I need to know how to wire it up at the different levels. UI, Domain, View Engine etc.
from formfactory.
OK so I've enabled in-list drag and drop using the HTML5 draggable API, which unfortunately doesn't support touch screen, but mouse dragging works.
Here's the commit if you are interested in how it works: f391a4c
There are libraries (as linked above) which support touch events, but they don't work with event delegation as far as I can tell. If anyone wants to improve this solution, please feel free to do so in a PR.
from formfactory.
This works in chrome, Edge, and IE, haven't tested FF and Safari.
from formfactory.
This is awesome 👍
I want to help extend it. Not sure why it closed, lots of community participation
thanks again
from formfactory.
I tested it works, would like to add an icon to the div besides the title
// snippet for highlight
$(".droppable").droppable({
accept: '.draggable',
over: function(event, ui) {
$(this).addClass('tempHighlight');
},
out: function(event, ui) {
$(this).removeClass('tempHighlight');
},
drop: function() {
//do some stuff
}
});
// snippet for drag handle
$(row).draggable({
handle: '#handle1, #handle2',
});
from formfactory.
This was added - draggable="true" id="listitem-@id" , wondering where is the order being serialized and saved/POSTED
Here are the changes, I cant find it though
f391a4c
Wondering
from formfactory.
Are you referring to this? I am trying to wire it up to an update/POST will let you know soon.
$(document).on("drop", function (e) {
e.preventDefault();
e.stopPropagation();
var $src = $(document.getElementById(e.originalEvent.dataTransfer.getData("text")))
.closest("li[draggable=true]");
var $target = $(e.target).closest("li[draggable=true]");
if ($target.length && $target[0] !== $src[0]
&& $target[0].parentElement === $src[0].parentElement) {
var beforeOrAfter = $src.index() > $target.index();
$src.remove();
if (beforeOrAfter) {
$src.insertBefore($target);
} else {
$src.insertAfter($target);
}
console.log("dropped");
}
});
This is how I can get the serialize the list
var droppedSortedList = $( ".selector" ).sortable( "serialize", { key: "sort" } );
for e.g. here it would be
we need to wire this to the Save/Update Handler $src.sortable( "serialize", { key: "sort" } );
can someone tell me where the update function is, so I can wire it up there.
from formfactory.
@mcintyre321 & @patagoniahiker thank you so much 💯 for both...
can you please show me how to do the model update/save, after drag complete.
from formfactory.
Please make any changes on a fork, and send a PR when you want me to review them. I'm not going to integrate snippets.
from formfactory.
I am new to git hub, let me try to get it working and then make the update
from formfactory.
Related Issues (20)
- Asp Net Core 3.0 AggregateException The partial view 'FormFactory/Form.Property' was not found. HOT 9
- File Upload Control HOT 1
- Multiple Textbox HOT 1
- IIS Publish Error HOT 1
- Dynamic forms from Propertyvm HOT 2
- Repeatable row/table? HOT 2
- Client validations not working when using PropertyVms to create Dynamic Forms. HOT 3
- Documentation on custom templates? HOT 2
- No example provided for a server side validation HOT 1
- FormFactory Templates installs all files in root of project
- Does this work with Blazor? HOT 1
- Installation not working with .net core 3+ HOT 1
- Sorry, an error occurred while processing your request. HOT 2
- Improvement for radio buttons
- The sample site doesn't load HOT 1
- Looking a way to extend FormFactory functionalities HOT 5
- For the dynamic form submit, how to add an additional Save button which does not do FF client side validation?
- add and remove actions don't work for the editable collection
- Validation not working on programmatically created form HOT 1
- Live Website Docs are Down HOT 4
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from formfactory.