PrimeFaces

JSF&PrimeFaces Dersleri-BooleanButton Kullanımı

11 yıl önce
Yorum Ekle
admin
150 görüntülenme

Merhaba arkadaşlar. Önceki yazımızda Otomatik Tamamlama (AutoComplete) ve InputTextArea Bileşeni‘ni ele almıştık. Bu yazımızda ise mantıksal sonuçlar için kullanabilcek Boolean Button‘ı öğreneceğiz.

Bu yazımız için kodlarımız ve açıklamaları şu şekilde:

index.xhtml Kodu

<?xml version="1.0" encoding="UTF-8"?>
<!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://xmlns.jcp.org/jsf/html"
      xmlns:p="http://primefaces.org/ui">
   <h:head>
       <title>Merhabalar</title>
   </h:head>
   <h:body>
       <h:form>
           <p:growl id="msgs" />

           <h:panelGrid columns="2" style="margin-bottom:10px" cellpadding="5">
               <h:outputText value="Windows İşletim Sistemi Kullanıyor musunuz?" />
               <p:selectBooleanButton id="windows" value="#{selectBooleanView.windows}" onLabel="Evet" offLabel="Hayır" />

               <h:outputText value="Linux Temelli İşletim Sistemi Kullanıyor musunuz?" />
               <p:selectBooleanButton id="linux" value="#{selectBooleanView.linux}" onLabel="Evet" offLabel="Hayır" onIcon="ui-icon-check" offIcon="ui-icon-close">
                   <p:ajax update="msgs" listener="#{selectBooleanView.addMessage}" />
               </p:selectBooleanButton>
           </h:panelGrid>

           <p:commandButton id="submit" value="Gönder" update="SonuclariGoster" icon="ui-icon-check" oncomplete="PF('dlg').show()" />

           <p:dialog id="Sonuçlar" header="Sonuçlar" modal="true" resizable="false" showEffect="fade" widgetVar="dlg">
               <h:panelGrid columns="1" id="SonuclariGoster">
                   <h:outputText value="Windows: #{selectBooleanView.windowsDialogMessage()}" />
                   <h:outputText value="Linux: #{selectBooleanView.linuxDialogMessage()}" />
               </h:panelGrid>
           </p:dialog>
       </h:form>
   </h:body>
</html>

index sayfamızın içinde <p:growl> etiketi ile ekranda mesajlar görünmesini sağlıyoruz.

Esas konumuz olan Boolean Button işlemini ise <p:selectBooleanButton> etiketi yapıyor. Bu etiketin value bileşeni ile Java tarafında butonun değerini tutacak nesneyi bildiriyoruz. onLabel ve offLabel bileşenleri ile  buton içinde gözükecek yazıları belirliyoruz ancak bu bileşenler arka planda true-false ile işlemini yapıyor. onIcon ve offIcon bileşenleri ile buton içinde tik ve x işaretinin çıkmasını sağlıyoruz.

2. selectBooleanButton ‘ ı kullanırken ajax bileşeni kullanarak değer değişikliğinin anında ekranda görünmesini sağlıyoruz.

Gönder butonuna tıkladığımızda  oncomplete=”PF(‘dlg’).show()” ifadesi ile ekranda, alt satırda yazılı olan dialog penceresinin açılmasını sağlıyoruz. <p:dialog> etiketi ile yazdığımız dialog ekranının widgetVar bileşenine atadığımız değeri commandButonun oncomplete bileşeninde kullanıyoruz.

SelectBooleanView.java Kodu

import javax.faces.application.FacesMessage;
import javax.faces.bean.ManagedBean;
import javax.faces.context.FacesContext;

@ManagedBean
public class SelectBooleanView {

    private boolean windows;
    private boolean linux;

    public boolean isWindows() {
        return windows;
    }

    public void setWindows(boolean windows) {
        this.windows = windows;
    }

    public boolean isLinux() {
        return linux;
    }

    public void setLinux(boolean linux) {
        this.linux = linux;
    }

    public void addMessage() {
        String summary = linux ? "Evet işaretlendi" : "Hayır işaretlendi";
        FacesContext.getCurrentInstance().addMessage(null, new FacesMessage(summary));
    }

    public String windowsDialogMessage()
    {
        if (windows)
            return "Windows Kullanıyorsunuz";
        else
            return "Windows Kullanmıyorsunuz";
    }
    public String linuxDialogMessage()
    {
        if (linux)
            return "Linux Kullanıyorsunuz";
        else
            return "Linux Kullanmıyorsunuz";
    }
}

Java kodumuz içinde addMessage metodu ile 2. selectBooleanButton’un ajax bileşeni içindeki update bileşenine ekrana yazılacak yazı gönderiliyor. Aracılık görevini ajax bileşeninin listener bileşeni yapıyor. Listener’a verilen metotdan dönen sonuç update bileşenine aktarılıyor.

windowsDialogMessage ve linuxDialogMessage metotları ile dialog penceresinde gözükecek yazılar gönderiliyor.

Ekran çıktılarına bakalım.

Adsız

 

Adsız

 

 

 

 

 

 

 

 

 

Bu yazıda da bu kadar arkadaşlar. Gelecek yazıda görüşmek üzere sağlıcakla kalın.

Benzer Yazılar

Yorum Ekle

PrimeFaces-BooleanCheckBox Kullanımı için bir yanıt yazın X