Can anyone help with this??
On Jun 23, 11:14 pm, Simon Burfield <[email protected]> wrote:
> Ok I am quiet new to Jquery but have been doing programming for some
> years. Basically I just want to post back what panels are in what
> column and the order. In the end the only way I could get the values
> was to do a .each on each column with the toArray command and then put
> all of them in to a single array so i can post the results to another
> page? WHY?
> see below
>
> <!doctype html>
> <html lang="en">
> <head>
> <title>jQuery UI Sortable - Portlets</title>
> <link type="text/css" href="ui.all.css" rel="stylesheet" />
> <script type="text/javascript" src="jquery-1.3.2.min.js"></script>
> <script type="text/javascript" src="ui.core.js"></script>
> <script type="text/javascript" src="ui.sortable.js"></script>
> <link type="text/css" href="demos.css" rel="stylesheet" />
> <style type="text/css">
> .column { width: 170px; float: left; padding-bottom: 100px; }
> .portlet { margin: 0 1em 1em 0; }
> .portlet-header { margin: 0.3em; padding-bottom: 4px; padding-left:
> 0.2em; }
> .portlet-header .ui-icon { float: right; }
> .portlet-content { padding: 0.4em; }
> .ui-sortable-placeholder { border: 1px dotted black; visibility:
> visible !important; height: 50px !important; }
> .ui-sortable-placeholder * { visibility: hidden; }
> </style>
>
> <script type="text/javascript">
> $(function() {
> $(".column").sortable({
> connectWith: '.column',
> handle: '.portlet-header',
> stop:function(event, ui) {
> var sortorder = new Array();
> var loop =0;
> $(".column").each(function(){
> sortorder[loop] =$(this).sortable("toArray");
> loop = loop + 1 ;
> });
> //alert( sortorder[0] + sortorder[1] +
> sortorder[2]) ;
>
> $.ajax({
> url: "data.esp",
> method:'post',
> autoCancel:true,
> type: "post",
> data: 'sort1=' + sortorder[0] + ';sort2=' + sortorder
> [1] + ';sort3=' + sortorder[2]
> });
>
> }
> });
>
> $(".portlet").addClass("ui-widget ui-widget-content ui-helper-
> clearfix ui-corner-all")
> .find(".portlet-header")
> .addClass("ui-widget-header ui-corner-all")
> .prepend('<span class="ui-icon
> ui-icon-plusthick"></span>')
> .end()
> .find(".portlet-content");
>
> $(".portlet-header .ui-icon").click(function() {
> $(this).toggleClass("ui-icon-minusthick");
>
> $(this).parents(".portlet:first").find(".portlet-content").toggle
> ();
> });
>
> });
>
> </script>
> </head>
> <body>
> <div class="demo">
>
> <div class="column" id="sortme">
>
> <div class="portlet" id="a1">
> <div class="portlet-header" ><a href="">Feeds</a></div>
> <div class="portlet-content">Lorem ipsum dolor sit amet,
> consectetuer adipiscing elit</div>
> </div>
>
> <div class="portlet" id="a2">
> <div class="portlet-header" >News</div>
> <div class="portlet-content">Lorem ipsum dolor sit amet,
> consectetuer adipiscing elit</div>
> </div>
>
> </div>
>
> <div class="column" id="sortme2">
>
> <div class="portlet" id="a3">
> <div class="portlet-header">Shopping</div>
> <div class="portlet-content">Lorem ipsum dolor sit amet,
> consectetuer adipiscing elit</div>
> </div>
>
> </div>
>
> <div class="column" id="test">
>
> <div class="portlet">
> <div class="portlet-header">Links</div>
> <div class="portlet-content">Lorem ipsum dolor sit amet,
> consectetuer adipiscing elit</div>
> </div>
>
> <div class="portlet">
> <div class="portlet-header">Images</div>
> <div class="portlet-content">Lorem ipsum dolor sit amet,
> consectetuer adipiscing elit</div>
> </div>
>
> </div>
>
> </div><!-- End demo -->
>
> </body>
> </html>
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"jQuery UI" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/jquery-ui?hl=en
-~----------~----~----~----~------~----~------~--~---
