2012-01-05 16 views
13

के अंदर नंबर स्थिति रीफ्रेश करें एक HTML तालिका में मेरे पास प्रत्येक पंक्ति में एक सेल है जो अपनी स्थिति संख्या के साथ है। JQueryUI के साथ सॉर्ट करने के बाद मैं इस स्थिति संख्या को सही तरीके से रीफ्रेश कैसे कर सकता हूं?jQuery ui sortable tablerows

यह मेरा सरल एचटीएमएल है:

<table border="0"> 
<thead> 
     <tr> 
     <th scope="col">Position number</th> 
     <th scope="col">Name</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
     <td>1</td> 
     <td>Text</td> 
     </tr> 
     <tr> 
     <td>2</td> 
     <td>Text</td> 
     </tr> 
    </tbody>   
</table> 

और ये मेरे js है:

var fixHelper = function(e, ui) { ui.children().each(function() { $(this).width($(this).width()); }); return ui; }; 

    $("table tbody").sortable({ 
     helper: fixHelper 
    }).disableSelection(); 

अब मैं सही ढंग से आदेश को बदल पूरा छंटाई के बाद संख्या मान स्थिति करना चाहते हैं।

मैं इसे कैसे बना सकता हूं?

किसी भी मदद की सराहना की जाएगी।

उत्तर

22

छँटाई के बाद निम्न कार्य करें ..

$("table tbody").sortable({ 
    update: function(event, ui) { 
     $('table tr').each(function() { 
      $(this).children('td:first-child').html($(this).index()) 
     }); 
    }, 
    helper: fixHelper 
}).disableSelection(); 

आप (untested) की कोशिश कर सकते हैं: के बजाय $('table tr').each उपयोग $(this).parents('table').find('tr').each

स्पष्टीकरण .. यह तालिका के अंदर tr टैग में से प्रत्येक के माध्यम से लूप और फिर की सामग्री को tr

+2

आपको बहुत अच्छा, अच्छा जवाब और अच्छी व्याख्या है, यह पूरी तरह से काम करता है। मैं आपके उत्तर को स्वीकार करता हूं और वोट देता हूं, यदि आप चाहें तो मेरे प्रश्न के लिए भी ऐसा ही कर सकते हैं। आपका बहुत बहुत धन्यवाद! – bobighorus

+2

ने मुझे भी मदद की - महान प्रतिक्रिया और प्रश्न – cantera

2

के सूचकांक मान के साथ सामग्री को बदलता है यदि किसी को अबो पसंद आया मैंने जवाब दिया है, यहां कॉफ़ीस्क्रिप्ट

jQuery -> 
    $("ul.sortableEdit").sortable 
      stop: (event, ui) -> 
      $('ul.sortableEdit li').each(-> 
       $(this).children('input.sortableItemPos').val($(this).index()) 
      ) 
संबंधित मुद्दे