JSF Ders26 - JSF Ajax


    Ajax desteği sayfa üzerinde sadece gerekli yerlerde güncellemeler yapabilmeye yarar.
Mesela ajax kullanmadığınızı varsayalım. Bir formu doldurdunuz ve göndereceksiniz.Form gönderilir ve cevap olarak yeni bir sayfa gönderilir.  Ajax'ı kullandığınızda ise formu gönderirsiniz ve cevap olarak aynı sayfa üzerinde sadece küçük bir yeri değiştirecek bilgi gönderilir ve o kısım güncellenmiş olur.


<h:commandButton … action="…">
     <f:ajax render="deneme"/>
</h:commandButton>

<h:outputText … value="#{…}" id="deneme"/>

Yukarıda ajax kullanımına bir örnek verilmiştir.

Siz commandButona bastığınızda gelişecek olaylar aşağıda sıralanmıştır.
  • Form sunucuya gönderilir.
  • id="deneme" olan sonuç hesaplanır ve istemciye gönderilir.
  • İstemci tarafında id="deneme" olan çıktı yerleştirilir.
Ajax Attributeleri
  • render   : Sayfada tekrar gösterilecek elemanları belirtir. (outputText vs.)
  • execute : Sunucuda işlenecek elemanları belirtir. (inputText vs.)
  • event     : keyup,blur gibi DOM olaylarını belirtir.
  • onevent : event meydana geldiğinde çalıştırılacak javascript metodunu belirtir.
Ajax kullanılırken action kısmındaki metodun return değeri null olmalıdır. Uygulama ajaxı destekliyorsa sayfanın belli bir kısmı güncelleneceği anlamına gelir.Uygulama ajaxı desteklemiyorsa tüm sayfa yenilenir. Fakat her halükarda çalışmış olur.

index.xhtml

<h:commandButton … action="#{test.metot1}">
     <f:ajax render="deneme"/>
</h:commandButton>

<h:outputText … value="#{…}" id="deneme"/>


 Test.java

public String metot1(){
   return (null);
}

  • render ve execute kısmında idyi kullanmak yerine @this, @form, @none veya @all kullanılabilir.
    • @this default değerdir. Sadece o öğe için çalışır.
    • @form tüm form için çalışır.
    • @none hiçbir şey için çalışmaz.
    • @all tüm sayfa için çalışır.

Personel.java 
package test;

import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;

@SessionScoped
@ManagedBean
public class Test {

 private String ad;
 private String[] yas={"18-25","26-35","36+"};
 private String yasim;
 private String ugurluSayi;
 private String idim;
 
 public String olustur(){
  int random=(int)((Math.random()*98)+1);
  idim=ad+ugurluSayi+random;
  return null;
 }
 
 public String getAd() {
  return ad;
 }

 public void setAd(String ad) {
  this.ad = ad;
 }

 public String[] getYas() {
  return yas;
 }

 public void setYas(String[] yas) {
  this.yas = yas;
 }

 public String getYasim() {
  return yasim;
 }

 public void setYasim(String yasim) {
  this.yasim = yasim;
 }

 public String getUgurluSayi() {
  return ugurluSayi;
 }

 public void setUgurluSayi(String ugurluSayi) {
  this.ugurluSayi = ugurluSayi;
 }

 public String getIdim() {
  return idim;
 }

 public void setIdim(String idim) {
  this.idim = idim;
 }
}

index.xhtml 
<!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:f="http://java.sun.com/jsf/core"
      xmlns:h="http://java.sun.com/jsf/html">
 
 <h:head>
  <title>index.jsf</title>
  <h:outputStylesheet library="css" name="stil.css"/>
 </h:head>
 
 <h:body>
  <h:form>
  <div id="f1">
  AD<br/>
  <h:inputText value="#{test.ad}">
   <f:ajax event="keyup" render="ad"/>
  </h:inputText><br/><br/>
  YAS<br/>
  <h:selectOneRadio value="#{test.yasim}">
   <f:selectItems value="#{test.yas}"/>
   <f:ajax render="yas"/>
  </h:selectOneRadio><br/><br/>
  Ugurlu Sayi<br/>
  <h:inputText value="#{test.ugurluSayi}" id="sayi"/><br/><br/>
  <h:commandButton value="ID olustur" action="#{test.olustur}">
   <f:ajax execute="sayi" render="idim"/>
  </h:commandButton>
  </div>
  <div id="f2">
  AD<br/>
  <h:outputText value="#{test.ad}" id="ad"/><br/><br/><br/>
  YAS<br/>
  <h:outputText value="#{test.yasim}" id="yas"/><br/><br/>
  ID<br/>
  <h:outputText value="#{test.idim}" id="idim"/>
  </div>
  </h:form>
 </h:body>
</html>

stil.css 
@CHARSET "UTF-8";

#f1, #f2 {
 display: inline-block;
 border: 2px dotted black;
 padding: 20px;
 height: 300px;
 width: 250px;
 vertical-align: middle;
 text-align: center;
 background-color: gray;
 color: white;
 border-radius: 12px;
 font-size: 21px;
}

input[type="submit"]{
 border-radius:12px;
 padding:5px;
 color:green;
 background-color:yellow;
 font-weight:bold;
 font-size:21px;
}

input[type="text"]{
 border-radius:12px;
 padding:5px;
 font-weight:bold;
 font-size:16px;
}

JSF Ajax

Yorumlar

Yorum Gönder

Bu blogdaki popüler yayınlar

Java SE Ders24 - Composition (Kompozisyon)

Resim
   Composition (Kompozisyon) bir sınıf içerisinde başka bir sınıfın nesnesini oluşturma durumudur. Composition (Kompozisyon) kalıtıma (inheritance) alternatif olarak kullanılır. Sınıflar kalıtımda olduğu gibi hiyerarşik bir yapıda bulunmaz. Composition birleşim olarak da adlandırılır. Şimdi örnek programı yapalım. Main.java package test; public class Main { public static void main(String[] args) { EvcilHayvan e= new EvcilHayvan( "kedi" , "rifki" , 5 ); Kisi k= new Kisi( "enes" , 25 ,e); k. yazdir (); } } Kisi.java package test; public class Kisi { private String ad; private int yas; private EvcilHayvan e; public Kisi(String ad, int yas){ this . ad =ad; this . yas =yas; } public Kisi(String ad, int yas,EvcilHayvan e){ this . ad =ad; this . yas =yas; this . e =e; } public String getAd() { return ad; } public void setAd(String ad) { this . ad = ad; } public int getYas() {
Devamı

Spring Ders20 - Aspect Oriented Programming - AspectJ Annotation Style

Resim
   Spring frameworkünde AspectJ anotasyon stilinin kullanımı old stile göre kontrol edilmesi ve kullanılması kolaydır. Spring anotasyon stilindeki anotasyonlar @Aspect                 : Aspect sınıfı tanımlar. @Pointcut              : Kesme noktası tanımlar. @Before                 : Before advice tanımlar. Metot çağrılmadan önce çalışır. @After                   : After advice tanımlar. Metot çağrıldıktan sonra çalışır. @AfterReturning  :  AfterReturning advice tanımlar. Metot return ettikten sonra çalışır. @Around               : Around advice tanımlar. Metot çağrılmadan önce ve sonra çalışır. @AfterThrowing  : AfterThrowing advice tanımlar. Metot istisna (exception) attıktan sonra çalışır. Poincut kavramı @Pointcut(“execution (* Test.*(..))”) private void metot1(){..} Test sınıfındaki tüm metotlara pointcut ismi olarak metot1 metodu uygulanacağı anlamını taşır. @Pointcut(“execution (public * *(..))”) private void metot1(){..} Tüm
Devamı

JSF Ders30 - Page Template (Sayfa Şablonu)

Resim
    Page Template (Sayfa Şablonu), bir sayfaya daha önce oluşturulan sayfa/sayfa içeriğini dahil etmeye yarar. Örneğin birçok sayfada kullanılan bir arama kutusu, her sayfada tek tek oluşturulmak yerine tek bir sefer oluşturularak bu sayfayı/sayfa içeriğini kullanılacak sayfalara kolayca dahil edilir.   Aşağıda bir template (şablon) sayfa oluşturulumu ve onun kullanışı gösterilmiştir. sablon.xhtml <!DOCTYPE ...> <html xmlns="http://www.w3.org/1999/xhtml"            xmlns:h="http://xmlns.jcp.org/jsf/html"            xmlns:ui="http://xmlns.jcp.org/jsf/facelets"> <h:head> </h:head> <h:body> <ui:insert name="d1">default yazı</ui:insert> <ui:insert name="d2">default yazı2</ui:insert> <ui:insert name="d3">default yazı3</ui:insert> </h:body> </html> <ui:composition xmlns="http://www.w3.org/1999/xhtml&
Devamı