[Sommaire] [Imprimer]

   1  <com:TContent ID="body">
   2  
   3  <h1>TRepeater Sample 3</h1>
   4  
   5  <p>
   6  The following example allows users to modify the existing tabular data using a <tt>TRepeater</tt>. Two validators are used in the repeater to ensure the validity of user inputs. One is to ensure product names are not empty, the other ensures product prices are valid numeric format. After clicking on the <tt>save</tt> button, the input data is displayed in a table at the bottom of the page.
   7  </p>
   8  
   9  <table>
  10  <tr>
  11    <th>Name</th>
  12    <th>Category</th>
  13    <th>Price</th>
  14    <th>Imported</th>
  15  </tr>
  16  <com:TRepeater ID="Repeater" OnItemDataBound="repeaterDataBound">
  17  <prop:ItemTemplate>
  18  <tr>
  19    <td>
  20    <com:TTextBox
  21         ID="ProductName"
  22         Text=<%#$this->DataItem['name']%> />
  23    </td>
  24    <td>
  25    <com:TDropDownList
  26         ID="ProductCategory" />
  27    </td>
  28    <td>
  29    <com:TTextBox
  30         ID="ProductPrice"
  31         Columns="7"
  32         Text=<%#$this->DataItem['price']%> />
  33    </td>
  34    <td>
  35    <com:TCheckBox
  36         ID="ProductImported"
  37         Checked=<%#$this->DataItem['imported']%> />
  38    <com:TRequiredFieldValidator
  39         ControlToValidate="ProductName"
  40         ErrorMessage="Product name cannot be empty."
  41         Display="Dynamic" />
  42    <com:TRegularExpressionValidator
  43         ControlToValidate="ProductPrice"
  44         RegularExpression="\d+(\.\d{1,2})?"
  45         ErrorMessage="Product price must be in the format of ddd.dd"
  46         Display="Dynamic" />
  47    </td>
  48  </tr>
  49  </prop:ItemTemplate>
  50  </com:TRepeater>
  51  </table>
  52  
  53  <div>
  54  <com:TButton Text="Save" OnClick="saveInput"/>
  55  </div>
  56  
  57  <com:TSafeHtml>
  58  <com:TRepeater ID="Repeater2" EnableViewState="false">
  59  
  60  <prop:HeaderTemplate>
  61  <table cellpadding="2">
  62  <tr style="color:white;background-color:black">
  63    <th>ID</th>
  64    <th>Name</th>
  65    <th>Category</th>
  66    <th>Price</th>
  67    <th>Imported</th>
  68  </tr>
  69  </prop:HeaderTemplate>
  70  
  71  <prop:ItemTemplate>
  72  <tr style="<%# 'background-color:' . ($this->ItemIndex%2 ? '#BFCFFF' : '#E6ECFF') %>">
  73  <td><%#$this->DataItem['id']%></td>
  74  <td><%#$this->DataItem['name']%></td>
  75  <td><%#$this->DataItem['category']%></td>
  76  <td><%#$this->DataItem['price']%></td>
  77  <td><%#$this->DataItem['imported']?'Yes':'No'%></td>
  78  </tr>
  79  </prop:ItemTemplate>
  80  
  81  <prop:FooterTemplate>
  82  <tr style="color:white;background-color:black;text-align:center;">
  83  <td colspan="5">Computer Parts Inventory</td>
  84  </tr>
  85  </table>
  86  </prop:FooterTemplate>
  87  
  88  </com:TRepeater>
  89  
  90  </com:TSafeHtml>
  91  
  92  </com:TContent>