Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    Regular Coder
    Join Date
    May 2005
    Posts
    262
    Thanks
    4
    Thanked 0 Times in 0 Posts

    drag and drop sort

    Hello, I found a cool drag and drop and sorting script. It works fine but I need to make modifications. The original script lets you drag and drop and you can hit an inspect button to bring up an alert to show you the order.

    This script uses cookies to store the order. I do not know a great deal about JS so I am not sure from their script how to find the cookie and get the info out that is being alerted. I will be using imageIDs from a database query for the IDs that are being alerted and in the sorting. The thing is, I would like to take the sort order when they are done and force the user to hit a save button that would then post to a php page and I could set the cookie up. Again my knowledge is limited to what is going on here.

    Any help in accomplishing this would be great. Thank you


    here is the JS function that alerts the info
    Code:
    ToolMan._junkdrawer = {
    	serializeList : function(list) {
    		var items = list.getElementsByTagName("li")
    		var array = new Array()
    		for (var i = 0, n = items.length; i < n; i++) {
    			var item = items[i]
    
    			array.push(ToolMan.junkdrawer()._identifier(item))
    		}
    		return array.join('|')
    	},
    
    	inspectListOrder : function(id) {
    		alert(ToolMan.junkdrawer().serializeList(document.getElementById(id)))
    	},
    
    	restoreListOrder : function(listID) {
    		var list = document.getElementById(listID)
    		if (list == null) return
    
    		var cookie = ToolMan.cookies().get("list-" + listID)
    		if (!cookie) return;
    
    		var IDs = cookie.split('|')
    		var items = ToolMan.junkdrawer()._itemsByID(list)
    
    		for (var i = 0, n = IDs.length; i < n; i++) {
    			var itemID = IDs[i]
    			if (itemID in items) {
    				var item = items[itemID]
    				list.removeChild(item)
    				list.insertBefore(item, null)
    			}
    		}
    	},
    
    	_identifier : function(item) {
    		var trim = ToolMan.junkdrawer().trim
    		var identifier
    
    		identifier = trim(item.getAttribute("id"))
    		if (identifier != null && identifier.length > 0) return identifier;
    		
    		identifier = trim(item.getAttribute("itemID"))
    		if (identifier != null && identifier.length > 0) return identifier;
    		
    		// FIXME: strip out special chars or make this an MD5 hash or something
    		return trim(item.innerHTML)
    	},
    
    	_itemsByID : function(list) {
    		var array = new Array()
    		var items = list.getElementsByTagName('li')
    		for (var i = 0, n = items.length; i < n; i++) {
    			var item = items[i]
    			array[ToolMan.junkdrawer()._identifier(item)] = item
    		}
    		return array
    	},
    
    	trim : function(text) {
    		if (text == null) return null
    		return text.replace(/^(\s+)?(.*\S)(\s+)?$/, '$2')
    	}
    }

    Here is a link to the example

    Example page

  • #2
    Regular Coder
    Join Date
    May 2005
    Posts
    262
    Thanks
    4
    Thanked 0 Times in 0 Posts
    Reason I would like control over the cookies in php is that this script does not seem to be consistent. If you drag one image and hit refresh it stays the same but then move another and hit refresh. most of the time in IE, on the second refresh, the image goes back to the previous position. I would liek to be able to set the cookies via save in a php post and access via $_cookie_vars[].


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •