« ساخت DukesBDay Managed Bean | ص?حه اصلی | جرعه آخر firstcup »
ساخت صفحه greeting.jsp
January 6, 2008 03:07 PM
اين ص�?حه شامل پيغام خوش آمدگويي، نمايش سن �?علي Duke و دريا�?ت تاريخ تولد کاربر است. مراحل ساخت ص�?حه چنين است:
ساخت يک ص�?حه خالي:
1. روي ماژول firstcup-war کليک راست نماييد.
2. از قسمت New گزينه JSP را انتخاب کنيد.
3. نام �?ايل JSP را greeting وارد کنيد.
4. Finish را کليک کنيد.
5. تگ head را به اين صورت تغيير دهيد:
ساخت يک ص�?حه خالي:
1. روي ماژول firstcup-war کليک راست نماييد.
2. از قسمت New گزينه JSP را انتخاب کنيد.
3. نام �?ايل JSP را greeting وارد کنيد.
4. Finish را کليک کنيد.
5. تگ head را به اين صورت تغيير دهيد:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Firstcup Greeting Page</title>
</head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Firstcup Greeting Page</title>
</head>
6. تگ هاي ابتدا و انتهاي body را حذ�? کنيد.
7. عبارت زير را حذ�? کنيد:
7. عبارت زير را حذ�? کنيد:
<h1>JSP Page</h1>
8. �?ايل را ذخيره نماييد.
Declare نمودن Tag Library هاي JSF
همانگونه که مي دانيد تکنولوژي JavaServer Faces در واقع مجموعه اي از custom tag هاي jsp است که براي نمايش کامپوننت هاي واسط کاربري ، اعتبار سنجي و ساير موارد مربوطه به کار مي رود. Custom tag ها در tag library ها تعري�? مي شوند. تکنولوژي JavaServer Faces در دو tag library تعري�? مي شود:
• HTML Render Kit library که در آن همه کامپوننت هاي استاندارد واسط کاربري تعري�? شده اند.
• Core tag library که تگ هاي مورد نياز براي مبدل ها (convertors) ، اعتبارسنج ها (Validators) و event listener ها و ساير توابع عملکردي اشياء تعري�? مي شوند.
براي است�?اده از اين تگ ها در ص�?حه بايد tag library را declare نماييد. در اين مثال بايد خطوط زير را در �?ايل greeting.jsp درست پس از تگ بسته شدن head قرار دهيد:
Declare نمودن Tag Library هاي JSF
همانگونه که مي دانيد تکنولوژي JavaServer Faces در واقع مجموعه اي از custom tag هاي jsp است که براي نمايش کامپوننت هاي واسط کاربري ، اعتبار سنجي و ساير موارد مربوطه به کار مي رود. Custom tag ها در tag library ها تعري�? مي شوند. تکنولوژي JavaServer Faces در دو tag library تعري�? مي شود:
• HTML Render Kit library که در آن همه کامپوننت هاي استاندارد واسط کاربري تعري�? شده اند.
• Core tag library که تگ هاي مورد نياز براي مبدل ها (convertors) ، اعتبارسنج ها (Validators) و event listener ها و ساير توابع عملکردي اشياء تعري�? مي شوند.
براي است�?اده از اين تگ ها در ص�?حه بايد tag library را declare نماييد. در اين مثال بايد خطوط زير را در �?ايل greeting.jsp درست پس از تگ بسته شدن head قرار دهيد:
<%@ taglib prefix="h" uri="http://java.sun.com/jsf/html" %>
<%@ taglib prefix="f" uri="http://java.sun.com/jsf/core" %>
<%@ taglib prefix="f" uri="http://java.sun.com/jsf/core" %>
ا�?زودن تگ هاي f:view و f:form
يک ص�?حه JSF بوسيله درختي از کامپوننت هاي واسط کاربري نمايش داده مي شود. هر ص�?حه JSP که از تکنولوژي JSF است�?اده مي کند بايد داراي تگ view باشد. اين تگ در Core tag Library تعري�? شده است و ريشه يا root درخت کامپوننت ها را مشخص مي نمايد. ساير تگ هاي JSF بايد درون تگ view تعري�? شوند.
همچنين از آنجا که معمولا ص�?حات JSF شامل �?رمي براي دريا�?ت اطلاعات از کاربر است، معمولا بايد شامل تگ form نيز باشد. همه کامپوننت هاي موجود در يک �?رم بايد درون تگ form قرار گيرند.
با مثال خود بحث را پي مي گيريم.
در ادامه declare نمودن tag library ها تگ هاي view و form را بدين صورت تعري�? نماييد:
يک ص�?حه JSF بوسيله درختي از کامپوننت هاي واسط کاربري نمايش داده مي شود. هر ص�?حه JSP که از تکنولوژي JSF است�?اده مي کند بايد داراي تگ view باشد. اين تگ در Core tag Library تعري�? شده است و ريشه يا root درخت کامپوننت ها را مشخص مي نمايد. ساير تگ هاي JSF بايد درون تگ view تعري�? شوند.
همچنين از آنجا که معمولا ص�?حات JSF شامل �?رمي براي دريا�?ت اطلاعات از کاربر است، معمولا بايد شامل تگ form نيز باشد. همه کامپوننت هاي موجود در يک �?رم بايد درون تگ form قرار گيرند.
با مثال خود بحث را پي مي گيريم.
در ادامه declare نمودن tag library ها تگ هاي view و form را بدين صورت تعري�? نماييد:
<f:view>
<h:form>
</h:form>
</f:view>
<h:form>
</h:form>
</f:view>
ا�?زودن Output Label ها براي نمايش محتواي �?قط خواندني
يکي از مهمترين و پر کاربرد ترين تگ هاي JSF تگ outputText است. greeting.jsp براي نمايش پيغام خوش آمدگويي، دستورالعمل ها، Lebel ها و سن Duke از آن است�?اده مي کند. براي اين کار از پيغام هاي تعري�? شده در resource bundle است�?اده مي نمايد. همچنين تگ outputText اي که سن Duke را نشان مي دهد از متغير age موجود در DukesBDay bean است�?اده مي کند.
در داخل تگ h:form اين کد ها را بنويسيد:
يکي از مهمترين و پر کاربرد ترين تگ هاي JSF تگ outputText است. greeting.jsp براي نمايش پيغام خوش آمدگويي، دستورالعمل ها، Lebel ها و سن Duke از آن است�?اده مي کند. براي اين کار از پيغام هاي تعري�? شده در resource bundle است�?اده مي نمايد. همچنين تگ outputText اي که سن Duke را نشان مي دهد از متغير age موجود در DukesBDay bean است�?اده مي کند.
در داخل تگ h:form اين کد ها را بنويسيد:
<h2><h:outputText value="#{bundle.Welcome}"/></h2>
<h:outputText value="#{bundle.DukeIs} "/>
<h:outputText value="#{dukesBDay.age}"/>
<p><h:outputText value="#{bundle.Instructions}"/>
<p><h:outputText value="#{bundle.YourBD}"/>
<h:outputText value="#{bundle.DukeIs} "/>
<h:outputText value="#{dukesBDay.age}"/>
<p><h:outputText value="#{bundle.Instructions}"/>
<p><h:outputText value="#{bundle.YourBD}"/>
ا�?زودن يک کامپوننت input براي دريا�?ت تاريخ تولد کاربر
يکي ديگر از تگ هاي پرکاربرد، تگ inputText است که يک �?يلد متني براي دريا�?ت ورودي از کاربر است. در اين مثال در ص�?حه greeting.jsp تاريخ تولد کاربر دريا�?ت مي شود و مقدارش در متغير YourBD از DukesBDay Bean ريخته مي شود. بدين ترتيب:
پس از کدهاي نوشته شده از مراحل قبل، کدهاي زير را بنويسيد:
يکي ديگر از تگ هاي پرکاربرد، تگ inputText است که يک �?يلد متني براي دريا�?ت ورودي از کاربر است. در اين مثال در ص�?حه greeting.jsp تاريخ تولد کاربر دريا�?ت مي شود و مقدارش در متغير YourBD از DukesBDay Bean ريخته مي شود. بدين ترتيب:
پس از کدهاي نوشته شده از مراحل قبل، کدهاي زير را بنويسيد:
<h:inputText id="userBirthday" value="#{dukesBDay.yourBD}">
</h:inputText>
</h:inputText>
انتساب يک convertor به کامپوننت ورودي
JSF شامل مجموعه از convertor ها و validator هاي استاندارد است که مي توان به کامپوننت نسبت داد. هد�? از آنها اعتبار سنجي داده هاي ورودي و كنترل انطباق آنها با الگويي خاص است. در اينجا ما مي خواهيم نحوه ورود تاريخ توسط كاربر را مشخص نماييم و روي آن كنترل داشته باشيم.
به اين منظور چنين عمل کنيد:
1. تگ زير را در داخل تگ h:inputText اضا�?ه نماييد:
JSF شامل مجموعه از convertor ها و validator هاي استاندارد است که مي توان به کامپوننت نسبت داد. هد�? از آنها اعتبار سنجي داده هاي ورودي و كنترل انطباق آنها با الگويي خاص است. در اينجا ما مي خواهيم نحوه ورود تاريخ توسط كاربر را مشخص نماييم و روي آن كنترل داشته باشيم.
به اين منظور چنين عمل کنيد:
1. تگ زير را در داخل تگ h:inputText اضا�?ه نماييد:
<f:convertDateTime pattern="MM/dd/yyyy"/>
2. براي نمايش الگوي ورود تاريخ به کاربر تگ زير را پس از تگ بسته شدن h:inputText قرار دهيد:
<h:outputText value="#{bundle.Pattern}"/>
3. براي اينکه در صورت بروز خطا هنگام conversion پيغامي به کاربر نشان داده شود لازم است مشخصه converterMessage را به تگ h:inputText اضا�?ه نماييد. اين تگ بدين صورت خواهد شد:
<h:inputText id="userBirthday"
value="#{dukesBDay.yourBD}"
converterMessage="#{bundle.DateError}">
<f:convertDateTime pattern="MM/dd/yyyy"/>
</h:inputText>
value="#{dukesBDay.yourBD}"
converterMessage="#{bundle.DateError}">
<f:convertDateTime pattern="MM/dd/yyyy"/>
</h:inputText>
4. براي مشخص کردن جاي نمايش پيغام خطا به کاربر تگ زير را درست قبل از تگ بسته شدن h:form قرار دهيد. بدين صورت:
<p><h:message for="userBirthday" style="color:red"/>
ا�?زودن دکمه براي submit
درست قبل از تگ message که در مرحله قبل ايجاد کرديد تگ زير را اضا�?ه نماييد:
درست قبل از تگ message که در مرحله قبل ايجاد کرديد تگ زير را اضا�?ه نماييد:
<p><h:commandButton value="#{bundle.Submit}" action="success"/>
در نهايت �?ايل را ذخيره نماييد.
پياده سازي greeting.jsp هم تمام شد. در مطلب بعد، آخرين جزء Application كه ص�?حه response.jsp است را خواهيم ساخت.
پياده سازي greeting.jsp هم تمام شد. در مطلب بعد، آخرين جزء Application كه ص�?حه response.jsp است را خواهيم ساخت.
نظرخواهی
ارسال شده توسط: ali در ساعت September 29, 2008 04:55 PM
