Changeset 1375

Show
Ignore:
Timestamp:
20/11/09 14:04:04 (3 months ago)
Author:
karel
Message:

Autocomplete control now uses the json representation of the selected object instead of using a valueTemplate.
This way the developer can no longer choose what the wirevalue looks like, but now it is possible to set an initial wirevalue using the same object structures

Files:

Legend:

Unmodified
Added
Removed
Modified
Copied
Moved

  • trunk/modules/kauri-forms/kauri-forms-extra/src/main/kauri/static/autocomplete/js/autocomplete.js

    r1372 r1375  
    2828    $.extend(AutocompleteControl.prototype.elements, { 
    2929        input : { 
    30             /* Kauri Forms needs an input-role element, but we don't, therefore 
     30            /* Kauri Forms needs an input-role element, but we don't (want to use the 'input' role), therefore 
    3131               simply create a hidden div. */ 
    3232            create : "<div style='display:none'/>" 
    …… 
    4747        var me = this; 
    4848         
    49         var inputTemplate = new kp.UriTemplate(this.inputTemplate, {skipEscape: true}); 
    50         var listTemplate  = new kp.UriTemplate(this.listTemplate, {skipEscape: true}); 
    51         var valueTemplate = new kp.UriTemplate(this.valueTemplate, {skipEscape: true}); 
     49        this.inputTemplate = new kp.UriTemplate(this.inputTemplate, {skipEscape: true}); 
     50        this.listTemplate  = new kp.UriTemplate(this.listTemplate, {skipEscape: true}); 
    5251         
    5352        var jqOptions = { 
    …… 
    5655            var parsed = []; 
    5756            for (var i=0;i<data.length;i++) { 
    58               parsed.push({ data: data[i], value: valueTemplate.expand(data[i], true), result: inputTemplate.expand(data[i], true)}); 
     57              parsed.push({ data: data[i], value: data, result: me.inputTemplate.expand(data[i], true)}); 
    5958            } 
    6059            return parsed; 
    6160          }, 
    6261          formatItem: function(data, current, last) { 
    63             return listTemplate.expand(data, true); 
     62            return me.listTemplate.expand(data, true); 
    6463          } 
    6564        }; 
    …… 
    6968         
    7069        $acinput.autocomplete(this.dataUri, jqOptions).bind("result", function(event, objData, valueData) { 
    71           me.setValue(valueData); 
     70          me.setValue(objData); 
    7271        }); 
    7372         
    …… 
    8887 
    8988    AutocompleteControl.prototype.setValue = function(value) { 
    90         // FIXME: implement? 
    9189        this["<super.call>"]("setValue", [value]); 
     90        if (value === undefined) { 
     91          $acinput.val(); 
     92        } else { 
     93          //$acinput.val(this.inputTemplate.expand(value, true)); 
     94        } 
     95    } 
     96 
     97    AutocompleteControl.prototype.getWireValue = function() { 
     98      var t = this.getValue(); 
     99      var s = JSON.stringify(t); 
     100      return JSON.stringify(this.getValue()); 
     101    } 
     102 
     103    AutocompleteControl.prototype.setWireValue = function(wireValue) { 
     104      if (wireValue === undefined) { 
     105        this.setValue(undefined); 
     106        $acinput.val(''); 
     107      } else { 
     108        this.setValue(JSON.parse(wireValue)); 
     109        $acinput.val(this.inputTemplate.expand(this.getValue(), true)); 
     110      } 
    92111    } 
    93112 

  • trunk/samples/kauri-forms-sample/src/main/kauri/pages/autocomplete-control.html.xml

    r1370 r1375  
    1919                      "base": "autocomplete-control", 
    2020                      "dataUri": "${publicUri('service:/data/contact/')}", 
    21                       "valueTemplate": "value:{id}", 
    2221                      "inputTemplate": "input:{id} - {name}", 
    2322                      "listTemplate": "list:{id} - {name} {email}" 
    …… 
    2928      $(function() { 
    3029          var form1 = new jQuery.org.kauriproject.forms.Form("form1", fconf); 
     30          window.form1 = form1 
    3131      }) 
    3232    </script> 
    …… 
    4545      </fieldset> 
    4646    </form> 
    47  
    48 <!--      
    49     <h3>jquery (no control)</h3> 
    50      
    51     Select a contact: <input type="text" id="jq-contact"/> 
    52     <script> 
    53     $(function() { 
    54      
    55       var kp = $.org.kauriproject; 
    56       var inputTemplate = new kp.UriTemplate("{email}"); 
    57       var listTemplate  = new kp.UriTemplate("{id} - {email})"); 
    58       var valueTemplate = new kp.UriTemplate("{id}"); 
    59        
    60       $("#jq-contact").autocomplete("${publicUri('service:/data/contact')}", { 
    61         dataType: "json", 
    62         parse: function(data) { 
    63           var parsed = []; 
    64           for (var i=0;i&lt;data.length;i++) { 
    65             parsed.push({ data: data[i], value: valueTemplate.expand(data[i], true), result: inputTemplate.expand(data[i], true)}); 
    66           } 
    67           return parsed; 
    68         }, 
    69         formatItem: function(data, current, last) { 
    70           return listTemplate.expand(data, true); 
    71         } 
    72       }).bind("result", function(event, objData, valueData) { 
    73         alert('You selected ' + valueData); 
    74       }); 
    75     }); 
    76     </script> 
    77  --> 
    7847  </t:block> 
    7948 

  • trunk/samples/kauri-forms-sample/src/main/kauri/pages/basic-controls1.html.xml

    r1374 r1375  
    108108            </tr> 
    109109            <tr> 
    110               <td><label kauri-role="label" kauri-idref="tip-of-the-day"/></td> 
    111               <td><span style="width:200px;height:150px" kauri-idref="tip-of-the-day" kauri-role="input"/></td> 
    112               <td><span kauri-idref="tip-of-the-day" kauri-role="messages"/></td> 
     110              <td><label kauri-role="label" kauri-idref="tip-of-the-day1"/></td> 
     111              <td><span style="width:200px;height:150px" kauri-idref="tip-of-the-day1" kauri-role="input"/></td> 
     112              <td><span kauri-idref="tip-of-the-day1" kauri-role="messages"/></td> 
    113113            </tr> 
    114114            <tr>