Как изменить это с Prototype на jQuery? - PullRequest
Новая
       7

Как изменить это с Prototype на jQuery?

1 голос
/ 15 января 2010

Я хочу преобразовать следующий файл Prototype.js в jQuery. 

window.onload = function () {
    new Ajax.Autocompleter("function_name", "autocomplete_choices", 
    base_url+"application/ajaxsearch/", {});

    $('function_search_form').onsubmit = function () {
        inline_results();
        return false;   
    }
}

function inline_results() {
    new Ajax.Updater ('function_description', 
    base_url+'application/ajaxsearch', 
    {method:'post', postBody:'description=true&function_name='+$F('function_name')});
    new Effect.Appear('function_description');

}

HTML следующий 

<form id="function_search_form" method="post" 
action="http://127.0.0.1/ci_sample/index.php/application/search">
    <div>
        <label for="function_name">Search by function name </label>
        <input type="text" name="function_name" id="function_name" />
        <input type="submit" value="search" id="search_button" />

        <div id="autocomplete_choices" class="autocomplete"></div>
    </div>
    </form>

Ответы [ 2 ]

1 голос
/ 15 января 2010

Вам понадобится плагин для автозаполнения для первой части, а остальное следует: 

$(function(){

  // without knowing the return data, I'm shooting in the dark here
  $.post(base_url+"application/ajaxsearch/", function(results) {
    // pass results (html?) into our 'autocomplete' DIV
    $("#autocomplete_choices").html(results);
  });

  // Handle the form submission
  $("#function_search_form").submit(function(){
    inline_results();
    return false;
  });

});

function inline_results() {
  $.post(base_url+"application/ajaxsearch", {'description':true, 'function_name':$("#function_name").val()}, function(results){
    $("#function_description").html(results).fadeIn("slow");
  });
}
0 голосов
/ 15 января 2010

Возможно много других способов, но вот что я получил.

Вам может понадобиться плагин для автозаполнения, например так: http://docs.jquery.com/Plugins/Autocomplete

Остальная часть кода будет выглядеть примерно так: 

$(document).ready(function(){
 //auto completer code

 $('#function_search_form').submit(function(){
  inline_results();
  return false;
 });
});

function inline_results() {
 $("#function_description").load(base_url + 'application/ajaxsearch', 'description=true&function_name=' + $('#id-of-function_name-element').val());
 $("#function_descritpion").show('normal');
}

Вам также следует рассмотреть возможность использования .serialize () для значений формы.

...