Merhaba arkadaşlar. Bu yazıda PrimeFaces’da OneButton ve OneRadio bileşenlerinin nasıl kullanıldığını göreceğiz.
OneRadio bileşeni JSF tarafındaki selectOneRadio bileşeni gibi kullanılabilen bir bileşen. PrimeFaces’da ona biraz daha güzellik katılmış.
OneButton ise PrimeFaces ile getirilmiş ve seçenekleri buton şeklinde sunan bir bileşen. Siz istediğiniz seçenekteki butona tıklayarak seçiminizi yapıyorsunuz.
Örnek uygulamamızın kodları ve açıklamaları şu şekilde:
ButtonAndRadio.java Kodu
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 |
import javax.faces.bean.*; import javax.annotation.PostConstruct; import java.util.List; import java.util.ArrayList;; @ManagedBean @RequestScoped public class ButtonAndRadio { String oneButton; String oneRadio; public List<String> sirketler; public String getOneButton() { return oneButton; } public void setOneButton(String oneButton) { this.oneButton = oneButton; } public String getOneRadio() { return oneRadio; } public void setOneRadio(String oneRadio) { this.oneRadio = oneRadio; } public List<String> getSirketler() { return sirketler; } public void setSirketler(List<String> sirketler) { this.sirketler = sirketler; } @PostConstruct public void liste() { sirketler=new ArrayList<String>(); sirketler.add("İETT"); sirketler.add("ÖHO"); sirketler.add("İOAŞ"); } } |
Java kodumuz içinde değinmemiz lazım gelen bir nokta yoktur. Hepsi daha önce öğrendiğimiz şeyler.
index.xhtml Kodu
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:p="http://primefaces.org/ui"> <h:head> <title>OneButton Ve OneRadio Kullanımı</title> </h:head> <h:body> <h:form> <p:outputLabel value="OneButton Kullanımı"/> <h:panelGrid columns="2"> <p:outputLabel value="Hangi Şirketi Tercih Edersiniz:"></p:outputLabel> <p:selectOneButton value="#{buttonAndRadio.oneButton}"> <f:selectItem itemLabel="İETT" itemValue="İETT"/> <f:selectItem itemLabel="ÖHO" itemValue="ÖHO"/> <f:selectItem itemLabel="İOAŞ" itemValue="İOAŞ"/> </p:selectOneButton> </h:panelGrid> <p:commandButton value="KAYDET" update="secilen" icon="ui-icon-check" /> <br/> <p:outputLabel id="secilen" value="Seçilen Şirket:#{buttonAndRadio.oneButton}"/> </h:form> <br/> <h:form> <p:outputLabel value="OneRadio Kullanımı"/> <h:panelGrid columns="2"> <p:outputLabel value="Hangi Şirketi Tercih Edersiniz:"></p:outputLabel> <p:selectOneRadio value="#{buttonAndRadio.oneRadio}" > <f:selectItems value="#{bean.sirketler}"/> </p:selectOneRadio> </h:panelGrid> <p:commandButton update="sirket" value="KAYDET"></p:commandButton> <br/> <p:outputLabel id="sirket" value="Seçilen Şirket:#{buttonAndRadio.oneRadio}"></p:outputLabel> </h:form> </h:body> </html> |
Xhtml kodumuz içinde oneButton bileşenini kullanmak için p:selectOneButton etiketini kullanıyoruz. Bu etiketin value bileşenine Java sınıfımızda seçilen değeri tutacak değişkeni atıyoruz. Ekranda görünmesini istediğimiz seçenekleri istersek f:selectItem ile tek tek istersek f:selectItems ile tek seferde çoklu olarak ekleyebiliriz.
OneRadio kullanmak için de işlemler tamamen aynı arkadaşlar. p:selectOneRadio ile radyo butonları kullanabiliriz.
Ekran Çıktıları
Sayfa açıldığında bizi şu şekilde karşılıyor:
Her iki seçenek için de İETT’yi seçip KAYDET butonlarına tıklıyorum.
Bu yazıda da bu kadar arkadaşlar. Gelecek yazıda kullanıcıdan arttırımlı ya da azaltımlı sayı alımını sağlayan Spinner bileşeninin kullanımı öğreneceğiz. Sağlıcakla kalın.
