zuires

zuires supports this item

Supported

11 comments found.

Sorry to sound silly, but this script support updates to databases. I’m assuming it can via ajax style calls If it does can you provide a crude a example of updating the database.

Send a request to the backend:
jQuery.ajax("/backend", {
    method: "POST" // default is GET
    success: function(response, status, xhr) {
        alert("Sortable saved by the backend");
    },
    error: function(xhr, status, error) {
        alert("Something went wrong");
    },
    data: $("#your-sortable").sortable().toJson()
})
Example output of $(”#your-sortable”).sortable().toJson():
[
   {
      "id":1,
      "title":"Hi, drag me!",
      "customSelect":"select something...",
      "__sortable_params":{ }
   },
   {
      "id":2,
      "title":"No! Wait, drag me instead!",
      "customSelect":"http://test.com",
      "__sortable_params":{ }
   }
]
Save the JSON output in your database. Retrive Sortable state with:
$("#your-sortable").sortable().parseJson(JSON from backend...)
Notice that you’re actually just doing:
$("#your-sortable").sortable().parseJson($("#your-sortable").sortable().toJson())
In the case of many languages, you’re able to convert JSON to arrays, for example in PHP (PHP 5 >= 5.2.0, PECL json >= 1.2.0, PHP 7):
mixed json_decode(string JSON...)
You can convert it to an array and perform back-end stuff on it.

Let me know if you need any further assistance, thanks for your comment.

good job, i wish you all the best for your sales ;)

Thanks, appreciated!

are you going to make this jquery 3 compatible? and also provide sass support?

Sortable already supports jQuery 3.x. CSS is automatically convertible to SASS. The main css-file should not be edited, but instead, it should be overwritten exactly like Bootstrap. Thanks for your interest. If you would like me to consider any other cool features, please let me know!

How to make some items “non-deletable” ?

Remove HTML-markup of the remove button from your blueprint template.

Ok, but I understand this will remove it from ALL items, I just want to have it removed from SOME items …

You can create another Sortable instance with disabled removing and then allow both instances to mutually merge items. You might want to revise your solution as merged non-removable and removable items will be a confusing mix.

There is no way to tell only specific items to not allow removing. Since, if it was, you would need multiple add-buttons to trigger the right template. And then each of the add-buttons on the items would need more information as well…

Excellent code! Wish you many sales. For me though, would this code work within a WordPress page or site?

Thanks!

The code will work but transferring data from front- to back-end will be a pain (Wordpress doesn’t implement it by default). For this you would need a Wordpress plugin wrapper for Sortable. This script as it is, is meant for developers.

Great ! Good luck

i need some help, trying to just show json like you had above but i dont understand this language whatsoever

Hi, what have you tried so far? What errors are you getting?

Hello, we bought Sortable module and try to use it with Angular. Can you help us to identify item that was moved, created or smth. Callback gets jQuery $item, and I`m not sure how deal with it the best way. Thank you! We used a @bejaboo.com mail.

Thank you for you message.

I am assuming that the message is from bejaboo to whom I have already replied. Please let’s continue our chat below.

bejaboo

bejaboo Purchased

Hello, we bought Sortable module and try to use it with Angular. Can you help us to identify item that was moved, created or smth. Callback gets jQuery $item, and I`m not sure how deal with it the best way. Thank you! We used a @bejaboo.com mail.

To do that you need to loop recursively through your Sortable instance over .dd-item elements. Every .dd-item is a dom node so you can either alter it with pure Javascript or use a wrapper like jQuery.

bejaboo

bejaboo Purchased

Is it possible to implement drag scroll?

Hi, sorry for the delay! I am assuming that you are asking this question because you have recognized some scrolling problem. However, without specifying the problem in specific terms I am only able to give you a general answer.

You can either scroll OR drag, dragging and scrolling cannot be performed simultaneously. Since some parts of the plugin are draggable there are parts of the plugin where scrolling cannot be initiated and therefore will not work. You can drag scroll if you initiate scrolling on parts which are not sensitive to dragging, in which case drag scroll will work just fine.

Please, let me know if you have any other questions!

This comment is currently being reviewed.

This comment is currently being reviewed.

bejaboo

bejaboo Purchased

This comment is currently being reviewed.

by
by
by
by
by
by