Don't like ads? PRO users don't see any ads ;-)
Public Pastes
Guest

Untitled

By: a guest on Apr 30th, 2012  |  syntax: None  |  size: 2.69 KB  |  hits: 19  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. How to submit form onclick like google's autosuggest with jqueryui?
  2. <script type="text/javascript">
  3. $(document).ready(function() {
  4.     $.widget( "custom.catcomplete", $.ui.autocomplete, {
  5.         _renderMenu: function( ul, items ) {
  6.             var self = this,
  7.                 currentCategory = "";
  8.             $.each( items, function( index, item ) {
  9.                 if ( item.category != currentCategory ) {
  10.                     ul.append( "<li class='ui-autocomplete-category'>" + item.category + "</li>" );
  11.                     currentCategory = item.category;
  12.                 }
  13.                 self._renderItem( ul, item );
  14.             });
  15.         },
  16.  
  17.       select: function(event, ui) {
  18.         $("input#autocomplete_text").val(ui.item.value);
  19.         $("#autocomplete_form").submit();
  20.       }
  21.     });
  22.     $( "#autocomplete_text" ).catcomplete({
  23.         delay: 0,
  24.         source: function(request, response) {
  25.                 $.ajax({ url: "<?php echo site_url('autocomplete/suggestions'); ?>",
  26.                 data: { term: $("#autocomplete_text").val()},
  27.                 dataType: "json",
  28.                 type: "POST",
  29.                 success: function(data){
  30.                     response(data);
  31.                 }
  32.             });
  33.         }
  34.     });
  35. });
  36. </script>
  37.        
  38. <form id="autocomplete_form" name="input" action="autocomplete/redirect" method="post">
  39.                         <input size="38" type="text" id="autocomplete_text" name="autocomplete_text" value="İlan kodu, kategori, ilan veya emlakçı ara" />
  40.                         <input type="hidden" id="data" name="data" value="0" />
  41.                         <input class="submit-button" type="submit" value=" EMLAK ARA " />
  42.                     </form>
  43.        
  44. <script type="text/javascript">
  45. $(document).ready(function() {
  46. $.widget( "custom.catcomplete", $.ui.autocomplete, {
  47.     _renderMenu: function( ul, items ) {
  48.         var self = this,
  49.             currentCategory = "";
  50.         $.each( items, function( index, item ) {
  51.             if ( item.category != currentCategory ) {
  52.                 ul.append( "<li class='ui-autocomplete-category'>" + item.category +   "</li>" );
  53.                 currentCategory = item.category;
  54.             }
  55.             self._renderItem( ul, item );
  56.         });
  57.     }
  58. });
  59. $( "#autocomplete_text" ).catcomplete({
  60.     delay: 0,
  61.     select: function(event, ui) {
  62.     $("#autocomplete_form").submit();
  63.   },
  64.     source: function(request, response) {
  65.             $.ajax({ url: "<?php echo site_url('autocomplete/suggestions'); ?>",
  66.             data: { term: $("#autocomplete_text").val()},
  67.             dataType: "json",
  68.             type: "POST",
  69.             success: function(data){
  70.                 response(data);
  71.             }
  72.         });
  73.     }
  74. });
  75. });
  76. </script>
create a new version of this paste RAW Paste Data