• 0
العيافـي

طريقة انشاء جدول ديناميكي بواسطة الحزمة displayTag

سؤال

السلام عليكم ورحمة الله وبركاته

بناءا على طلب احد الزملاء بشرح طريقة استخدام حزمة الجداول الديناميكية displayTag

اول فائدة هذه الحزمة

1- تقوم بتوفير خاصيه تعدد الصفحات

2- تصدير الجدول الى الصيخ التالية excel,xml,pdf,csv

اولا تحتاج في مشروعك الى ملفات الجار التالية

post-82434-12743063535773_thumb.gif

اولا قمت بانشاء كائن باسم Car


public class Car {

private String name;
private String model;
private String color;

public Car() {
}
.
.
.
getters
setters

ثم انشأة طريقة تعود بقائمة من الكائن السابق



public static List<Car> getCars(){
List<Car>cars=new ArrayList<Car>();
cars.add(new Car("C", "2010", "red"));
cars.add(new Car("F", "2009", "WHITE"));
cars.add(new Car("E", "2005", "gray"));
cars.add(new Car("A", "2006", "black"));
cars.add(new Car("Y", "2004", "white"));
return cars;
}

الان في صفحة JSP سأعرض ابسط جدول بقيم افتراضية


<%

request.setAttribute("list", TestData.getCars());
%>

<display:table name="list" pagesize="2" export="true" class="display">
<!-- column tags-->
<display:caption>
Title
</display:caption>


<display:column property="name" title="name" sortable="true" headerClass="header"></display:column>
<display:column property="model" title="model" sortable="true" headerClass="header" ></display:column>
<display:column property="color" title="color" sortable="true" headerClass="header" ></display:column>


<display:footer>
<td colspan="3" class="footer">footer</td>
</display:footer>

</display:table>


اكيد ان الكود واضح ولكن سأقوم بذكره الخصائص

name="list"

اسم القائمة في requset

pagesize="2"

عدد الصفوف المرغوب عرضها في صفحة JSP الواحده.

عند الرغبة في عرض جميع الصفوف و الغاء خاصيه تعدد الصفحات، قم بالغاء هذه الخاصية.

export="true"

هذه اذا رغبت باضافة خاصية التصدير، وعند اعطاء هذه الخاصية القيمة false سيتم الغاء خاصية التصدير

class="display"

هذا اسم صنف CSS

_______________________________________

<display:caption>Title</display:caption>

هذا رأس الجدول ، علما بانه يمكنك اضافة كود HTML بدلا من النص

_______________________________________

<display:column property="name" title="name"  sortable="true" headerClass="header"></display:column>

property="name"

name هي اعد عناصر الكائن Car

title="name"

هذا سيكون اسم العمود، كما انه يمكنك استخدام الخاصية titleKey بدلا من title اذا اردت استخدام قرائة النصوص من ملف properties

sortable="true"

عندما تكون القيمة true فهذا يعني امكانيه ترتيب العمود بالضغط على اسم العمود

headerClass="header"

اسم صنف CSS لعنوان العمود

______________________________________________________________________________

<display:footer><td colspan="3" class="footer">footer</td></display:footer>

هذا تذييل الجدول كما هو واضح بالامكان اضافة كود html

المرفق عبارة عن المثال كامل

display-example.rar

تم تعديل بواسطه العيافـي
2

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه

12 إجابة على هذا السؤال .

  • 0

المثال المرفق السابق يحتوي على صفحتين JSP لعرض الجدول

في الصفحة list2.jsp

قمت بتغيير الاعدادات الافتراضية ليكون الجدول بالصورة التالية

post-82434-12743079702842_thumb.gif

الكود


<%

request.setAttribute("list", TestData.getCars());
%>
requestURI="list2.jsp" هنا اضفت خاصية جديدة وظيفته تحديد مسار action page ا //
<display:table name="list" requestURI="list2.jsp" pagesize="2" export="true" class="display">
<!-- column tags-->
<display:caption>
Title
</display:caption>


<display:column property="name" title="name" sortable="true" headerClass="header"></display:column>
<display:column property="model" title="model" sortable="true" headerClass="header" ></display:column>
<display:column property="color" title="color" sortable="true" headerClass="header" ></display:column>


<display:footer>
<td colspan="3" class="footer">footer</td>
</display:footer>

//قمت هنا بتغيير الاعدادات في نوع الملفات المسموح التصدير لها،
//قمت بتغيير نصوص خاصية تعدد الصفحات ، وكما هو واضح بان الكود عبارة عن HTML قد تحتاج الى اضافة صور مثلا ، فالحزمة تدعم ذلك

<display:setProperty name="export.excel" value="true"></display:setProperty>
<display:setProperty name="export.excel.label" value="تصدير الى اكسل"></display:setProperty>
<display:setProperty name="export.excel.filename" value="test.xls"></display:setProperty>

<display:setProperty name="export.xml" value="false"></display:setProperty>
<display:setProperty name="export.pdf" value="false"></display:setProperty>
<display:setProperty name="export.csv" value="false"></display:setProperty>

<display:setProperty name="export.banner" value="<div class='exportlinks'>تصدير الى: {0}</div>"></display:setProperty>



<display:setProperty name="paging.banner.full" value="<span class='pagelinks'>[<a href='{1}'>الاول</a>/<a href='{2}'>السابق</a>] {0} [<a href='{3}'>التالي</a>/<a href='{4}'>الاخير</a>]</span>"></display:setProperty>
<display:setProperty name="paging.banner.first" value="<span class='pagelinks'>[الاول/التالي] {0} [<a href='{3}'>التالي</a>/<a href='{4}'>الاخير</a>]</span>"></display:setProperty>
<display:setProperty name="paging.banner.last" value="<span class='pagelinks'>[<a href='{1}'>الاول</a>/<a href='{2}'>السابق</a>] {0} [التالي/الاخير]</span>"></display:setProperty>
<display:setProperty name="paging.banner.onepage" value="<span class='pagelinks'>{0}</span>"></display:setProperty>

</display:table>

لمعرفة بقية الخصائص التي تدعمها الحزمة يمكنك رؤية الملف displaytag.properties الموجود في ملف scr

يوجد ايضا خاصية رائعه في الحزمة

بامكانك تحديد اعمده تصدر الى صيغة excel ولا تصدر الى صيغة xml مثلا

مثلا

<display:column property="name" title="name" sortable="true" media="excel" headerClass="header"></display:column>

باضافة الخاصيه media="excel" فهذا يعني ان هذا العمود يصدر الى اكسل و لا يصدر الى صيغة اخرى.

و اخيرا عند الرغبة في التصدير الى pdf يجب ادراج ملف الجار itext للمشروع

وسلامتك

ارجوا ان يكون الشرح واضح

1

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

بارك الله فيك يا أخي, درس جيد جدا

تم التثبيت في المواضيع المميزه

تم تعديل بواسطه {هويدي}
0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

السلام عليكم ورحمة الله وبركاته

جزاكم الله كل خير أخي الكريم على الاستجابة السريعة

وان شاء الله هطبق كلامك

ولو فيه اي مشكلة :wink: سأرسل اليك برد ان شاء الله

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

السلام عليكم ورحمة الله وبركاته

أخي الكريم العيافـي جزاكم الله كل خير

لقد قمت بتطبيق ما متبتة وكانت النتيجة والحمد لله ايجابية واشتغل المثال دون اي مشاكل

ولكن لم يتم تلوين الخلايا وظهر ت باللون العادي (خلفية الصفحة بيضاء)

فلم اعرف السبب؟؟؟؟؟؟

فلماذا؟؟؟؟؟؟

علما بانني استخدم JDeveloper Studio 11.1.1.0.1

وليس نتبينز أو اكلبس

وجزاكم الله كل خير

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

لم يتم التلوين بسبب عدم وجود ملف CSS

في المثال المرفق يوجد ملف باسم DisplayTheme.css

ارفقه في مشروعك و ادرجة في صفحة JSP التي انشأتها

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

مقال متميّز ،

سأستخدمه من أجل التصدير إلى اكسل ،

كنت في السابق استخدم Jquery datatable ، لانشاء وتعبئة الجدول في الClient بعد نقل البيانات على شكل JSON ، ولكن لو استقبلت من أمري ما استدبرت ما استخدمته .. ولاستمعت لنصيحتك باستخدام displayTag بدلاً من datatable .

1

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

التصدير ليست الميزه الوحيده .. جربها و تأكد ان كثير من احتياجاتك ستوفرها هذه الحزمة.

سأضيف هنا نقطة لم اذكرها سابقا

بالنسبة للوسم display:setProperty

يقرا من ملف باسم displaytag.properties ، بامكانك اعادة كتابتة بالشكل الذي يناسبك، بحيث لا تحتاج الى كتابة الوسم display:setProperty في كل صفحة JSP تحتوى على جدول ديناميكي

كما انه يمكنك اضافة اكثر من ملف على حسب اللغات التي يدعمها موقعك.

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

لدي سؤال أخوي " العيافي " .

الان أنشأت جدول ، ولكن لنفرض أنني أريد عدد كبير من الأعمدة ، كيف أقوم بذلك ،

لنفرض أن لدينا هذا الـbeans :

public class EEE {
private String id;
private String title;
private String mark;
.
.

هذا يعني أنه لايمكنني الا انشاء ثلاثة أعمدة ( كل عمود يقابل member ) ، كيف يمكنني أن أكتب شيء كهذا :

public class EEE {
private String id;
private String title;
private Vector<String> marks;
.

وبما أن لدي " مصفوفة درجات " .. فسأنشئ أكثر من عمود ..

لا أستطيع أن أتحكم بـ DisplayTag في هذه الحالة ؟

هل السؤال واضح ؟

1

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

عزيزي الشمري

سؤالك واضح، ويمكنك تنفيذ هذا،

في الوسم

<display:table name="list" id="car"  pagesize="2"  export="true" class="display">

لاحظ اني اضفت القيمة

id="car"

ثانيا استخدم الكود التالي



<c:forEach var="mark" items="${car.marks}" varStatus="status">
<display:column title="mark ${status.count}" sortable="true" headerClass="header" >
${mark}
</display:column>
</c:forEach>

قمت باستخدام loop بواسطة JSTL

علما بان استبدال Vector الى Map افضل إذا كنت ترغب في استخدام ال Key كأسم للعمود

ناتج الاضافة

post-82434-1276332545398_thumb.gif

اتمنى ان يكون هذا الرد هو ما تحتاج الية ..

تم تعديل بواسطه العيافـي
2

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

نعم ، الكود يعمل الان كما أريد .. شكراً لك أخي .

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه
  • 0

السلام عليكم

أرجو منكم أخي الكريم بارفاق ملف واحد فقط يتم من خلاله انشاء جدول يتم تعبئته من قاعدة البيانات ثم النقر على زر يتم من خلاله تصدير الجدول الى ملف اكسل

0

شارك هذا الرد


رابط المشاركة
شارك الرد من خلال المواقع ادناه

من فضلك سجل دخول لتتمكن من التعليق

ستتمكن من اضافه تعليقات بعد التسجيل



سجل دخولك الان

  • يستعرض القسم حالياً   0 members

    لا يوجد أعضاء مسجلين يشاهدون هذه الصفحة .