[Seaside] AutoCompleter

John Thornborrow john at pinesoft.co.uk
Fri Apr 18 15:43:13 UTC 2008


Hi,

I've recently investigated this area, but didn't get far as the
requirement was removed.

What I started playing with is attached as a fileOut (Blah.st)

Hope this helps.

Regards,
John.


Edward Stow wrote:
> On Fri, Apr 18, 2008 at 5:13 PM, Lukas Renggli <renggli at gmail.com> wrote:
>> 1. You need to store the autocompleter object in a JavaScript variable.
>>
>>  2. Then in the onSelected: event you can access the method
>>  selectedIndex and serialize it to the client together with the
>>  contents of the form element.
>>
>>  That looks somehow like this (as usual I haven't tested):
>>
>>
>>    html div
>>       class: 'autocomplete';
>>       script: (html autocompleter
>>          element: 'text';
>>          assignTo: 'auto';
>>          onSelected: (html request
>>             callback: [ :value | index := value asInteger ]
>>                value: (html autocompleter
>>                    alias: 'auto';
>>                    selectedIndex);
>>             triggerFormElement: 'text')
>>
> Thanks -- this did not work and because I cannot mentally grasp how
> this works ... I have concocted a different solution that includes a
> unique identifier from each item displayed. The steps are:
> 
> 1.  Created a subclass of WAUnOrderedListTag and reimplement:
> 
> TrUnOrderedEventListTag>>renderListItem:labelled:
> 	canvas listItem
> 		id: anObject eventId;  <-- my object has a unique string id
>         ... remainder deleted.
> 
> This step would be unnecessary if  rendering of the id value were
> pluggable such as with #labels:
> 
> 2.  MyComponent>renderContentOn: is pretty straight forward now:
> 
> MyComponent>renderContentOn: html
> 	html paragraph: [
> 		html textInput
> 			id: 'text';
> 			value: text;
> 			callback: [ :value | text := value ].
> 		html div
> 			class: 'autocomplete';
> 			script: (html autocompleter
> 				element: 'text';
> 				onSelected: (self selectionHandlerOn: html );
> 				on: #renderListOn: of: self) ]
> 
> 3.  Write a fuction such that the AJAX.Autocompleter
> afterUpdateElement event handler is defined with two arguments - the
> text and lineItem values.  Return in the function body the lineItem id
> value.
> 
> MyComponent>selectionHandlerOn: html
> 	^(html request
> 		callback: [:value | value inspect ]
> 		value: (SUStream new nextPutAll: 'li.id'))
>                     asFunction arguments: #('text' 'li')
> 
> I'm sure there is a better way to write the request function body.  I
> think its a disadvantage to know javascript ... as it always seems
> much easier to write the expected output javascript than it is to
> write the javascript generation in Smalltalk.
> 
> 4.  Include the #labels: block in #renderListOn: .  Render the
>       items is a collection of my domain objects.
> 
> MyComponent>>renderListOn:
>         .... item generation removed ...
> 	(html brush: TrUnOrderedEventListTag new)
> 		labels: [:each | each eventName];
> 		list: (items first: (items size min: 10))
> 
> To my mind -- this may have been the long way round to the solution
> but now each step does not appear to depend on blackmagic.
> 

-- 
John Thornborrow
http://www.pinesoft.co.uk


******************************************************************************************************************************************
This email is from Pinesoft Limited. Its contents are confidential to the intended recipient(s) at the email address(es) to which it has been addressed. It may not be disclosed to or used by anyone other than the addressee(s), nor may it be copied in anyway. If received in error, please contact the sender, then delete it from your system. Although this email and attachments are believed to be free of virus, or any other defect which might affect any computer or IT system into which they are received and opened, it is the responsibility of the recipient to ensure that they are virus free and no responsibility is accepted by Pinesoft for any loss or damage arising in any way from receipt or use thereof. *******************************************************************************************************************************************


Pinesoft Limited are registered in England, Registered number: 2914825. Registered office: 266-268 High Street, Waltham Cross, Herts, EN8 7EA
-------------- next part --------------
'From Squeak3.10beta of 22 July 2007 [latest update: #7159] on 18 April 2008 at 4:42:10 pm'!
WAComponent subclass: #Blah
	instanceVariableNames: 'text'
	classVariableNames: ''
	poolDictionaries: ''
	category: 'MyStuff'!

!Blah methodsFor: 'data' stamp: 'jmt 4/18/2008 16:37'!
list
	^ OrderedCollection new
		add: 'foo';
		add: 'bar';
		add: 'foobar';
		add: 'supercalifragalisticexpialidocious';
		add: 'antidisestablishmentarianism';
		yourself! !

!Blah methodsFor: 'data' stamp: 'jmt 4/18/2008 16:35'!
listItems
	^ self list select: [ :each | each includesSubstring: text caseSensitive: false ]! !


!Blah methodsFor: 'rendering' stamp: 'jmt 4/18/2008 16:41'!
renderContentOn: html
	html textInput
		id: 'text';
		callback: [ :x | text := x ];
		value: text.
	html div
		class: 'autocomplete';
		script: (html autocompleter
			element: 'text';
			assignTo: 'auto';
			onSelected: (html request
				callback: [ :value | (self listItems at: (value asInteger + 1)) inspect ]
				value: (html autocompleter alias: 'auto'; selectedIndex));
			on: #renderListOn: of: self)! !

!Blah methodsFor: 'rendering' stamp: 'jmt 4/18/2008 16:36'!
renderListOn: html
	html unorderedList list: self listItems! !

"-- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- "!

Blah class
	instanceVariableNames: ''!

!Blah class methodsFor: 'as yet unclassified' stamp: 'jmt 3/25/2008 12:49'!
canBeRoot
	^ true! !


More information about the seaside mailing list