JWorld@TW the best professional Java site in Taiwan
      註冊 | 登入 | 全文檢索 | 排行榜  

» JWorld@TW » AJAX討論區 » 開發工具  

按列印兼容模式列印這個話題 列印話題    把這個話題寄給朋友 寄給朋友    訂閱主題
reply to topicthreaded modego to previous topicgo to next topic
本主題所含的標籤
作者 [EZo範例] 使用EZo事件模型調用後端.Net程式
EZoService





發文: 15
積分: 0
於 2012-04-05 16:42 user profilesend a private message to usersend email to EZoServicereply to postreply to postsearch all posts byselect and copy to clipboard. 
ie only, sorry for netscape users:-)add this post to my favorite list
以下是 EZo 的開發架構 示意圖
這次將為大家介紹 如何使用 Event 來調用 後端的 .NET 程式



使用EZo事件模型調用後端.Net程式

當畫面元件需要搭配後端.Net程式運作時,可以透過EZo事件模型來調用後端程式,例如在登入視窗中,將輸入的帳號密碼送到後端做檢查



以事件模型調用後端.Net程式類別為例的GUL語法如下:
1
2
3
4
5
6
7
8
9
10
11
12
13
<page layout='vrow'>
  <row data='300,30,0'>
    <toolbar id='bar1' msgWidth='50%'>
      <field type='btn' label='送出' onclick='bean:loginBean.login:f' />
    </toolbar>
  </row>
  <row data='300,100,0'>
    <form id='f' heading='Login Panel' width='250'>
      <field type='txt' label='使用者名稱'  name='userName' />
      <field type='txt' label='使用者密碼'  name='password' pwd='true' />
    </form>
  </row>
</page>

事件模型調用的語法為: bean:loginBean.login:f
其中loginBean為.Net程式類別名稱,login為function名稱,調用時攜帶的參數f,f為表單元件的Id,即表單內的資訊(註1),這些參數都會根據EventBus的傳輸規範,即前端元件的資料格式皆為JSON物件,包裝成一個.Net的OrderedDictionary物件來作為傳入後端調用程式的參數(key為元件Id或元件Id.屬性,value則為元件資訊),以下為EventBus的傳輸資料格式(註2)

1
2
3
4
5
6
7
8
{
  "e" : "x",
  "id" : "loginBean.login.",
  "t" : "map",
  "i" : {
      "f" : {"userName":"john","password":"12345"}
  }
}


EventBus會根據規則調用後端的.Net程式類別名稱中的function名稱,此login方法的參數為.Net的Dictionary型別而回傳型別為OrderedDictionary型別,執行完後再將相關的資訊根據EventBus的規範回傳,即key為元件Id或元件Id.屬性,value為元件資訊的Dictionary物件

.Net程式範例
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
 class LoginBean {   
 
    Private Function login(ByVal infoMap As Dictionary(Of String, String)) As OrderedDictionary
        Dim infoOutDic As OrderedDictionary = New OrderedDictionary
        Dim formData As Dictionary(Of String, String) = infoMap.Item("f") '取得登入資料
        Dim userName As String = formData.Item("userName")
        Dim password As String = formData.Item("password")
 
        Dim ds As New DataSet
        Dim strPath As String = System.Web.HttpContext.Current.Server.MapPath("~/Data/Data.xml")
        ds.ReadXml(strPath)
        Dim row() As Data.DataRow = ds.Tables(0).Select("userName='" & userName & "' and password='" & password & "'")
 
        If row.Length > 0 Then
            infoOutDic.Add("toolBar", "登入成功")
        Else
            infoOutDic.Add("toolBar", "登入失敗")
        End If
        infoOutDic.Add("f", formData)
        infoOutDic.Add("bar1", "登入成功")
        Return infoOutDic
    End Function
 
}


如果檢查帳號密碼正確,可以將訊息回傳到前端工具列元件的訊息欄上




使用AJAX調用後端.Net程式

如果使用JQuery的AJAX來調用後端程式,則前端GUL的程式範例為
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
<page layout='vrow'>
  <row data='300,30,0'>
    <toolbar id='bar1' msgWidth='50%'>
      <field type='btn' label='送出' onclick='js:submit' />
    </toolbar>
  </row>
  <row data='300,100,0'>
    <form id='f' heading='Login Panel' width='250'>
      <field type='txt' label='使用者名稱'  name='userName' />
      <field type='txt' label='使用者密碼'  name='password' pwd='true' />
    </form>
  </row>
 
  <js id='submit'><![CDATA[
    var form = gk.get('f'); 
    $.ajax({
      url: "event/put/x/LoginBean.login.go",
      type: 'post',
      dataType : 'json',
      data : "j={'i':{'f':{'userName':'"+form.userName+"','password':'"+form.password+"'}},'t':'map'}",
      success: function(data) {
        gk.set('bar1', data.i.f.userName+"登入成功");    
      }
    });
  ]]></js>
 
</page>

調用的程式根據EventBus的規範,在url指定調用的程式類別名稱及function名稱,data則為本次要攜帶的參數,執行成功後可將資訊再設定回畫面元件


註1:事件模型及語法請參考 開發架構裡面的核心技術章節
註2:EventBus規範及JSON資料格式請參考 開發架構裡面的EventBus章節


EZoService edited on 2012-04-05 16:44
reply to postreply to post
EZo = 易組 : 在瀏覽器上容易組裝的開發平台
EZo 官方網站: http://www.EZoUI.com/
UIBuilder 粉絲團:http://www.facebook.com/EZoUI
EZo UIBuilder 部落格: http://EZoUI.wordpress.com
» JWorld@TW »  AJAX討論區 » 開發工具

reply to topicthreaded modego to previous topicgo to next topic
  已讀文章
  新的文章
  被刪除的文章
Jump to the top of page

JWorld@TW 本站商標資訊

Powered by Powerful JuteForum® Version Jute 1.5.8