تطبيق Captcha بـ ، Applying Captcha in ADF

تطبيق Captcha بـ ADF 

  Applying Captcha in ADF

لتنفيذ الـ captcha  نحتاج إلى تحميلsimplecaptcha-1.2.1.jar  وإضافتها إلى المشروع 

الموضوع بسيط فقط لنتابع الخطوات:

1-        إنشاء تطبيق (Application) (fusion middleware web application).

2-        إنشاء صفحة معmanage bean  بالطريقة المعتاد عليها

3-        الآن نقوم بإضافة المكتبة simplecaptcha-1.2.1.jar إلى المشروع من خلال right click  على إسم المشروع بعدها Project Properties بعدها نختار Labraries and Classpath وبالضغط على ADD JAR/Labraries ويتم إضافة ملف الـ simplecaptcha-1.2.1.jar  كما في الصورة أدناه :

لتحميل ملف  simplecaptcha-1.2.1.jar إضغط هنا

4-     الآن قم بإضافة الكود التالي على ملف   web.xmlوكما موضح في الصورة في أدناه

<servlet>

    <servlet-name>CaptchaServlet</servlet-name>

    <servlet-class>nl.captcha.servlet.SimpleCaptchaServlet</servlet-class>

    <init-param>

            <param-name>width</param-name>

            <param-value>250</param-value>

    </init-param>

    <init-param>

       <param-name>height</param-name>

       <param-value>75</param-value>

    </init-param>

  </servlet>

<servlet-mapping>

    <servlet-name>CaptchaServlet</servlet-name>

    <url-pattern>/captchaservlet</url-pattern>

  </servlet-mapping>

(الإنتباه والمراعاة مكان الإضافة على ملف web.xml )

  5-        نعمل save لحفظ التعديلات 

6-        نكون تصميم الصفحة كما في الشكل التالي: 

code  source الصفحة يكون التالي :

<af:panelFormLayout id="pfl1">

<f:facet name="footer"/>

<af:outputText value="Captcha Ascension" inlineStyle="font-size:22pt;"/>

<af:image source="/captchaservlet" id="i1"

           inlineStyle="width:239px; height:60.0px;"/>          

<af:panelLabelAndMessage label="Enter the Text : " id="plam1">

<af:panelGroupLayout id="pgl1" layout="horizontal" halign="left">

<af:inputText id="it1" value="#{requestScope.enterTxt}"/>

<af:commandButton text="Done" id="cb1"                            actionListener="#{backingBeanScope.captchaAscension.verifyAnswer}"

partialSubmit="true" immediate="false" icon="/img/okay.png"/>

<af:spacer width="11" height="17" id="s1"                                  binding="#{backingBeanScope.captchaAscension.s1}"/>

  <af:commandButton text="Refresh" id="cb2" partialSubmit="false"       icon="/img/refresh.png"/>

    </af:panelGroupLayout>

            <af:message id="m1" for="it1"/>

          </af:panelLabelAndMessage>

        </af:panelFormLayout>

7-        الآن لم يتبقى سوى كتابة الـ (code) التابع للزر (Done) ليتم التحقق من الرمز المكتوب 
    مع صورة الـcaptcha  في manage bean ، قم بنسخ الكود التالي :

 public void verifyAnswer(ActionEvent actionEvent)

{

   FacesContext fctx = FacesContext.getCurrentInstance();

   ExternalContext ectx = fctx.getExternalContext();

   HttpServletRequest request = (HttpServletRequest)ectx.getRequest();

   Captcha captcha = (Captcha)ectx.getSessionMap().get(Captcha.NAME);

      try

       {

        request.setCharacterEncoding("UTF-8");

       }

          catch (UnsupportedEncodingException e)

           {

             System.out.println("UTF not supported !");

           }

            String answer = (String)ectx.getRequestMap().get("enterTxt");

            if (answer != null && captcha.isCorrect(answer))

            {

             message("You are correct boss.");

            }

              else

               {

                message("You are wrong.Please try again.");

                UIComponent panelLabelAndMessage =

               ((UIComponent)actionEvent.getSource()).getParent().getParent();

                UIComponent panelFormlayout = panelLabelAndMessage.getParent();

        AdfFacesContext.getCurrentInstance().addPartialTarget(panelFormlayout);

              }

       }

        private void message(String str)

        {

          FacesContext fctx = FacesContext.getCurrentInstance();

          fctx.addMessage("it1", new FacesMessage(str));

        }

الآن إن شاء الله نقوم بعمل حفظ للمشروع ((save  وبعدها run  لنرى النتيجة كما في الصورة المرفقة 

إن شاء الله تستفيدوا من المشاركة 
لتحميل التطبيق إضغط هنا 

عمل Disable لكل component على الصفحة بضغطة زر Disable for All Components that is on page by one click

عمل Disable لكل components على الصفحة بـ ADF بضغطة زر

  Disable for All Components that is on page by one click in ADF

نتبع الخطوات التالية :

1-      إنشاء صفحة مع manage bean  بالطريقة المعتاد عليها

2-      نضع أحد أنواعlayout component  (panelFormLayout أو panel grid layout)

لتضم بداخلها الـ component المراد عملها لها Disable هنا إستخدمت panelFormLayout إذن الـ Id التابع لها سيكون Pfl1 ومعرفة هذا الأمر ضرورية لإننا سوف نستخدمه ونتعامل معه داخل الكود كما سنرى

3-      بالسحب والإفلات (Drag & Drop) نضع عدد من الـ component المختلفة       

(inpt text, selectBooleanRadio, selectManyChoice, selectBooleanRadio)

4-      نضع Button على الصفحة لكتابة الكود المطلوب عند الضغط عليه سوف يتم عمل disable  لكل components  الموجودة في الصفحة ،  لنرى شكل الصفحة سيكون كما الصورة التالية :

1-      الآن لكل component  موجود على الصفحة  ضبط خاصية autoSubmit له بـ true وخاصية partialTriggers  بـ Id التابع للـ Button (الإسم البرمجي للـ Button) هنا أنا عندي Id التابع للـ Button هو cb1 معناه أن هذه الـ component ستتأثر بـ ضغطة هذا الـ Button

2-      الأن double click  على button نعمل method وليكن إسمها disableAction()  والتي ستكون داخل الـ manage bean  الصفحة لنكتب الكود التالي :

public String disableAction()

   {

        for (UIComponent child : getPfl1().getChildren())

        {      

          if (child instanceof RichInputText)

          {

           ((RichInputText)child).setDisabled(true);

          }

            if (child instanceof RichInputText)

             {

              ((RichInputText)child).setDisabled(true);

             }

              else if (child instanceof RichSelectBooleanCheckbox)

               {

                ((RichSelectBooleanCheckbox)child).setDisabled(true);

               }

                else if (child instanceof RichSelectBooleanRadio)

                {

                 ((RichSelectBooleanRadio)child).setDisabled(true);

                }

                 else if (child instanceof RichSelectManyChoice)

                 {

                 ((RichSelectManyChoice)child).setDisabled(true);

                 }   

        }

        return null;

    }

3-      مختصر الكود أنه نلاحظ أنه يتم التحقق من كل نوع components موجود داخل الـ panelFormLayout (Pfl1) وضبط خاصية Disabled له بـ true

4-       الآن نعمل run  للصفحة لنرى النتيجة كما في الصورة التالية :

لتحميل التطبيق إضغط هنا