Как отправить форму onclick, как автозаполнение Google с jqueryui? - PullRequest
Новая
       11

Как отправить форму onclick, как автозаполнение Google с jqueryui?

0 голосов
/ 13 февраля 2012

Похоже, что использование категорий с jqueryui немного усложнило ситуацию. Я пробовал это: 

<script type="text/javascript">
$(document).ready(function() {
    $.widget( "custom.catcomplete", $.ui.autocomplete, {
        _renderMenu: function( ul, items ) {
            var self = this,
                currentCategory = "";
            $.each( items, function( index, item ) {
                if ( item.category != currentCategory ) {
                    ul.append( "<li class='ui-autocomplete-category'>" + item.category + "</li>" );
                    currentCategory = item.category;
                }
                self._renderItem( ul, item );
            });
        },

      select: function(event, ui) { 
        $("input#autocomplete_text").val(ui.item.value);
        $("#autocomplete_form").submit();
      }
    });
    $( "#autocomplete_text" ).catcomplete({
        delay: 0,
        source: function(request, response) {
                $.ajax({ url: "<?php echo site_url('autocomplete/suggestions'); ?>",
                data: { term: $("#autocomplete_text").val()},
                dataType: "json",
                type: "POST",
                success: function(data){
                    response(data);
                }
            });
        }
    });
});
</script>

С этой формой: 

                    <form id="autocomplete_form" name="input" action="autocomplete/redirect" method="post">
                        <input size="38" type="text" id="autocomplete_text" name="autocomplete_text" value="İlan kodu, kategori, ilan veya emlakçı ara" />
                        <input type="hidden" id="data" name="data" value="0" />
                        <input class="submit-button" type="submit" value=" EMLAK ARA " />
                    </form>

Мой пример

Что я хочу сделать, это отправить форму после нажатия на элемент в списке предложений.

Любая помощь будет оценена. Заранее спасибо.

Ответы [ 2 ]

1 голос
/ 13 февраля 2012

Удалите функцию select: из функции инициализации ui.autocomplete и переместите ее в функцию catcomplete

Встроенный PHP и зависимость от вашего сервера, отвечающего категориями, делает редактирование для нас вне вашего веб-домена хлопотным.

Рабочий пример jsfiddle минус Ajax. 

<script type="text/javascript">
$(document).ready(function() {
$.widget( "custom.catcomplete", $.ui.autocomplete, {
    _renderMenu: function( ul, items ) {
        var self = this,
            currentCategory = "";
        $.each( items, function( index, item ) {
            if ( item.category != currentCategory ) {
                ul.append( "<li class='ui-autocomplete-category'>" + item.category +   "</li>" );
                currentCategory = item.category;
            }
            self._renderItem( ul, item );
        });
    }
});
$( "#autocomplete_text" ).catcomplete({
    delay: 0,
    select: function(event, ui) { 
    $("#autocomplete_form").submit();
  },
    source: function(request, response) {
            $.ajax({ url: "<?php echo site_url('autocomplete/suggestions'); ?>",
            data: { term: $("#autocomplete_text").val()},
            dataType: "json",
            type: "POST",
            success: function(data){
                response(data);
            }
        });
    }
});
});
</script>
0 голосов
/ 13 февраля 2012

Я предлагаю вам сначала проверить ваш php-файл .. Вы получаете неопределенную переменную: link .., что означает, что переменная $ link не установлена ​​или массив из вашего ajax не проходит через.

...