<div class="listitem position1">

</div>
<div class="listitem position2">

</div>

and from the data structure mentioned above
we retrieve the rows holding two key field
position and html

<script typ="text/javascript">

$(function() {
// we just create our items object
var items = [];
// create an array to hold our positions
item.position = new Array();
// create an array to hold our html
item.html  = new Array();

/* SERVER SIDE SCRIPT HERE
you should use your php or asp script to retrieve your data
$int i = 0;
start of server side foreach
*/
// javascript between server side script
// just populate our JavaScript arrays with data
item.position[<?php echo $i; ?>] = <?php echo row->position; ?>;
item.html[<?php echo $i; ?>] = <?php echo row->html; ?> ;
/* SERVER SIDE SCRIPT HERE
i++
end of server side foreach
*/

// we just do a for loop to fill our html list items with the correct html
:)
for(var i = 0; i < item.position.length; i++) {// if i is less then amount
of items in array increment i
$("." + item.position[i]).html(item.html[i]);
/*
if the item position was position one then html relating to that position
will be filled in
*/

}

//   now we just unhide our list items
$("..listitem").show();
});


</script>

<style type="text/css">
/* this style initially hides all our items */
.listitem  {
display:none;
}
</style>



On Sat, Jul 4, 2009 at 9:12 AM, cs...@hotmail.com <cs3p...@googlemail.com>wrote:

>
> hi waseem, thx for your idea and really appreciate for doing it. what
> i want to know is how to display these toolbars-"div"s base on
> retrieved data from database.
> for example:
> orginal order
> div id=1 class=1
> div id=2 class=2
> div id=3 class=3
> assume i retrieved data from database is array,which contains the
> customised order "3","1","2"
>
> how to display divs like this?
> div id=3 class=3
> div id=1 class=1
> div id=2 class=2
>
>
> On Jul 4, 2:04 pm, waseem sabjee <waseemsab...@gmail.com> wrote:
> > lets just see the logic behind this.
> >
> > <div class="listitem position1">
> > item
> > </div>
> >
> > <div class="listitem position2">
> > item
> > </div>
> >
> > <div class="listitem position3">
> > item
> > </div>
> >
> > <div class="listitem position4">
> > item
> > </div>
> >
> > say we have  item as mentioned above.
> > METHOD 1
> > ------------------
> > save to database :
> > your table would be like so
> >
> > if you are using MYSQL
> > ID INT(11) NOT NULL auto_increment,
> > userID INT(11) NOT NULL,
> > position TEXT NOT NULL,
> > html TEXT NOT NULL
> >
> > if you are using SQL SERVER
> > ID INT NOT NULL -- set identifier to yes and set increment to 1
> > userID INT NOT NULL,
> > position VARCHAR(max) NOT NULL,
> > html VARCHAR(max) NOT NULL
> >
> > for both cases index ID as Primary Key
> > non clustered index on position
> > non clustered index on html
> > my idea is to save the html of a specific position  to the db and refill
> the
> > positions based on this
> > note i used classes such as position1, position2 to identify my locations
> > I have created one table that will keep track of the positions for each
> user
> >
> > if you do not want to use a database you can use cookies :)
> > your cookies would be :
> > position, html
> > same type of logic
> >
> > On Sat, Jul 4, 2009 at 3:39 AM, cs...@hotmail.com <
> cs3p...@googlemail.com>wrote:
> >
> >
> >
> > > Hi all:
> >
> > > i am trying to use jquery UI sortable on my webpage to display
> > > toolbars. what i want is, let people sort these toolbars in the way
> > > they like. i have named toolbars with id "1","2","3","4", and i saved
> > > sorted order to database via toArray method. i was wondering how i
> > > could display these toolbars with new order when people browser my
> > > site next time, is there any method that supports it?
> >
> > > i am really appreciate for your help, thx in advance
> >
> > > andy
>

Reply via email to