Edwin Wang's Blog

If there were no clouds, we should not enjoy the sun～～～ edwin-wang.com
  博客园 :: 首页 :: 博问 :: 闪存 :: 新随笔 :: 联系 :: 订阅 订阅 :: 管理 ::
Atlas上手（二）
　　从Web Service返回一数组，使用Atlas ListView组件显示

Default.aspx的html部分
 1<div id="content">
 2  <div class="left">
 3
 4      <div id="searchResults">
 5      </div>
 6
 7      <div style="display: none;">
 8          <div id="searchResults_layoutTemplate">
 9              <ul id="searchResults_itemTemplateParent">
10                  <li id="searchResults_itemTemplate">
11                  <span id="searchResults_Name"></span>
12                  <span id="searchResults_Category"></span>
13                  <span id="searchResults_Color"></span></li>
14              </ul>
15          </div>
16      </div>
17      
18  </div>
19</div>
20

text/xml-script部分

 1<script type="text/xml-script">
 2  <page xmlns:script="http://schemas.microsoft.com/xml-script/2005">
 3    <components>
 4      <textBox id="Text1">
 5        <behaviors>
 6          <autoComplete serviceURL="AnimalService.asmx" 
 7              serviceMethod="GetCompletionList" 
 8              minimumPrefixLength="1" 
 9              completionList="Text1__autocomplete" />
10        </behaviors>
11      </textBox>
12      <listView id="searchResults" 
13          cssClass="listView" 
14          itemTemplateParentElementId="searchResults_itemTemplateParent" 
15          alternatingItemCssClass="alternatingItem" 
16          itemCssClass="item">
17        <layoutTemplate>
18          <template layoutElement="searchResults_layoutTemplate" />
19        </layoutTemplate>
20        <itemTemplate>
21          <template layoutElement="searchResults_itemTemplate">
22            <label id="searchResults_Name">
23              <bindings>
24                <binding dataPath="Name" property="text" />
25              </bindings>
26            </label>
27            <label id="searchResults_Category">
28              <bindings>
29                <binding dataPath="Category" property="text" />
30              </bindings>
31            </label>
32            <label cssClass="bar" id="searchResults_Color">
33              <bindings>
34                <binding dataPath="Color" property="text" />
35              </bindings>
36            </label>
37          </template>
38        </itemTemplate>
39      </listView>
40    </components>
41    <references>
42    </references>
43  </page>
44</script>

从WebService绑定ListView部分
 1<script language="javascript" type="text/javascript">
 2    function Button1_onclick() {
 3        Quickstart.Samples.Data.AnimalService.GetAnimals($("Text1").value, 
 4           onSearchComplete);
 5    }
 6    
 7    function onSearchComplete(results) {
 8        var searchResults = $("searchResults");
 9        searchResults.control.set_data(results);
10    }
11</script>

Default.aspx完整代码
 1<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
 2<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
 3<head>
 4  <title>Simple</title>
 5  <link type="text/css" rel="stylesheet" href="simple.css" />
 6
 7    <atlas:ScriptManager ID="scriptManager" runat="server">
 8        <Services>
 9            <atlas:ServiceReference Path="AnimalService.asmx" />
10        </Services>
11    </atlas:ScriptManager>
12
13</head>
14<body>
15  <form id="form1" name="form1" runat="server">
16      <div id="logo">
17          <h1>
18              Simple</h1>
19      </div>
20      <div id="header">
21          Search:
22          <input id="Text1" type="text" /><span id="Text1__autocomplete"></span>
23          <input id="Button1" type="button" value="Search" onclick="Button1_onclick();" />
24          <br />
25          (enter Cat, Cow, Dog or Parrot)
26      </div>
27      <!-- Main Content -->
28      <div id="content">
29          <div class="left">
30              <div id="searchResults">
31              </div>
32              <div style="display: none;">
33                  <div id="searchResults_layoutTemplate">
34                      <ul id="searchResults_itemTemplateParent">
35                          <li id="searchResults_itemTemplate">
36                          <span id="searchResults_Name"></span>
37                          <span id="searchResults_Category"></span>
38                          <span id="searchResults_Color"></span></li>
39                      </ul>
40                  </div>
41              </div>
42          </div>
43      </div>
44</form>
45
46  <script type="text/xml-script">
47  <page xmlns:script="http://schemas.microsoft.com/xml-script/2005">
48    <components>
49      <textBox id="Text1">
50        <behaviors>
51          <autoComplete serviceURL="AnimalService.asmx" serviceMethod="GetCompletionList" minimumPrefixLength="1" completionList="Text1__autocomplete" />
52        </behaviors>
53      </textBox>
54      <listView id="searchResults" cssClass="listView" itemTemplateParentElementId="searchResults_itemTemplateParent" alternatingItemCssClass="alternatingItem" itemCssClass="item">
55        <layoutTemplate>
56          <template layoutElement="searchResults_layoutTemplate" />
57        </layoutTemplate>
58        <itemTemplate>
59          <template layoutElement="searchResults_itemTemplate">
60            <label id="searchResults_Name">
61              <bindings>
62                <binding dataPath="Name" property="text" />
63              </bindings>
64            </label>
65            <label id="searchResults_Category">
66              <bindings>
67                <binding dataPath="Category" property="text" />
68              </bindings>
69            </label>
70            <label cssClass="bar" id="searchResults_Color">
71              <bindings>
72                <binding dataPath="Color" property="text" />
73              </bindings>
74            </label>
75          </template>
76        </itemTemplate>
77      </listView>
78    </components>
79    <references>
80    </references>
81  </page>
82</script>
83
84    <script language="javascript" type="text/javascript"> 
85        function Button1_onclick() {
86            Quickstart.Samples.Data.AnimalService.GetAnimals(document.getElementById("Text1").value, onSearchComplete);
87        }
88        
89        function onSearchComplete(results) {
90            var searchResults = document.getElementById("searchResults");
91            searchResults.control.set_data(results);
92        }
93    </script>
94
95</body>
96</html>

AnimalService.asmx完整代码
  1<%@ WebService Language="C#" Class="Quickstart.Samples.Data.AnimalService" %>
  2
  3using System;
  4using System.Web;
  5using System.Collections;
  6using System.Collections.Generic;
  7using System.Web.Services;
  8using System.Web.Services.Protocols;
  9
 10namespace Quickstart.Samples.Data
 11{
 12    public class Animal
 13    {
 14        String _name;
 15        String _category;
 16        String _color;
 17        
 18        public String Name
 19        {
 20            get { return _name; }
 21            set { _name = value; }
 22        }
 23
 24        public String Category
 25        {
 26            get { return _category; }
 27            set { _category = value; }
 28        }
 29        
 30        public String Color
 31        {
 32            get { return _color; }
 33            set { _color = value; }
 34        }
 35
 36        public Animal(String name, String category, String color)
 37        {
 38            _name = name;
 39            _category = category;
 40            _color = color;
 41        }
 42    };    
 43    
 44    [WebService(Namespace = "http://tempuri.org/")]
 45    [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
 46    public class AnimalService : System.Web.Services.WebService
 47    {
 48        [WebMethod]
 49        public string[] GetCompletionList(string prefixText, int count)
 50        {
 51            prefixText = prefixText.ToLower();
 52            string[] categories = {
 53                "Cat",
 54                "Dog",
 55                "Cow",
 56                "Parrot",
 57            };
 58            
 59            List<string> suggestions = new List<string>();
 60            foreach (string category in categories)
 61            {
 62                if (category.ToLower().StartsWith(prefixText))
 63                {
 64                    suggestions.Add(category);
 65                }
 66            }
 67            return suggestions.ToArray();
 68        }        
 69        
 70        [WebMethod]
 71        public Animal[] GetAnimals(String searchText)
 72        {
 73            List<Animal> _data = GetAllAnimals();
 74
 75            if (String.IsNullOrEmpty(searchText))
 76            {
 77                return _data.ToArray();
 78            }
 79
 80            List<Animal> _dataFiltered = new List<Animal>();
 81            foreach (Animal animal in _data)
 82            {
 83                if (searchText.ToLower().CompareTo(animal.Category.ToLower()) == 0)
 84                    _dataFiltered.Add(animal);
 85            }
 86
 87            return _dataFiltered.ToArray();
 88        }
 89
 90        List<Animal> GetAllAnimals()
 91        {
 92            List<Animal> _data = new List<Animal>();
 93
 94            _data.Add(new Animal("Felix", "Cat", "Grey"));
 95            _data.Add(new Animal("Fido", "Dog", "Brown"));
 96            _data.Add(new Animal("Rover", "Dog", "Brown"));
 97            _data.Add(new Animal("Daisy", "Cow", "Black and White"));
 98            _data.Add(new Animal("Polly", "Parrot", "Green"));
 99
100            return _data;
101        }       
102    }
103}

图：


　　在返回部分看起来还是有点问题，继续研究，这些都是asp.net上的QuickStart，只是拿来学习一下，至于轩说为什么都是些这种东西，我的想法是闲着也是闲着还不如看点东西学点东西的，说明一下进度，总不至于躺在那里就凭瞎想吧
　　礼拜一去学校了，载了点书应该够我看的了^_^
posted on 2006-07-01 12:49  laughterwym  阅读(407)  评论(6)    收藏  举报