दिलचस्प पोस्ट
सी # में हार्डवेयर-आईडी को तेजी से कैसे प्राप्त करें? Jquery में JSF घटक आईडी को कैसे संदर्भित करें? जावा का उपयोग करके सेलेनियम वेबड्राइवर के साथ प्रमाणीकरण पॉपअप कैसे प्रबंधित करें छद्म-शास्त्रीय विरासत गोपनीयता के साथ? लिनक्स पर एक खुली फाइल हैंन्डलर का क्या होता है, यदि पॉइंट फाइल को स्थानांतरित किया जाता है, हटाएं गणना (एक ^ बी)% एमओडी क्या C ++ या C में foo (void) और foo () के बीच अंतर है? Image Base64 में कनवर्ट करें टेबल्स के संबंध में HTML5 में, सेलपैडिंग, सेलपैसिंग, वालिग, और संरेखित करने की जगह क्या है? डॉकर कंटेनर के अंदर से, मैं मशीन के स्थानीय होस्ट से कैसे जुड़ूं? जहां हालत नल का उपयोग करते हुए रेलगाड़ी रेल करता है बैश में सीएसवी फ़ाइल को कैसे पार्स करना है? एचटीएमएल टेक्सटेरा में अधिकतम लंबाई सेट करें एंड्रॉइड टेक्स्टव्यू में टेक्स्ट कैसे बदला जाए द्विआधारी पेड़ आरेख कैसे मुद्रित करें?

jQuery यूआई क्रमबद्ध, फिर एक डेटाबेस में आदेश लिखें

मैं jQuery के sortable फ़ंक्शन का इस्तेमाल करना चाहता हूं ताकि उपयोगकर्ताओं को एक ऑर्डर सेट कर सकें और फिर परिवर्तन पर, इसे डेटाबेस में लिख कर उसे अपडेट कर सकें। क्या कोई इस पर एक उदाहरण लिख सकता है कि यह कैसे किया जाएगा?

वेब के समाधान से एकत्रित समाधान "jQuery यूआई क्रमबद्ध, फिर एक डेटाबेस में आदेश लिखें"

JQuery UI sortable सुविधा में ऐसा करने के लिए एक serialize विधि शामिल है। यह काफी आसान है, सचमुच यहां एक त्वरित उदाहरण दिया गया है, जो डेटा को निर्दिष्ट यूआरएल को भेजते हैं, जैसे ही कोई तत्व स्थिति बदलता है।

 $('#element').sortable({ axis: 'y', update: function (event, ui) { var data = $(this).sortable('serialize'); // POST to server using $.post or $.ajax $.ajax({ data: data, type: 'POST', url: '/your/url/here' }); } }); 

यह क्या करता है कि यह तत्व id का उपयोग करने वाले तत्वों की एक सरणी बनाता है। तो, मैं आमतौर पर ऐसा कुछ करता हूं:

 <ul id="sortable"> <li id="item-1"></li> <li id="item-2"></li> ... </ul> 

जब आप serialize विकल्प का उपयोग करते हैं, तो यह एक POST क्वेरी स्ट्रिंग जैसे: item[]=1&item[]=2 आदि बनायेगा। यदि आप उपयोग करते हैं – उदाहरण के लिए – id एट्रिब्यूट में आपके डेटाबेस आईडी, तो आप बस फिर से दोहरा सकते हैं पोस्ट किए गए सरणी के माध्यम से और तदनुसार तत्वों की स्थिति अपडेट करें।

उदाहरण के लिए, PHP में:

 $i = 0; foreach ($_POST['item'] as $value) { // Execute statement: // UPDATE [Table] SET [Position] = $i WHERE [EntityId] = $value $i++; } 

Jsfiddle पर उदाहरण

आप भाग्य में हैं, मैं अपने सीएमएस में सटीक चीज़ का उपयोग करता हूं

जब आप ऑर्डर को संग्रहीत करना चाहते हैं, तो बस JavaScript विधि saveOrder() कॉल करें। यह saveorder.php के लिए एक AJAX POST अनुरोध करेगा, लेकिन बेशक आप हमेशा इसे नियमित रूप से पोस्ट कर सकते हैं।

 <script type="text/javascript"> function saveOrder() { var articleorder=""; $("#sortable li").each(function(i) { if (articleorder=='') articleorder = $(this).attr('data-article-id'); else articleorder += "," + $(this).attr('data-article-id'); }); //articleorder now contains a comma separated list of the ID's of the articles in the correct order. $.post('/saveorder.php', { order: articleorder }) .success(function(data) { alert('saved'); }) .error(function(data) { alert('Error: ' + data); }); } </script> <ul id="sortable"> <?php //my way to get all the articles, but you should of course use your own method. $articles = Page::Articles(); foreach($articles as $article) { ?> <li data-article-id='<?=$article->Id()?>'><?=$article->Title()?></li> <? } ?> </ul> <input type='button' value='Save order' onclick='saveOrder();'/> 

Saveorder.php में; ध्यान रखें मैंने सभी सत्यापन और जाँच को हटा दिया।

 <?php $orderlist = explode(',', $_POST['order']); foreach ($orderlist as $k=>$order) { echo 'Id for position ' . $k . ' = ' . $order . '<br>'; } ?> 

सोचा कि यह भी मदद कर सकता है ए) यह अपने कम से कम पेलोड रखने के लिए डिजाइन किया गया था, सर्वर पर वापस भेजने के बाद प्रत्येक प्रकार के बाद (हर समय सभी तत्व भेजने के बजाय या कई तत्वों के माध्यम से दोहराए जाने के बजाय कि सर्वर ठुकरा सकता है) बी) मुझे तत्व के आईडी / नाम के साथ समझौता किए बिना कस्टम आईडी वापस भेजने की आवश्यकता थी I इस कोड को asp.net सर्वर से सूची मिलेगी और फिर केवल दो मानों को सॉर्ट करने पर वापस भेजा जाएगा: सॉर्ट किए गए तत्व का डीबी आईडी और तत्व के डीबी आईडी जो कि इसे हटा दिया गया था। उन 2 मानों के आधार पर, सर्वर आसानी से नई पोस्टियन की पहचान कर सकता है।

 <div id="planlist" style="width:1000px"> <ul style="width:1000px"> <li plid="listId1"><a href="#pl-1">List 1</a></li> <li plid="listId2"><a href="#pl-2">List 1</a></li> <li plid="listId3"><a href="#pl-3">List 1</a></li> <li plid="listId4"><a href="#pl-4">List 1</a></li> </ul> <div id="pl-1"></div> <div id="pl-2"></div> <div id="pl-3"></div> <div id="pl-4"></div> </div> <script type="text/javascript" language="javascript"> $(function () { var tabs = $("#planlist").tabs(); tabs.find(".ui-tabs-nav").sortable({ axis: "x", stop: function () { tabs.tabs("refresh"); }, update: function (event, ui) { //db id of the item sorted alert(ui.item.attr('plid')); //db id of the item next to which the dragged item was dropped alert(ui.item.prev().attr('plid')); //make ajax call } }); }); </script> 

यह मेरा उदाहरण है।

https://github.com/luisnicg/jQuery-Sortable-and-PHP

आपको अपडेट ईवेंट में ऑर्डर प्राप्त करने की आवश्यकता है

  $( "#sortable" ).sortable({ placeholder: "ui-state-highlight", update: function( event, ui ) { var sorted = $( "#sortable" ).sortable( "serialize", { key: "sort" } ); $.post( "form/order.php",{ 'choices[]': sorted}); } }); 

मैं स्वीकार किए जाते हैं उत्तर और jsFiddle पर जुड़े उदाहरण का पालन करके पंक्तियों को बदल सकता हूँ लेकिन कुछ अज्ञात कारणों के कारण, "रोक या बदलाव" के बाद मैं आईडी प्राप्त नहीं कर सका। लेकिन JQuery UI पृष्ठ में पोस्ट किया गया उदाहरण मेरे लिए ठीक काम करता है आप यहां उस लिंक की जांच कर सकते हैं।

इस समाधान के साथ प्रयास करें: http://phppot.com/php/sorting-mysql-row-order-using-jquery/ जहां नए ऑर्डर कुछ एचएमटीएल तत्वों में सहेजे गए हैं फिर आप इस डेटा के साथ कुछ PHP लिपि में जमा कर सकते हैं, और इसे लूप के साथ गड़बड़ कर पुनरारंभ करें।

नोट: मुझे टाइप आईएनटी (11) के दूसरे डीबी क्षेत्र को जोड़ना था जो हर यात्रा पर अपडेट किया गया है (टाइमस्टैम्प) – यह जानने के लिए स्क्रिप्ट का उपयोग करता है कि कौन सी पंक्ति को अद्यतन किया गया है, या फिर आप तले हुए परिणामों के साथ समाप्त होते हैं