This forum is in READ-ONLY mode.
You can look around, but if you want to ask a new question, please use the new forum.
Home » legacy support » symfony 1.2 » Using sfWidgetFormJQueryAutocompleter to complete multiple words in a text input field?
Using sfWidgetFormJQueryAutocompleter to complete multiple words in a text input field? [message #75306] Fri, 20 March 2009 16:04 Go to next message
ramshot  is currently offline ramshot
Messages: 7
Registered: November 2008
Junior Member
Greetings,

I have a number of keywords in a database table. I need an input field that will autocomplete the known words, seperated by commas. I've managed to get it to work, but I can't get it to save to the database "as is". I get the primary key of the word entry instead. I must be doing something simple wrong or complete missing something critical, and I'm getting a "bit" frustrated. Please help! Here is my code:

In the form file class:

    $this->widgetSchema['keywords'] = new sfWidgetFormChoice(array('choices' => array()));                                                                                                                     
    $this->widgetSchema['keywords']->setOption('renderer_class', 'sfWidgetFormJQueryAutocompleter');                                                                                                           
    $this->widgetSchema['keywords']->setOption('renderer_options', array(                                                                                                                                      
      'url'    => url_for('exhibition/keywords'),                                                                                                                                                              
      'config' => '{                                                                                                                                                                                           
          width: 320,                                                                                                                                                                                          
          max: 10,                                                                                                                                                                                             
          highlight: false,                                                                                                                                                                                    
          multiple: true,                                                                                                                                                                                      
          multipleSeparator: ", ",                                                                                                                                                                             
          scroll: true,                                                                                                                                                                                        
          scrollHeight: 300                                                                                                                                                                                    
      }'                                                                                                                                                                                                       
    ));                                                                


Action:
  public function executeKeywords($request)
  {
    $this->getResponse()->setContentType('application/json');

    $keywords = KeywordFiPeer::retrieveForSelect($request->getParameter('q'), $request->getParameter('limit'));

    return $this->renderText(json_encode($keywords));
  }


As I've said, that works until I try saving things to the database, in which case I just get the primary key of the last autocompleted word. I've tried using sfWidgetFormInput instead of sfWidgetFormChoice, but then I get an error stating that FormInput doesn't support the renderer_class option. I've also tried giving the multiple => true to the choice widget, but then the autocompleter doesn't seem to load at all.

Just for clarity:

I have one keyword per row in the keyword table.
I have the keywords for the entry as a comma seperated string in the other table, and it needs to stay that way.

What would be the correct way of doing this? Is there a way to tell the auto completer that I want to save the string into the database "as seen"? Thank you in advance!
sfWidgetFormJQueryAutocompleterMany [message #77462 is a reply to message #75306 ] Tue, 28 April 2009 04:13 Go to previous messageGo to next message
antitoxic  is currently offline antitoxic
Messages: 12
Registered: April 2009
Location: London, UK
Junior Member

index.php/fa/1106/0/

-------------------
!UPDATED
- it now supports persistant suggestions culture before submission
- Symfony code snippet: http://snippets.symfony-project.org/snippet/336
-------------------

I've modded the jquery plugin which simulates wordpress / facebook style of adding keywords.

The modifications:
MODED :
* Optimised for dynamic json response:
 - serverside limit and filtration of results could be wired
 - better cache handling
* Key combinations/not content changing keys detection (Ctr+A, Ctr, Shift, Alt, Num lock, Caps Lock, Print screen...)
* Far less unneccessary requests
* Ctr + Space triggers immediate autocompletition/query
* Quick fade animations / Could be turned off
* New options available
* Auto select first element


As it is a plugin it requires jquery. I've made a widget for symfony allowing you to do this:
		$autocompleteWidget = new sfWidgetFormChoice(array(
		  'multiple'         => true,
		  'choices'          => $this->getObject()->getTags(),
		  'renderer_class'   => 'sfWidgetFormJQueryAutocompleterMany',
		  'renderer_options' => array(
			'config' => '{
				json_url: "/tag/autocomplete",
				json_cache: true,
				filter_hide: true,
				filter_selected: true,
				maxshownitems: 8		
			  }')
		));
		$this->widgetSchema['tags_list'] = $autocompleteWidget;

Where tags_list is your one-to-many or many-to-many widget.

The widget is modification as well of the well known sfFormExtraPlugin widget : sfWidgetFormJQueryAutocompleter.
'choices'  => $this->getObject()->getTags(),
marks a portion of the code where you set the collection used in the widget. You can pass (as shown here) object collection and the widget will convert it to list of primary key and value using getPrimaryKey and __toString methods.

It works simply and yet effective as it attach itself in a clean way to a basic multiple select field - rendering the available options and requiring new via asynchronous requests to your url. You can simply include the js and replace an existing select list by doing so:
$("#selectlistID").fcbkcomplete({
            json_url: "your/url",
            json_cache: true,
            filter_case: false,
            filter_hide: true,
            filter_selected: true
          });



You should use associative array to generate the JSON:
array('caption' => (string) $tag->getName(),'value'=> $tag->getPrimaryKey()) ;

Where caption is the text displayed and value is what you identified with.

----------------
The naming convention (sfWidgetFormJQueryAutocompleterMany) is far from original but follows the example of *DoctrineChoice => DoctrineChoiceMany.

I've included a zip containing the widget php class , jquery library itself, js,css and images for the plugin.
The minified version is 13kb.

[Updated on: Sun, 17 May 2009 16:02]


The simple complex - (online ) branding, web design and development
Re: Using sfWidgetFormJQueryAutocompleter to complete multiple words in a text input field? [message #77582 is a reply to message #75306 ] Thu, 30 April 2009 15:20 Go to previous messageGo to next message
trontank  is currently offline trontank
Messages: 179
Registered: July 2008
Location: Germany
Senior Member
@antitoxic
Great widget, thanks for posting.

For some reason it doesn't work 100% for me, though. The widget converts a select list with existing entries properly, but I cannot add new items. The console shows me that the JSON-response is correct, ie:

{"3":"Frank Turner"}

The results never show up though, I am always getting the "No more matches" message.

Thanks for your help!

[Updated on: Thu, 30 April 2009 15:47]

Re: Using sfWidgetFormJQueryAutocompleter to complete multiple words in a text input field? [message #77584 is a reply to message #75306 ] Thu, 30 April 2009 15:48 Go to previous messageGo to next message
antitoxic  is currently offline antitoxic
Messages: 12
Registered: April 2009
Location: London, UK
Junior Member

@trotrank
It seems to me now that the filter of the javascript stops the result from showing up twice. Do you have it already in the list and want to use it again?
If so you should set filter_selected option to false.

I will soon post a snippet @ http://snippets.symfony-project.org/ for the full code of the use of the widget + server side logic that handles the JSON results.


The simple complex - (online ) branding, web design and development
Re: Using sfWidgetFormJQueryAutocompleter to complete multiple words in a text input field? [message #77586 is a reply to message #77584 ] Thu, 30 April 2009 15:56 Go to previous messageGo to next message
trontank  is currently offline trontank
Messages: 179
Registered: July 2008
Location: Germany
Senior Member
antitoxic wrote on Thu, 30 April 2009 15:48

@trotrank
It seems to me now that the filter of the javascript stops the result from showing up twice. Do you have it already in the list and want to use it again?
If so you should set filter_selected option to false.

No, it doesn't matter if a result is already in the list or not. I never get a result, even with a new object that has not been saved to the database yet. Only the "No more matches" message shows up, no matter what I type. Results that are in the list show up in the input field and can be deleted using the "x"-button. I'm using a table with no primary key, does that matter? The getPrimaryKey method returns an id from the result though.

antitoxic wrote on Thu, 30 April 2009 15:48

I will soon post a snippet @ http://snippets.symfony-project.org/ for the full code of the use of the widget + server side logic that handles the JSON results.

That would be great! Can you reply here when the snippet is online?

Thanks a lot!
Re: Using sfWidgetFormJQueryAutocompleter to complete multiple words in a text input field? [message #77606 is a reply to message #75306 ] Thu, 30 April 2009 18:56 Go to previous messageGo to next message
antitoxic  is currently offline antitoxic
Messages: 12
Registered: April 2009
Location: London, UK
Junior Member

@trontank
First quickly to inform I wrote the snippet tutorial like:
http://snippets.symfony-project.org/snippet/336

I now notice that I've forgotten about a key detail in what I've said.
You should use associative array to generate the JSON:
array('caption' => (string) $tag->getName(),'value'=> $tag->getPrimaryKey()) ;

Where caption is the text displayed and value is what you identified with.

It is no core problem Smile

I'll update the post above in a minute.

[Updated on: Thu, 30 April 2009 20:29]


The simple complex - (online ) branding, web design and development
icon14.gif  Re: Using sfWidgetFormJQueryAutocompleter to complete multiple words in a text input field? [message #77608 is a reply to message #75306 ] Thu, 30 April 2009 19:11 Go to previous messageGo to next message
trontank  is currently offline trontank
Messages: 179
Registered: July 2008
Location: Germany
Senior Member
@antitoxic

Thanks a ton! Your widget is exactly what I need for a new project. I'll check your code on monday when I'm back at work and post the results here.

I was thinking about coding a similar widget on my own before I saw this post. Maybe I'll do it anyway just for learning purpose.
Re: Using sfWidgetFormJQueryAutocompleter to complete multiple words in a text input field? [message #77719 is a reply to message #77608 ] Mon, 04 May 2009 13:41 Go to previous messageGo to next message
trontank  is currently offline trontank
Messages: 179
Registered: July 2008
Location: Germany
Senior Member
@antitoxic
Works like a charm now, thanks a lot. There's a small css issue when using the widget in symfony's admin generator which I was able to solve.
Re: Using sfWidgetFormJQueryAutocompleter to complete multiple words in a text input field? [message #77966 is a reply to message #77719 ] Fri, 08 May 2009 02:39 Go to previous messageGo to next message
antitoxic  is currently offline antitoxic
Messages: 12
Registered: April 2009
Location: London, UK
Junior Member

Glad to hear that, trontank

Could you please publish the css corrections so I can save myself some time. I'll update the plugin afterwards.

Thank you.


The simple complex - (online ) branding, web design and development
Re: Using sfWidgetFormJQueryAutocompleter to complete multiple words in a text input field? [message #77978 is a reply to message #77966 ] Fri, 08 May 2009 10:21 Go to previous messageGo to next message
trontank  is currently offline trontank
Messages: 179
Registered: July 2008
Location: Germany
Senior Member
There was only a small issue with the close button, here's the modified CSS (line 25, !important added):

ul.holder li.bit-box a.closebutton { position: absolute; right: 4px; top: 5px; display: block; width: 7px !important; height: 7px; font-size: 1px; background: url('/sfFormExtraPlugin/images/close.gif') no-repeat !important; padding:0 !important }
icon5.gif  Re: Using sfWidgetFormJQueryAutocompleter to complete multiple words in a text input field? [message #78216 is a reply to message #75306 ] Tue, 12 May 2009 22:38 Go to previous messageGo to next message
herringtown  is currently offline herringtown
Messages: 8
Registered: May 2009
Junior Member
Hi there,

Great widget! What would be extremely useful to me would be if there was a way for the widget to provide an extra button to ADD a keyword into the keyword db if the autocomplete query comes up dry.

We allow our users to create their own keywords, so that would be necessary for us to implement this nifty widget..

Thanks,

Greg
Re: sfWidgetFormJQueryAutocompleterMany [message #78537 is a reply to message #77462 ] Sun, 17 May 2009 09:11 Go to previous messageGo to next message
praveenaj  is currently offline praveenaj
Messages: 1
Registered: May 2009
Junior Member
Hello,

I need some help from you dude..
How to get entered values in fcbkComplete field using $_POST ???
I'm gonna use this for a php script..
thanks in advance.
Re: Using sfWidgetFormJQueryAutocompleter to complete multiple words in a text input field? [message #78548 is a reply to message #75306 ] Sun, 17 May 2009 15:50 Go to previous messageGo to next message
antitoxic  is currently offline antitoxic
Messages: 12
Registered: April 2009
Location: London, UK
Junior Member

@herringtown, I'm currently working on this. Every time the comma is pressed a new item is added as the value in the select list is not his primary key (as it does not exist yet) but his text name/value

Then on the serverside you should check which of the values is not numeric and process it.

I just have to wire this.

@praveenaj the widget is meant to be used with symfony. Read the snippet tutorial ( http://snippets.symfony-project.org/snippet/336 ).
If you want to use it standalone use $_GET or modify the javascript to use other method.
I could make changing method as an object option later on.

Smiles,
Anton

[Updated on: Sun, 17 May 2009 15:57]


The simple complex - (online ) branding, web design and development
Re: Using sfWidgetFormJQueryAutocompleter to complete multiple words in a text input field? [message #81813 is a reply to message #78548 ] Tue, 14 July 2009 12:29 Go to previous messageGo to next message
miguelSantirso  is currently offline miguelSantirso
Messages: 10
Registered: May 2008
Location: Oviedo, Spain
Junior Member
antitoxic wrote on Sun, 17 May 2009 15:50

@herringtown, I'm currently working on this. Every time the comma is pressed a new item is added as the value in the select list is not his primary key (as it does not exist yet) but his text name/value

Then on the serverside you should check which of the values is not numeric and process it.


Oh, great! I was just thinking how to achieve exactly that, but I'm glad to know that you are working on it. I'm using it and it works perfect... That is the only thing it lacks now.
Re: Using sfWidgetFormJQueryAutocompleter to complete multiple words in a text input field? [message #97584 is a reply to message #75306 ] Mon, 19 April 2010 10:25 Go to previous messageGo to next message
aszrool  is currently offline aszrool
Messages: 8
Registered: March 2010
Junior Member
I got the warning after trying to use this widget.

Warning: Invalid argument supplied for foreach() in C:\www\sfprojects\invy\plugins\sfFormExtraPlugin\lib\widget\ sfWidgetFormJQueryAutocompleterMany.class.php on line 106.

It's working but this warning is annoying me, how I can get rid of this matter?
Re: Using sfWidgetFormJQueryAutocompleter to complete multiple words in a text input field? [message #101916 is a reply to message #75306 ] Fri, 02 July 2010 16:39 Go to previous message
matz  is currently offline matz
Messages: 32
Registered: March 2010
Member
Antitoxic, your widget works on symfony 1.4??
Previous Topic:call or Share a partial from 2 applications.
Next Topic:[Solved] Only save ONE of my EmbeddedForm
Goto Forum:
  

powered by FUDforum - copyright ©2001-2004 FUD Forum Bulletin Board Software