inputEx - Lenses Usage

Basic lens creation

Use the following code to create a basic inputEx lens.

Lena
(click to edit)
lat:48.821332549646634,long:1.47216796875
1var g = new inputEx.Lens({ 
2    parentEl: 'container1', 
3    fields: [ 
4        { typeInvite: 'Firstname',name: 'firstname'  },   
5        { typeInvite: 'Lastname', name: 'lastname' }, 
6        { typeInvite: 'Email', name: 'email' }, 
7        { type: 'url', name: "picUrl", typeInvite: 'url' }, 
8        { type: 'map', name: "position", width: '800px', api: 'google'} 
9    ], 
10    value: { 
11        firstname: 'Lena', 
12        email: 'lena@doe.org', 
13        picUrl: 'http://www.limsi.fr/Individu/vezien/lena.jpg', 
14        position: {"lat":48.821332549646634,"lon":1.47216796875,"nzoom":6,"uzoom":-6} 
15    }, 
16 
17 
18 
19    lens: "<div class='field-picUrl'></div>"+ 
20                "<div style='float: left;'><div class='field-firstname'></div></div>"+ 
21                "<div style='float: left;'><div class='field-lastname'></div></div>"+ 
22                "<div style='clear: both;'></div>"+ 
23                "<div class='field-email'></div>"+ 
24                "<div class='field-position'></div>", 
25 
26    visus: [ 
27        null, 
28        null, 
29        { visuType: 'func', func: function(val) { return "<a href='mailto:"+val+"'>"+val+"</a>"; } }, 
30        { visuType: 'func', func: function(val) { return '<img src="'+val+'" style="width: 128px; height: 128px;">'; } }, 
31        { visuType: 'func', func: function(val) { return 'lat:'+val.lat+',long:'+val.lon; } } 
32    ] 
33}); 
view plain | print | ?