ソート可能テキストエリア

Question

ソート可能なリストを作成しました。

並べ替え可能なリストの順番に基づいて、テキストエリアにテキストを挿入したい#notes。 とにかく、たとえ注文を変更しても、リストに基づいてテキストをソートすることができます。 TEXTAREA内のテキストは、私はこれが行わ持っているアヤックスか何かを使用する必要がある場合はわからない例えば

<ul> 
<li>entry 1</li> 
<li>entry 2</li> 
</ul> 


entry 1 = "this is line 1" 
entry 2 = "this is line 2" 

応じ

を変更する必要があります。私はそれぞれのリスト項目があらかじめ定義されたテキストを持つことを望んでいるからです。

私はJqueryを学びたいと思っています。本当に助けになるでしょう。 これをどのように行うことができるかについてのヒント。

質問

これらの定義済みの値はどこに保存されますか？ テキスト領域のテキストをソートする方法は？

誰かが正しい方向で私を指してくれますか？

Answer 1

refreshTextarea()に最初にテキストエリアを埋めるために使用するjavascript関数を書き、並べ替えが変更されるたびに、リストのソート順に応じて空にして補充することで "更新"します。

OK、あなたのULのIDとあなたの李を与え、あなたのリストの項目に値を関連付けるにユニークなID

<ul id="the-list"> 
    <li id="item-1">entry 1</li> 
    ... 
</ul> 

は、各リスト項目のために、何らかの方法

に対応したIDを持つ隠し入力を作成します

<input type="hidden" id="item-1-data" value="this is where you put info for the list item entry 1" /> 

jqueryを使用すると、並べ替えが完了した後にリスト項目をループしてテキストエリアを更新することによって、プログラムによって関連付けることができます。

$('#the-list li').each(function() { 
    //get the id of the list's data field 
    var li-data-id = $(this).attr("id") + '-data'; 

    // get the actual data associated with this list item 
    var li-data = $(li-data-id).val(); 

    // append next list's data in the textarea 
    $('#id-of-textarea').val($('#id-of-textarea').val() + "\n" + li-data) 
} 

Answer 2

テキストエリアはちょうどテキストの塊です。そこに「ソート可能な」行を構成する何らかの方法を決定する必要があります。リストが変更されるたびにコンテンツ全体を再生成する。