div内の検索結果を表示して新しい結果を追加

Question

私は過去4日間このトピックについてどのように良い方法を探していましたが、何も見つかりませんでした。さらに悪い。私は達成しようとしているものの良い記述を考えることができません。

たとえば、Dropboxには自分のウェブサイトに実装したい機能があります。 Dropboxにログインすると、ファイルをアップロードできます。ファイルを1つずつアップロードすると、UIは結果（ファイル名、場所など）をdiv要素にスタックします。これを行う他のウェブサイトもあります。たとえば、ドメインを検索してカートに追加をクリックすると、右側にドメインが表示され、削除するオプションが表示されます。

私がしたいこと： 検索ボックスにページを置いてデータベースにオブジェクトを照会し、結果を下のdiv要素に表示します。ユーザーが新しい検索を行うたびに、そのdiv要素の結果が変更されます。しかし、ユーザーが 'add to'ボタンをクリックすると、オブジェクトはsearch_results div要素から、前のすべての選択要素がリストされている同じページの別のdiv要素に移動する必要があります。ユーザは、リストからオブジェクトを削除するか、量などのオブジェクトの値を変更することができる。

私が言ったように;私は今、本当に愚かな感じている...私はそれを見つけることができないので、私の髪を引っ張ってきた:(誰もがこのような機能のtechnicall名が何であるかを知っていますか？

EDIT

カジモドのクローンとyuriy636から以下のコメント私は、このページを見つけたが専門用語で検索した後、右方向に私をプッシュ：。 https://cartjs.org/

第二の例は、私が探していたまさにですしかし、私はできませんよ。コメントをupvoteするが、私は私を助けるために両方にクレジットを与えるのが好きですか？

Answer 1

あなたの質問は非常にあいまいですが、私は、私は以下のことができます何をやったかと思います少なくともあなたを正しい方向に向ける。

のは、あなたがこのようなものがあるとしましょう - あなたの検索結果を保持するためのdiv、それはクラスresultし、「移動」のものを保持するために別のdivを持つ独自のdivだあるそれぞれのを：

<div id="searchResults"> 
    <div class="result">This is one search result.</div> 
    <div class="result">This is another result.</div> 
</div> 

<div id="chosenResults"></div> 

http://codepen.io/anon/pen/GqBxEp

：それはアクションである。ここ

$(document).ready(function() { //On page load 
    $('.result').click(function() { //When element with class "result" is clicked 
     $(this).detach().appendTo('#chosenResults'); //Remove it form the results list, add it to the other 
    }); 
}); 

：今、私たちは、 "移動" 機能に置くためにjQueryのを使用することができます

私は実際のデータ検索などに関してあなたがどこにいるのか分かりませんが、上記のようにフロントエンドをノックアウトしたと思っています。

Answer 2

が、私は用語無限リストと無限スクロールを聞いた、ウィキペディアは「遅延または遅延評価」を使用しています：https://en.wikipedia.org/wiki/Lazy_evaluation#Delayed_evaluation