开发者

Sortable Textarea

I have made a sortable list.

开发者_如何学JAVA

Based on the order of the sortable list i want to insert text into a textarea #notes. is there anyway I can have text sorted based on the list so even if i change the order. the text in the textarea should change accordingly

eg

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


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

I am not sure if i have to use Ajax or something to have this done. since i want each list item to have predefinded text.

I am trying to learn Jquery and would really apprieciate any help. any hints on how i can have this done.

Question

Where and how do i store these predefined values ? How to get the text in the text area sorted ?

can someone please point me in the right directions


Maybe write a javascript function to refreshTextarea() that you will use initially to fill the textarea and every time the sorting changes it will "refresh" it by emptying and refilling depending on the sort order of the list.

ok, to associate values with your list items, give your ul an id and your li unique ids

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

then for each list item, create a hidden input with an id that corresponds in some way

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

Then with jquery you programmatically associate them by looping through your list items and refreshing your textarea after any sort is made.

$('#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)
}


A textarea is just a blob of text. You'd have to have some way of determining what constitutes a "sortable" line in there. Or regenerate the entire contents anytime the list is changed.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜