Changeset 929


Ignore:
Timestamp:
2008-12-03 17:21:22 (4 years ago)
Author:
freya
Message:

forms sample: sample pages to show 3 ways to define a form

Location:
trunk
Files:
8 edited

Legend:

Unmodified
Added
Removed
  • trunk/modules/kauri-forms/kauri-forms-jqgrid/src/main/kauri/templates/snippet/jqgrid.xml

    r922 r929  
    22<t:if test="${true}" xmlns:t="http://kauriproject.org/template"> 
    33     
    4     <link rel="stylesheet" type="text/css" media="screen" href="${publicUri('service:/main/themes/basic/grid.css')}" /> 
    54    <link rel="stylesheet" type="text/css" media="screen" href="${publicUri('service:/main/themes/jqModal.css')}" /> 
    65 
  • trunk/samples/kauri-forms-sample/src/main/kauri/pages/basic-controls1.html.xml

    r922 r929  
    5151    
    5252       
    53       <h1>Basic kauri form</h1> 
     53      <h2>Basic kauri form</h2> 
    5454      <p> 
    55         We'll define this form in js and define the layout in html. 
     55        We'll define this form in js and define the layout in html. Remark the kauri-idref attributes which do the coupling. 
    5656      </p> 
    5757      <fieldset> 
  • trunk/samples/kauri-forms-sample/src/main/kauri/pages/basic-controls2.html.xml

    r922 r929  
    5151    
    5252       
    53       <h1>Basic kauri form</h1> 
     53      <h2>Basic kauri form</h2> 
    5454      <p> 
    55         We define this form only in Javascript. The html is generated by Kauri. 
     55        We define this form only in Javascript. The html is generated by Kauri. The only thing needed in the html is a form tag with the id equals the id argument given to the Kauri forms constructor.  
    5656      </p> 
    5757      <fieldset> 
  • trunk/samples/kauri-forms-sample/src/main/kauri/pages/basic-controls3.html.xml

    r922 r929  
    1313                    base: 'string', 
    1414                    '+validators': { 'isEmail': {} }, 
    15                 }, 
    16                 'birthday': { 
    17                     base: 'date', 
    18                     yearRange: '-100:+0', 
    1915                } 
     16            }, 
     17        controlTypes:{ 
     18            birthday:{ 
     19                base:'date-control', 
     20                yearRange:'-100:+0' 
    2021            } 
     22        }             
    2123     }; 
    2224 
     
    3638    
    3739       
    38       <h1>Basic kauri form</h1> 
     40      <h2>Basic kauri form</h2> 
    3941      <p> 
    40         We'll define this form in js and define the layout in html. 
     42        We'll define this sample form mainly in html, only the fieldtypes with custom properties are defined in Javascript: 
     43        <ul> 
     44            <li>The email fieldType with an email validator</li> 
     45            <li>The birthday fieldType with a yearRange</li> 
     46        </ul> 
    4147      </p> 
    4248      <fieldset> 
     
    5763                    <tr> 
    5864                        <td><label kauri-role="label" kauri-idref="birthday">Your date of birth</label></td> 
    59                         <td><span kauri-idref="birthday" kauri-type="date"/></td>        
     65                        <td><span kauri-idref="birthday" kauri-type="date" kauri-control="birthday"/></td>        
    6066                        <td><span kauri-idref="birthday" kauri-role="messages"/></td> 
    6167                    </tr> 
  • trunk/samples/kauri-forms-sample/src/main/kauri/pages/grid.html.xml

    r922 r929  
    2121                {name:'description',index:'description', jsonmap:'description', resizable:true} 
    2222                ]; 
    23          
    2423        var rows;     
    2524       
  • trunk/samples/kauri-forms-sample/src/main/kauri/templates/css.xml

    r906 r929  
    66    <![endif]-->   
    77   
     8  <!-- JQgrid css --> 
     9  <link rel="stylesheet" type="text/css" media="screen" href="${publicUri('service:/jqgrid/themes/sand/grid.css')}" /> 
     10   
    811  <!-- datepicker css --> 
    9   <link rel="stylesheet" type="text/css" href="${publicUri('service:/jquery/ui/themes/flora/flora.all.css')}"></link> 
    10   <link rel="stylesheet" type="text/css" href="${publicUri('service:/forms/css/datepicker.css')}"></link> 
     12  <link rel="stylesheet" type="text/css" href="${publicUri('service:/jquery/ui/jquery.ui-1.5.2/themes/flora/flora.all.css')}"></link> 
     13  <link rel="stylesheet" type="text/css" href="${publicUri('service:/jquery/ui/jquery.ui-1.5.2/themes/ui.datepicker.css')}"></link> 
    1114  <style type="text/css"> 
    1215    table.ui-datepicker td { 
  • trunk/samples/kauri-forms-sample/src/main/kauri/templates/data/sample-form.xml

    r806 r929  
    66 
    77    <script type="text/javascript" src="${publicUri('service:/jquery/jquery.js')}"></script> 
    8     <script type="text/javascript" src="${publicUri('service:/jquery-ui/ui/jquery.ui.all.js')}"></script> 
    9     <script type="text/javascript" src="${publicUri('service:/forms/kauri-forms.js')}"></script> 
     8    <script type="text/javascript" src="${publicUri('service:/jquery/ui/jquery.ui.all.js')}"></script> 
     9    <script type="text/javascript" src="${publicUri('service:/forms/static/js/kauri-forms.js')}"></script> 
    1010     
    1111    <!-- think about externalized form-models later  
  • trunk/samples/kauri-forms-sample/src/main/kauri/templates/layout/menu.xml

    r916 r929  
    66        <li><a href="basic-controls2.html">Kauri form: js</a></li> 
    77        <li><a href="basic-controls3.html">Kauri form: mainly html</a></li> 
     8        <li><a href="collection-controls.html">Collection controls</a></li> 
     9        <li><a href="advanced-controls.html">Advanced controls</a></li> 
    810        <li><a href="grid.html">A JQgrid example</a></li> 
    911      </ul> 
Note: See TracChangeset for help on using the changeset viewer.