Created
September 9, 2011 21:11
-
-
Save tynovsky/1207351 to your computer and use it in GitHub Desktop.
Autocomplete: jqueryUI + Nette
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <?php | |
| use Nette\Application\UI\Form; | |
| use Nette\Application\Responses\JsonResponse; | |
| class HomepagePresenter extends BasePresenter | |
| { | |
| private $data = array( | |
| "pozdrav" => array( | |
| 'ahoj', 'nazdar', 'cau', 'ahojda', 'nazdarecek', 'caues' | |
| ) | |
| ); | |
| protected function createComponentMyForm() | |
| { | |
| $form = new Form; | |
| $form->addText('pozdrav', 'Pozdrav:'); | |
| $form->addSubmit('save', 'Save'); | |
| $form->onSubmit[] = callback($this, 'submitted'); | |
| return $form; | |
| } | |
| public function submitted(Form $form) { | |
| $this->flashMessage(print_r($form->values, TRUE)); | |
| $this->redirect('this'); | |
| } | |
| public function renderAutocomplete($whichData, $typedText = '') | |
| { | |
| $matches = preg_grep("/$typedText/i", $this->data[$whichData]); | |
| $this->sendResponse(new JsonResponse($matches)); | |
| } | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> | |
| <meta name="description" content="Nette Framework web application skeleton"> | |
| <meta name="robots" content="{$robots}" n:ifset="$robots"> | |
| <title>Nette Application Skeleton</title> | |
| <link rel="stylesheet" media="screen,projection,tv" href="{$basePath}/css/screen.css" type="text/css"> | |
| <link rel="stylesheet" media="screen,projection,tv" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/themes/base/jquery-ui.css" type="text/css"> | |
| <link rel="stylesheet" media="print" href="{$basePath}/css/print.css" type="text/css"> | |
| <link rel="shortcut icon" href="{$basePath}/favicon.ico" type="image/x-icon"> | |
| <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"></script> | |
| <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/jquery-ui.min.js"></script> | |
| <script type="text/javascript" src="{$basePath}/js/netteForms.js"></script> | |
| {block head}{/block} | |
| </head> | |
| <body> | |
| <div n:foreach="$flashes as $flash" class="flash {$flash->type}">{$flash->message}</div> | |
| {include #content} | |
| </body> | |
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| {block content} | |
| <style> | |
| .ui-autocomplete-loading { background: white url('images/ui-anim_basic_16x16.gif') right center no-repeat; } | |
| #city { width: 25em; } | |
| </style> | |
| <script> | |
| $(function() { | |
| var select_name = "pozdrav"; | |
| $("input[name=" + select_name + "]").autocomplete({ | |
| source: function( request, response ) { | |
| $.ajax({ | |
| url: "{!$presenter->link('autocomplete')}", | |
| data: { | |
| whichData: select_name, | |
| typedText: request.term | |
| }, | |
| success: function( data ) { | |
| response( $.map( data, function( item ) { | |
| return { label: item, value: item } | |
| })); | |
| } | |
| }); | |
| }, | |
| minLength: 2, | |
| open: function() { | |
| $(this).removeClass("ui-corner-all").addClass("ui-corner-top"); | |
| }, | |
| close: function() { | |
| $(this).removeClass("ui-corner-top").addClass("ui-corner-all"); | |
| } | |
| }); | |
| }); | |
| </script> | |
| {control myForm} | |
| {/block} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment