RichFaces হল একটি শক্তিশালী JSF (JavaServer Faces) ফ্রেমওয়ার্ক যা AJAX এবং উন্নত UI কম্পোনেন্ট দিয়ে ওয়েব অ্যাপ্লিকেশন তৈরির প্রক্রিয়াকে আরও দ্রুত এবং ইন্টারেকটিভ করে তোলে। এর মধ্যে Form Validation এবং Custom Validators ব্যবহারের মাধ্যমে আপনি ফর্ম ডেটার সঠিকতা যাচাই করতে পারবেন এবং ব্যবহারকারীদের জন্য একটি ভালো ইন্টারঅ্যাকটিভ ইউজার এক্সপেরিয়েন্স তৈরি করতে পারবেন।
এখানে RichFaces এর Form Validation এবং Custom Validators ব্যবহারের বিস্তারিত আলোচনা করা হচ্ছে।
1. Form Validation in RichFaces
RichFaces এর form validation মূলত JSF এর h:inputText, h:inputTextArea, h:inputNumber ইত্যাদি কম্পোনেন্টগুলির জন্য কাজ করে। আপনি JSF validation API ব্যবহার করে ফর্ম ভ্যালিডেশন করতে পারেন এবং RichFaces এর সাহায্যে ব্যবহারকারীদের দ্রুত ত্রুটি বার্তা দেখাতে পারেন।
Basic Form Validation Example:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:rich="http://richfaces.org/rich">
<h:head>
<title>Form Validation with RichFaces</title>
</h:head>
<h:body>
<h:form>
<!-- Input Field with Required Validation -->
<h:outputLabel for="username" value="Username: " />
<h:inputText id="username" value="#{formBean.username}" required="true">
<f:validateLength minimum="5" maximum="10" />
<h:message for="username" />
</h:inputText>
<br />
<!-- Input Field with Email Validation -->
<h:outputLabel for="email" value="Email: " />
<h:inputText id="email" value="#{formBean.email}" required="true">
<f:validateRegex pattern="^[A-Za-z0-9+_.-]+@[A-Za-z0-9.-]+$" />
<h:message for="email" />
</h:inputText>
<br />
<h:commandButton value="Submit" action="#{formBean.submit}" />
</h:form>
</h:body>
</html>
Explanation:
- Required Validation:
required="true": এই অ্যাট্রিবিউটের মাধ্যমে আপনি নিশ্চিত করতে পারেন যে ইনপুট ফিল্ডটি খালি থাকবে না।
- Length Validation:
f:validateLength minimum="5" maximum="10": এই ট্যাগটি ইনপুটের দৈর্ঘ্য যাচাই করে।
- Regex Validation:
f:validateRegex pattern="^[A-Za-z0-9+_.-]+@[A-Za-z0-9.-]+$": এই ট্যাগটি ইমেইল ঠিকানা যাচাই করার জন্য রেগুলার এক্সপ্রেশন (regex) ব্যবহার করে।
- h:message:
<h:message for="username" />: এই ট্যাগটি ত্রুটি বার্তা দেখানোর জন্য ব্যবহৃত হয়, যা ব্যবহারকারীর জন্য ফর্মে প্রাসঙ্গিক ত্রুটি দেখাবে।
2. Custom Validators in RichFaces
কখনও কখনও আপনাকে নিজের কাস্টম ভ্যালিডেশন তৈরি করতে হতে পারে, যেমন ডেটার বিশেষ ধরনের যাচাই বা কাস্টম রুল প্রয়োগ করা। JSF-এ Custom Validators তৈরি করতে JSF Validator Interface ব্যবহার করা হয় এবং এই ভ্যালিডেটরগুলি RichFaces ফর্মের মধ্যে প্রয়োগ করা যায়।
Creating a Custom Validator:
- Create a Custom Validator Class:
import javax.faces.application.FacesMessage;
import javax.faces.component.UIComponent;
import javax.faces.context.FacesContext;
import javax.faces.validator.FacesValidator;
import javax.faces.validator.Validator;
import javax.faces.validator.ValidatorException;
@FacesValidator("emailValidator")
public class EmailValidator implements Validator {
@Override
public void validate(FacesContext context, UIComponent component, Object value) throws ValidatorException {
String email = (String) value;
if (email == null || !email.matches("^[A-Za-z0-9+_.-]+@[A-Za-z0-9.-]+$")) {
FacesMessage msg = new FacesMessage("Invalid email address", "Please enter a valid email address");
msg.setSeverity(FacesMessage.SEVERITY_ERROR);
throw new ValidatorException(msg);
}
}
}
- Apply Custom Validator in XHTML Page:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:rich="http://richfaces.org/rich">
<h:head>
<title>Custom Validator Example</title>
</h:head>
<h:body>
<h:form>
<!-- Input Field with Custom Email Validator -->
<h:outputLabel for="email" value="Email: " />
<h:inputText id="email" value="#{formBean.email}" required="true">
<f:validator validatorId="emailValidator" />
<h:message for="email" />
</h:inputText>
<br />
<h:commandButton value="Submit" action="#{formBean.submit}" />
</h:form>
</h:body>
</html>
Explanation:
- Custom Validator (
emailValidator):- আমরা একটি কাস্টম ভ্যালিডেটর ক্লাস তৈরি করেছি যার মধ্যে
validateমেথডে ইমেইল ফরম্যাট চেক করার জন্য একটি রেগুলার এক্সপ্রেশন (regex) ব্যবহার করা হয়েছে।
- আমরা একটি কাস্টম ভ্যালিডেটর ক্লাস তৈরি করেছি যার মধ্যে
- Apply Validator:
<f:validator validatorId="emailValidator" />এই লাইনটি JSF ফরম্যাটে কাস্টম ভ্যালিডেটরকে ইনপুট ফিল্ডে অ্যাপ্লাই করে।
- Error Message:
<h:message for="email" />: এটি ত্রুটি বার্তা প্রদর্শন করতে ব্যবহৃত হয়, যখন কাস্টম ভ্যালিডেটরটি ইমেইল সঠিক না হলে একটি ত্রুটি বার্তা দেখাবে।
3. RichFaces Form Validation with AJAX
RichFaces এ AJAX এর মাধ্যমে ফর্ম ভ্যালিডেশন কার্যকর করা যায়, যাতে পেজ রিফ্রেশ ছাড়াই ফলাফল দেখানো হয়। নিচে AJAX ব্যবহার করে form validation করার একটি উদাহরণ দেওয়া হলো:
AJAX Validation Example with rich:extendedDataTable:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:rich="http://richfaces.org/rich">
<h:head>
<title>AJAX Form Validation</title>
</h:head>
<h:body>
<h:form>
<h:outputLabel for="username" value="Username: " />
<h:inputText id="username" value="#{formBean.username}" required="true">
<f:validateLength minimum="5" maximum="10" />
<h:message for="username" />
</h:inputText>
<h:commandButton value="Submit" action="#{formBean.submit}"
execute="@form" render="username" />
</h:form>
</h:body>
</html>
Explanation:
- AJAX Action:
<h:commandButton>-এর মাধ্যমে AJAX ব্যবহার করে ফর্ম ডেটা সাবমিট করা হয়েছে।execute="@form"এর মাধ্যমে পুরো ফর্মটি সাবমিট করা হয়, এবংrender="username"ফর্মটির উপাদানটি পুনঃরেন্ডার করা হয়।
- Validation with AJAX:
- AJAX এর মাধ্যমে JSF validation এক্সিকিউট হয় এবং h:message দ্বারা ফলাফল প্রদর্শিত হয়, যা পেজ রিফ্রেশ ছাড়াই দেখানো হয়।
RichFaces এবং JSF ফ্রেমওয়ার্ক ব্যবহার করে ফর্ম ভ্যালিডেশন সহজ এবং কার্যকরী করা যায়। JSF Validation API এবং RichFaces এর বিভিন্ন কম্পোনেন্টের সাহায্যে আপনি ইনপুট ফিল্ডের জন্য length, required, pattern ইত্যাদি ভ্যালিডেশন করতে পারেন। Custom Validators এর মাধ্যমে আপনি নিজস্ব ভ্যালিডেশন রুল তৈরি করতে পারেন এবং AJAX এর মাধ্যমে ডেটা সাবমিট করার সময় ত্রুটির বার্তা এবং ফলাফল প্রদর্শন করতে পারেন, যা ব্যবহারকারীদের আরও ইন্টারেকটিভ অভিজ্ঞতা প্রদান করে।
Read more
