مشکل با اعمال تغییرات در JQuery

[ho3ink2]

سلام.
بنده یه سری لیست (li) دارم بعد با عمل drag & drop و کدهای JQuery اون ها رو جابجا میکنم و ترتیبشون رو تغییر میدم و بعد position اون ها رو تو بانک اطلاعاتی ذخیره میکنم.
و مشکلی که باهاش برخورد دارم اینه که: وقتی ترتیب item ها رو عوض می کنم تو کدهای html اعمال نمیشه این حرکات.

مثلا:

---------------------
قبل تغییرات

>item1<
>item2<
>item3<
>item4<



<ul>
<li>item1</li>
<li>item2</li>
<li>item3</li>
<li>item4</li>
</ul>



---------------------
بعد تغییرات
>item3<
>item1<
>item4<
>item2<




<ul>
<li>item1</li>
<li>item2</li>
<li>item3</li>
<li>item4</li>
</ul>

[ho3ink2]

کسی با این مشکل بر نخورده تاحالا!
اگه در انتقال مفهوم مشکلی هست بفرمایید تا توضیح بیشتر بدم راجب مشکل؟!!!

[MEHR4N]

احتمالا فقط پوزیشن اونا تغییر میکنه با اینکار نه خود dom، مثلا اگه تو css اینا پوزیشن absolute باشه جایی که top تغییر میکنه باید رو dom هم تغییر رو اعمال کنی مثلا با insertAfter یا insertBefore

[ho3ink2]

میشه لطفا بیشتر توضیح بدی؟
مثال ، یا منابعی داری که کمکم کنه؟

[azamicu]

دوست عزیز شما داری با فاصله اجزا در صفحه کا میکنی این کارو با دستورات جی کوئری انجام بده preappend,...

[MEHR4N]

با darg and drop نمونه ای ندارم، و نمیدونم خودتون drag and drop رو نوشتین یا اگه از کد آماده استفاده میکنین اون چجوری کار میکنه ولی میتونم یه مثال بزنم، فرض کنین این لیست شما پوزیشنش absolute هست، اینجوری:

ul{ position: relative }
li{ position: absolute }
li#1{ top:0px}
li#2{ top:10px}

اگه با جاوااسکریپت پوزیشن اینها رو عوض کنین، تغییری توی dom ایجاد نمیشه بلکه فقط css تغییر میکنه:

$("li#1).css("top","10px");
$("li#2).css("top","0px");

برای اینکه توی dom هم جاشون عوض شه باید از متد های dom manipulatin استفاده کنین که تو jquery هست، اینجوری:

$("li#1").css("top","10px").insertAfter("li#2");
$("li#2").css("top","0px");

البته این مثال چون فقط دو تا li داشت اینجوریه، اگه بیشتر بشه باید اول sibling قیلیش رو بدست بیاری ( اگه first child نبود )، بعد، بعد از اونا insert کنی
حالا نمیدونم اون کد چرا اینجوری نوشته شده که فقط پوزیشن رو تغییر میده، چون اگه جاشون تو dom عوض شه هم طبق document flow پوزیشن هم تغییر میکنه، احتمالا میخواسته جابجایی li هارو با یه افکت نمایش بده