لديك حساب بالفعل؟ دخول
دخول  سجل الأن 
تحميل الصفحة بـ jquery
اريد شرح مفصل عن طريقة تحميل الصفحات بـ ajax او مكتبة jquery مثال انا عندي صفحة

index.php

عندي داخلها زر مثلا الاقسام ويوديني لـ صفحة cat.php

انا اريد لما يضغط على كلمة الاقسام تظهر صورة loading ويتغير محتوى الصفحة كامل الى cat.php

اخوي انا عندي اكثر من زر وثانيا اريد يظهر في وسط الصفحة صورة loading

انا اريد لكل روابط السكربت وليس فقط لصفحة وحده نفترض

الرئيسية = index.php
الاقسام = cat.php
الصور = image.php

لنفترض انني في صفحة cat.php واريد ان ارجع للرئيسية

طبعا الان رابط الموقع كذا

www.xxx.com/cat.php

لما اضغط على زر الرئيسية تظهر صورة loading في وسط الصفحة مثل لما تضغط على صورة في الوورد بريس تظهر لك الصورة مكبره انا اريد نفس الحركة لصورة loading وبعدها تتغير الصفحة الى index.php ويصبح الرابط www.xxx.com/index.php

اتمنى وضحت الفكرة
تاريخ البداية: 21 / سبتمبر / 2011 الساعة 12:45 اخر نشاط: 28 / ديسمبر / 2011 الساعة 14:33 php اجاكس تحميل صفحة
3 إجابات
اما بالنسبة اذا كنت تريد عمل استعلامات فى الصفحة التى تريد ان تستدعيها ممكن تستخدم دى:
header("Content-type:text/html;");

    switch ($_GET['tpl']){ 
        case 'catgory.htm':
        //your php code here
        break;
    
        case 'index.tpl':
        //your php code here
        break;
    
    }

$smarty->display($_GET['tpl']);

بواسطة: Gamal
منذ: 21 / سبتمبر / 2011 الساعة 12:45

بص الطريقة دى بتعتمد على استدعاء القالب دون بودى او هيد فى الصفحة الحالية عشان كدة لازم تعمل ان نظام صفحاتك كلها يكون المحتوى المتغير داخل وسم هتمل محدد لان لما نستدعى المحتوى الجديد هو ال هيتغير انا اقصد يعنى القوائم وكل شى هيكون ثابت لكن منتصف الصفحة هو ال هيتغير. دلوقت انا هعمل مثال بسيط وهى صفحة مكونة من جدول فيه خليتان خلية بها الازرار التى تغير محتوى الخلية الاخرى كمثال فقط
الان سنستخدم طريقة jooria فى استدعاء المحتوى
الان سنستخدم صفحة لعرض القوالب ونفرض انها print_tpl.php وهذه الصفحة تقوم بجلب محتوى القالب المطلوب وارساله على صيغة هتمل الصفحة سهتكون كالتالى مثلا:
header(\"Content-type:text/html;\");
    $smarty->display($_GET[\'tpl\'].\'.tpl\');
الان انت يجب ان يكون لديك قالب باسم catgory كمثال وهذا الكود الكامل
<!DOCTYPE html>
<html>
<head>
<script src=\"http://code.jquery.com/jquery-latest.min.js\"></script>
<script type=\"text/javascript\">
    function load_content(tpl){
        $(\"#result\").html(\'\').load(\"print_tpl.php?tpl=\"+tpl+\"\");
    }  
    $(function() { $(\'.load\').click(function(){
        var tpl = $(this).attr(\'id\');
        load_content(tpl);
            return false;
        });
    });      
</script>
<style type=\"text/css\">
    <!--
    #result {
        background: transparent url(loading.gif) no-repeat center center;  
    }
    -->
</style>    
      
</head>
<body>
    <table width=\"100%\">
    <tr>
        <td width=\"20%\">
            <a id=\"index\" class=\"load\">الرئسية</a>
            <a id=\"catgory\" class=\"load\">الاقسام</a>
        </td>
        <td id=\"result\" width=\"80%\">
        <!-- هنا سيتم استدعاء القالب -->
        </td>
    </tr>
    </table>
</body>
</html>

الان عند الضغط على زر الاقسام الدالة لولاد سوف تقوم بتحمل الصفحة print_tpl.php?tpl=catgory لان وضعنا فى الاى دى بتاع كلمة الرئسية كلمة catgory اى اسم القالب الان الصفحة سوف تستدعى القالب بواسطة الاسمارتى مثل $smarty->display(\'catgory.tpl\')

بواسطة: Gamal
منذ: 21 / سبتمبر / 2011 الساعة 12:45

شكرا لكم فهمت الطريقة ولكن ماذا لو كان في قواعد البيانات
21 / سبتمبر / 2011 الساعة 12:45

طلبتك يعتمد على دالة الـ.load()
حيث تقدر تستدعى صفحة سواء كانت خارجية ام داخلية الى الهتمل لديك
مثال:
$(\'#result\').load(\'test.html\');
هذه يستدعى لك الصفحة test.html فى الوسم الذى يمتلك الـid يساوى result يعنى مثل هذا
<div id=\"result\"></div>
هذا ابسط شرح لها الان ناتى لطرق استخدامها مع الـPHP ان كنت تريد استدعاء محتوى من قاعدة البينات: اولا يجب عليك عمل دالة بسيطة تعتمد على دالة الـ.load() وهى كالاتى:
function load_content(id){
    $(\"#result\").html(\'\').load(\"load.php?id=\"+id+\"\");
} 
شرح الدالة: هى تعتمد على تحميل محتوى بصيغة html من ملف php سبق وتم اعداده الان يجب عليك عمل طبقة هتمل اقصد وسم مثل
<div id=\"result\"></div>
ولابد من تحديد الطول والعرض وايضا لابد من وضع صورة خلفية له لانى طلبت من الدالة قبل ان تستدعى المحتوى الجديد ان تقوم بحذف المحتوى القديم بواطسة html(\'\') وضع علامتين تنصيص فارغتين تعنى تفريغ المحتوى هذا يعنى الاستيل الخاص بهذه الطبقة يمكن ان يكون:
#result {
 width:450px;
 height: 270px;
 background: transparent url(loading.gif) no-repeat center center;  
}
الان انت مثلا تريد عمل ازرار تحمل لك المحتوى يوجد طرق كثير ومنهم ان تضع لكل زر اى دى محدد وتقوم بوضع كلاس يقوم باخد هذا الاى دى واستعمال الدالة السابقة لاستعدء المحتوى وهذه كالاتى:
$(function() { $(\'.load\').click(function(){
    var id = $(this).attr(\'id\');
    load_content(id);
        return false;
    });
}); 
الان الازرار ستكون هاكذا
<a id=\"1\" class=\"load\">قسم البرمجة</a>  
<a id=\"2\" class=\"load\">المشاكل</a>

الان عند الضغط قسم البرمجة هيحمل لك محتوى الصفحة load.php?id=1
انت تقدر تعدلها بمزاجك

بواسطة: MacOS
منذ: 21 / سبتمبر / 2011 الساعة 12:45

أنشر اجابتك

xهل تريد الاجابة عن هذا السؤال؟ من فضلك سجل دخول او اشترك لتتمكن من الاجابة