JQuery UI автозаполнение не работает с воспламенителем кода - PullRequest
0 голосов
/ 11 мая 2011

То, что я хочу сделать, просто.Я хочу, чтобы пользователь мог вводить имя, и при вставке воспламенителя кода пользовательский интерфейс JQuery просматривает базу данных и начинает публиковать рекомендации. Так что это то, что я получил до сих пор с небольшой помощью от кого-то здесь, на stackoverflow ...Но он все еще не работает вообще.

Команда пользовательского интерфейса Jquery

$("#update-text").autocomplete({source:"<?php echo site_url('userProfile/autocomplete');?>",dataType:"json", type:'POST'});

Форма, содержащая текстовое поле в файле php

<div>
<form method="post" action="#" name="updatePlanForm">
<div class="ui-widget">
<label for="update-text"></label>
<input type="text" id="update-text" name="updateText" value="What are you gonna do today?" onclick="removeText()"/>
</div>
<input type="button" class="small green button" value="Update Plan" name="updatePlanButton"/> <!-- once clicked JQuery sends a post to a controller send_plan and jquery will return the view -->
</form>
</div>

И, наконец, у меня естьконтроллер с именем userProfile, и в нем есть функция с именем autocomplete

function autocomplete(){
    // this takes the text field and whatever the user writes it autocompletes it.
    //Every single place and event in the database should be displayed in this view in this format
    $req = $this->input->post('updateText');

  $arrResults = array('orange', 'apple', 'bannana');

  $array = array_filter($arrResults, 'mycallback');
  // filter the array containing search word using call back function

  function mycallback ($var) {
    global $req;

    if (preg_match('/^'.$req.'/', $var)) {
      return $var;
    }
  }

  $array1 = array();

  // filter null array
  foreach ($array as $arr => $val) {
    if(!empty($val)) {
      $array1[] = $val;
    }
  }

  //echo out the json encoded array
  echo json_encode($array1);




    }

Для @ Andrew

<!-- styles -->
<link rel="stylesheet" type="text/css" href="<?php echo base_url().''?>public/styles/general.css"/>
<link rel="stylesheet" type="text/css" href="<?php echo base_url().''?>public/styles/homepage.css"/>
<link rel="stylesheet" type="text/css" href="<?php echo base_url().''?>public/styles/css-buttons.css"/>
<link rel="stylesheet" type="text/css" href="<?php echo base_url().''?>public/styles/colors.css"/>
<link rel="stylesheet" type="text/css" href="<?php echo base_url().''?>public/plugin/jqui/css/south-street/jquery-ui-1.8.11.custom.css"/>


<!-- scripts -->
<script type="text/javascript" src="<?php echo base_url().''?>public/scripts/removeTextClick.js"></script>
<script type="text/javascript" src="<?php echo base_url().''?>public/scripts/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="<?php echo base_url().''?>public/plugin/jqui/js/jquery-ui-1.8.11.custom.min.js"></script>



<script type="text/javascript">

$(document).ready(function(){

    $("#abso").hide();
    $("#close").hide();

    $("#activity-feed").load("<?php echo site_url('userProfile/update_plan_feed');?>"); // if removed from userProfile then change here too
    $("#places-feed").load("<?php echo site_url('userProfile/suggested_places_feed');?>"); // if removed from userProfile then change here too
    $("#events-feed").load("<?php echo site_url('userProfile/suggested_events_feed');?>"); // if removed from userProfile then change here too




    $("#list-friends-feed-link").click(function(){ //start click

        $("#abso").load("<?php echo site_url('userProfile/list_freinds');?>");
        $("#abso").slideDown("600", function(){});
        $("#close").slideDown("600", function(){});

    }); //end click

    $("#list-pictures-feed-link").click(function(){ //start click

        $("#abso").load("<?php echo site_url('userProfile/pic_feed');?>");

        $("#abso").slideDown("600", function(){});
        $("#close").slideDown("600", function(){});
    }); //end click

    $("#list-groups-feed-link").click(function(){ //start click

        $("#abso").load("<?php echo site_url('userProfile/list_groups');?>");

        $("#abso").slideDown("600", function(){});
        $("#close").slideDown("600", function(){});
    }); //end click

    $("#notify").click(function(){ //start click

        $("#abso").load("<?php echo site_url('userProfile/list_notifications');?>");

        $("#abso").slideDown("600", function(){});
        $("#close").slideDown("600", function(){});
    }); //end click

    $("#close").click(function(){ //start click

        $("#abso").slideUp("600",function(){});
        $("#close").slideUp("600",function(){});
    }); //end click

    $("#broadcast-button").click(function(){

        $.post("<?php echo site_url('userProfile/send_broadcast'); ?>", $("#broadcast-form").serialize());

        });


    $("#update-text").autocomplete({source:"<?php echo site_url('userProfile/autocomplete');?>",dataType:"json", type:'POST'});


});


</script>
добавлен следующий код

1 Ответ

1 голос
/ 11 мая 2011

Вы хотите изменить свою конфигурацию, чтобы правильно настроить автоматическое завершение:

$("#update-text").autocomplete("<?php echo site_url('userProfile/autocomplete');?>", {dataType:"json", type:'POST'});

РЕДАКТИРОВАТЬ: кроме того, в текущем плагине автозаполнения нет опции type , о которой я не знаю, что вызывает проблемы с фильтрацией URL-адресов CI (как видно из кода на 1006 *https://github.com/agarzola/jQueryAutocompletePlugin/blob/master/jquery.autocomplete.js). Возможно, вам потребуется изменить код автозаполнения, чтобы использовать POST.

РЕДАКТИРОВАТЬ: вы, похоже, используете реализацию пользовательского интерфейса jQuery, а не отдельную версию. Глядя на опции, описанные в http://jqueryui.com/demos/autocomplete/, вы не можете передать опции dataType и type на верхнем уровне: они не поддерживаются. Кроме того, вы должны изменить свой метод codeigniter, чтобы он выглядел так (определите mycallback перед его использованием):

  function autocomplete(){
    // this takes the text field and whatever the user writes it autocompletes it.
    //Every single place and event in the database should be displayed in this view in this format
    $req = $this->input->post('updateText');

  $arrResults = array('orange', 'apple', 'bannana');

  function mycallback ($var) {
    global $req;

    if (preg_match('/^'.$req.'/', $var)) {
      return $var;
    }
  }

  $array = array_filter($arrResults, 'mycallback');
  // filter the array containing search word using call back function

  $array1 = array();

  // filter null array
  foreach ($array as $arr => $val) {
    if(!empty($val)) {
      $array1[] = $val;
    }
  }

  //echo out the json encoded array
  echo json_encode($array1);
}

РЕДАКТИРОВАТЬ 2: чтобы использовать POST для ваших запросов, попробуйте это:

$("#update-text").autocomplete({ source: function( request, response ) {
                    $.post( "<?php echo site_url('userProfile/autocomplete');?", {
                        updateText: split(request.term).pop();
                    }, response );
                }});

Кроме того, если вы используете Firefox, вы можете использовать Firebug, чтобы убедиться, что запросы выполняются.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...