Tuesday, January 31, 2012

JSP သင္ခန္းစာ ၅

pizza.html

[html]
  [head]
    [title]Take The Pizza[/title]
    [style type="text/css"]
      H1 {
        font-size: 12pt;
        font-weight: bold;
      }
    [/style]
  [/head]
  [body]
    [form action="process.jsp" method="post"]
      [p]
      Welcome to Take the Pizza Online! We're eager to take your order
      for pizza via our new web form.
      [/p]
      [p]
      Please fill out the fields below and click on "Place Order" when
      you're done.
      [/p]
      [h1]Your Information:[/h1]
      [table]
        [tr]
          [td]
            Name:
          [/td]
          [td]
            [input type="text" name="name" size="30"/]
          [/td]
        [/tr]
        [tr]
          [td]
            Address:
          [/td]
          [td]
            [textarea rows="4" cols="40" name="address"][/textarea]
[!--
            [input type="text" name="address" size="70"/]
--]
          [/td]
        [/tr]
      [/table]

      [h1]Order Type:[/h1]
      [table]
        [tr]
          [td]
            [input type="radio" name="purchaseType" value="Home Delivery" checked="true"/]
          [/td]
          [td]
            Home Delivery
          [/td]
        [/tr]
        [tr]
          [td]
            [input type="radio" name="purchaseType" value="Take Away"/]
          [/td]
          [td]
            Take Away
          [/td]
        [/tr]
      [/table]

      [h1]Please Select Any Additional Toppings:[/h1]
      [table]
        [tr]
          [td]
            [input type="checkbox" name="topping" value="Peppers"/]
          [/td]
          [td]
            Peppers
          [/td]
        [/tr]
        [tr]
          [td]
             [input type="checkbox" name="topping" value="Sweetcorn"/]
          [/td]
          [td]
            Sweetcorn
          [/td]
        [/tr]
        [tr]
          [td]
            [input type="checkbox" name="topping" value="Mouse innards"/]
          [/td]
          [td]
            Mouse Innards
          [/td]
        [/tr]
      [/table]
      [h1]Pizza Size:[/h1]
      [table]
        [tr]
          [td]
            Size:
          [/td]
          [td]
            [select name="size"]
              [option]Small[/option]
              [option selected="true"]Medium[/option]
              [option]Large[/option]
            [/select]
          [/td]
        [/tr]
      [/table]

      [input type="submit" value="Place Order"/]
    [/form]
  [/body]
[/html]

http မွာ GET, POST,DELETE,TRACE အပါအ၀င္ တျခား method တစ္ခ်ိဳ႕ရိွပါတယ္။ jsp အပါအ၀င္ server side programming laguage ေတြမွာေတာ႔ Get နဲ႕ Post ကိုပဲ အဓိကသံုးၾကပါတယ္။ get method ကို အသံုးျပဳရင္ url မွာ parameter ေတြကိုျမင္ရပါတယ္။ url ရဲ႕ character limitation လည္းရိွပါတယ္။ parameter ေတြသိပ္မ်ားေနရင္ url ရွည္လာျပီး limit ေက်ာ္တဲ႔ျပႆနာရိွႏိုင္သလို၊ plain text နဲ႕ value ေတြကို url မွာျမင္ေနရတာလည္း security အရမေကာင္းပါဘူး။ post မွာေတာ႔ ဒီျပႆနာမရိွပါဘူး။ url ထဲမွာလည္း  parameter ေတြမျပသလို၊ url limitation ေက်ာ္တာမ်ိဳးလည္းမရိွႏိုင္ပါဘူး။

  [form action="process.jsp" method="post"]

ဆိုတာေလးကိုၾကည္႕လုိက္ပါ။ form တစ္ခုမွာ action နဲ႕ method ဆိုတာကိုေတြ႕ရပါတယ္။ action ဆိုတာကေတာ႔ ဒီ form ကို submit လုပ္လုိက္ရင္ ဘယ္သြားမလဲဆိုတာပါပဲ။ တကယ္လုိ႕ action="http://google.com" ဆိုရင္ form ကို submit လုပ္တဲ႔အခ်ိန္မွာ google.com ကိုသြားပါလိမ္႔မယ္။ အခုဒီေနရာမွာ process.jsp ဆိုတဲ႔အတြက္ process.jsp ကုိသြားပါလိမ္႔မယ္။ process.jsp ေရွ႕မွာ ဘာမွထူးေထြညႊန္ျပမေနတဲ႔အတြက္ အခု pizza.html နဲ႕folder တစ္ခုတည္းမွာရိွတယ္လုိ႕ယူဆရပါမယ္။ method="post" ဆိုတဲ႔ေနရာမွာ method="get" နဲ႕လည္းစမ္းၾကည္႕ႏုိင္ပါတယ္။ method ကိုမထည္႕ဘဲ စမ္းၾကည္႕ရင္ get မလား post မလားဆိုတာေလးလည္း စူးစမ္းသင္႔ပါတယ္။

process.jsp

[html]
  [head]
    [title]Your details[/title]
    [style type="text/css"]
      H1 {
        font-size: 12pt;
        font-weight: bold;
      }
    [/style]
  [/head]

  [body]
    [h1]Your Details[/h1]

    [table]
      [tr]
        [td]Name: [/td]
        [td]${param.name}[/td]
      [/tr]
      [tr]
        [td]Address:[/td]
        [td]${param.address}[/td]
      [/tr]
      [tr]
        [td]Delivery type:[/td]
        [td]${param.purchaseType}[/td]
      [/tr]
      [tr]
        [td]Toppings:[/td]
        [td]${paramValues.topping[0]}[/td]
      [/tr]
      [tr]
        [td][/td]
        [td]${paramValues.topping[1]}[/td]
      [/tr]
      [tr]
        [td][/td]
        [td]${paramValues.topping[2]}[/td]
      [/tr]
      [tr]
        [td]Pizza size:[/td]
        [td]${param["size"]}[/td]
      [/tr]
    [/table]

    [p]Thank you for ordering.[/p]

  [/body]
[/html] 

ဒီမွာစိတ္၀င္စားစရာေကာင္းတာတစ္ခုေတြ႕ရပါမယ္။ ဟိုဘက္ကေနပို႕လုိက္တဲ႔ parameter ေတြကို ဒီဘက္ကေနျပန္ၾကည္႕တာပါ။ ဒါမ်ိဳးေတြကို confirmation page ေတြမွာသံုးေလ႔ရိွပါတယ္။ ေသခ်ာျပီလား ...၊ ဒါေတြမွန္တယ္ေနာ္ဆိုျပီး ျပတဲ႔အခါမ်ိဳးေတြမွာ $ sign ေလးနဲ႕ paramater ေတြကို ျပန္ထုတ္ျပီး ျပတာမ်ိဳးပါ။ Servlet မွာေရးေရးေနတဲ႔ HttpRequest ရဲ႕ getParameter ဆိုတဲ႔ method ပါပဲ။ အတိုေလးပဲေရးရတာ လက္ေညာင္းသက္သာပါတယ္။

${param.name}
ဒါကို EL နဲ႕ေရးတယ္လုိ႕ေခၚပါတယ္။ ေရွ႕မွာ %% နဲ႕တစ္ခုေရးျပခဲ႔တာေတြ႕မွာပါ။ အဲဒါကိုၾကေတာ႔ scriptlet လုိ႕ေခၚပါတယ္။ scriptlet ကို အေၾကာင္းႏွစ္မ်ိဳးေၾကာင္႔ မသံုးသင္႔ဘူးလို႕ဆိုပါတယ္။ ပထမတစ္ခ်က္က horribly structured and difficult to maintain ပါ။  ဒါကေတာ႔ရွင္းပါတယ္။ java code ဗလပြနဲ႕ဆိုရင္ ေရးတဲ႔သူေတာင္ code လုိင္း ႏွစ္ရာေလာက္ဆိုရင္ စျပီး အူလည္လည္နဲ႕ရွာရေတာ႔ပါမယ္။ အဲဒီလူ အလုပ္ထြက္ျပီး ေနာက္၀င္လာတဲ႔သူကေတာ႔ တစ္ေန႕တစ္ေန႕ ေရွ႕ကလူကို ေမတၱာပို႕ေနပါလိမ္႔မယ္။ ဒုတိယတစ္ခ်က္က Designer ေတြအတြက္ မ်က္စိေနာက္လုိ႕ပါ။ သူတုိ႕ရဲ႕ design process မွာ java code ေတြက မ်က္စိေနာက္စရာေကာင္းပါတယ္။ ညစ္ပတ္ေနသလိုေတာင္ျဖစ္ေနပါတယ္။ အဲဒါေတြေၾကာင္႔ scriptlet ကို မသံုးဖုိ႕ ေမတၱာရပ္ၾကပါတယ္။ ဒါေပမယ္႔ စင္ကာပူမွာေတာ႔ နားမေထာင္ဘူးခင္ဗ်။ ၾကံဳသလိုေရးၾကပါတယ္။ 

ဒါေလးကိုၾကည္႕ျပီး pizza မွာၾကည္႕လုိ႕ရပါျပီ။ html code ေတြကိုေတာ႔ အေထြအထူးမရွင္းေတာ႔ပါဘူး။
http://localhost:8080/jsp-example/pizza.html မွာ pizza မွာၾကည္႕လုိက္ပါဦး။

Regards,
Zero

No comments: