اعادة ترتيب الحقول او المواضيع او الاقسام او اياً كان باستخدام php و ajax و mysql

[said]

http://www.dzbatna.com/images/icons/icon30.gif ط§ط¹ط§ط¯ط© طھط±طھظٹط¨ ط§ظ„ط*ظ‚ظˆظ„ ط§ظˆ ط§ظ„ظ…ظˆط§ط¶ظٹط¹ ط§ظˆ ط§ظ„ط§ظ‚ط³ط§ظ… ط§ظˆ ط§ظٹط§ظ‹ ظƒط§ظ† ط¨ط§ط³طھط®ط¯ط§ظ… php ظˆ ajax ظˆ mysql (http://www.dzbatna.com/t2048643/)





درس مفصل اعادة ترتيب الحقول او المواضيع او الاقسام او اياً كان باستخدام php و ajax و mysql


http://www.engcv.com/imagecenter/resort.gif


المثال

عرض المثال (http://www.engcv.com/example/jquery-sortable-with-ajax/jQuery-Sortable-With-AJAX-MYSQL.html)



الشرح طريقة

اولاً قم بتظمين الاكواد التالية في راس الصفحة


رمز PHP:

<code style="white-space:nowrap"> <code> <script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="jquery-ui-1.7.1.custom.min.js"></script>
<script type="text/javascript">
// When the document is ready set up our sortable with it's inherant function(s)
$(document).ready(function() {
$("#test-list").sortable({
handle : '.handle',
update : function () {
var order = $('#test-list').sortable('serialize');
$("#info").load("process-sortable.php?"+order);
}
});
});
</script>
</code> </code>



وضع اكواد ال css التالية


رمز PHP:

<code style="white-space:nowrap"> <code> <style type="text/css">
* { margin: 0; padding: 0; }
body {
direction: rtl;
background: #161616 url(http://engcv.com/example/img/pattern_40.gif) top left repeat;
margin: 0;
padding: 40;
font: 0.9em Arial;
}
#info {
direction: ltr;
display: block;
padding: 10px;
margin-bottom: 20px;
border: 1px solid #333;
background-color: #efefef;
text-align: center;



}
#test-list {
margin: 10px;
list-style: none;
}

#test-list li {
border-radius:5px;
display: block;
padding: 15px 10px;
margin-bottom: 3px;
background-color: #efefef;
box-shadow: 1px 1px 10px #7cadff;
}

#test-list li img.handle {
margin-left: 20px;
cursor: move;
}
</style>
</code> </code>



قم بانشاء حقل جديد في الجدول الذي تريد ان يتم ترتيبه على حسب حقل معين

سمي الحقل مثلاً Postion

قم بالاستعلام وضع الحقول داخل قائمة من نوع ul كتالي

رمز PHP:

<code style="white-space:nowrap"> <code> <ul id="test-list">
<li id="listItem_1"><img src="arrow.png" alt="move" width="16" height="16" class="handle" /><strong>العنصر الاول 1 </strong></li>
<li id="listItem_2"><img src="arrow.png" alt="move" width="16" height="16" class="handle" /><strong>العنصر الثاني 2</strong></li>
<li id="listItem_3"><img src="arrow.png" alt="move" width="16" height="16" class="handle" /><strong>العنصر الثالث 3</strong></li>
<li id="listItem_4"><img src="arrow.png" alt="move" width="16" height="16" class="handle" /><strong>العنصر الرابع 4</strong></li>
</ul>
</code> </code>


عند الاستعلام ضع الايدي مكان الرقم التالي

listItem_1

listItem_2

listItem_3

لاحظ الارقام 1 و 2 و 3 ..الخ

هذه الارقام اجعل الاستعلام يظع رقم الايدي تبع الحقل بدال الارقام السابقة

(ملاحظة لازلنا في الاستعلام)

اما مكان الكلمات

العنصر الاول 1

العنصر الثاني 2

..الخ

ضع المسماء من قاعدة البيانات او اي شي صورة الخ

المهم

الان انشاء ملف لنظع فيه اكواد ال php وليكن اسمة كتالي process-sortable.php

ويحتوي على الاكواد الخاصة بادخال الارقام الجديدة للحقول بعد الترتيب كتالي

رمز PHP:

<code style="white-space:nowrap"> <code> include("config.php");
foreach ($_GET&#91;'listItem'&#93; as $position => $item) :
$sql = "UPDATE `table` SET `position` = $position WHERE `id` = $item";
mysql_query($sql);
endforeach;
</code> </code>

أعتقد كل شي واضع

الان مع تحميل الملفات الخاصة بالدرس مفصل

تحميل الملفات

ارجو للجميع التوفيق

المصدر (http://www.engcv.com/dep.php?do=c&cid=220)
ظ…ط³ظٹط±ط© ط§ظ„ظ…ظ‡ظ†ط¯ط³ظٹظ† | ط¯ط±ط³ ط§ط¹ط§ط¯ط© طھط±طھظٹط¨ ط§ظ„ط*ظ‚ظˆظ„ ط§ظˆ ط§ظ„ظ…ظˆط§ط¶ظٹط¹ ط§ظˆ ط§ظ„ط§ظ‚ط³ط§ظ… ط§ظˆ ط§ظٹط§ظ‹ ظƒط§ظ† ط¨ط§ط³طھط®ط¯ط§ظ… php ظˆ ajax ظˆ mysql (http://www.engcv.com/dep.php?do=c&cid=220)







ألعاب الأندرويد مجانا و حصريا (http://www.apotox.info/forum)




https://fbcdn-sphotos-d-a.akamaihd.net/hphotos-ak-ash4/482113_236967293114455_1193518507_n.png (http://www.dzbatna.com)
©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى (http://www.dzbatna.com)©