Gridstack.js: कस्टम ड्रैग हैंडल

को निर्मित 24 मार्च 2015 · 3टिप्पणियाँ · स्रोत: gridstack/gridstack.js

क्या कस्टम ड्रैग हैंडल उपयोग के लिए कोई उदाहरण है?
मैं केवल पैनल हेडर (और पूरे शरीर नहीं) का उपयोग करके आइटम को खींचने योग्य बनाने की कोशिश कर रहा हूं - कई संभावित संयोजनों के साथ कोड के नीचे कोशिश की, लेकिन सफलता नहीं मिली

    <div class="grid-stack">
        <div class="grid-stack-item"
                 data-gs-x="0" data-gs-y="0"
                 data-gs-width="4" data-gs-height="2">
            <div class="grid-stack-item-content panel panel-default">
                <div class="panel-heading clearfix">
                    <span class="panel-title pull-left"><span class="glyphicon glyphicon-asterisk"></span> <span class="panel-title-text">Featuring</span></span>
                </div>
                <div class="panel-body ">
                    <ul class="list-group">
                        <li class="list-group-item">a</li>
                        <li class="list-group-item">v</li>
                    </ul>
                </div>
            </div>
        </div>
    </div

जेएस कोड:

    var options = {
        cell_height: 80,
        vertical_margin: 10,
        animate: true,
        handle:  ??? 
    };
    this.$('.grid-stack').gridstack(options);

कोशिश की handle:'.panel' , handle:'panel-heading' और बिना हैंडल के भी। और grid-stack-item-content वर्ग को भी हटाने का प्रयास किया - लेकिन सभी मामलों में परिणाम either the whole thing moves or nothing moves at all ।

आइटम को केवल उसके शीर्षलेख द्वारा कैसे चलने योग्य बनाया जाए?

स्रोत

KrishnaPG

सबसे उपयोगी टिप्पणी

हे कृष्ण,

समस्या आपके विकल्प var में प्रतीत होती है।

यदि आप लाइब्रेरी कोड में एक नज़र डालते हैं, तो आप देख सकते हैं, लाइन 379 से शुरू होकर, डिफ़ॉल्ट विकल्प और जिस तरह से व्यवस्थित किया जाता है।

एक कस्टम ड्रैग करने योग्य कंटेनर के लिए हैंडल को ड्रैग करने योग्य संपत्ति की एक उप संपत्ति होना चाहिए; आपके जेएस कोड को इस तरह कुछ दिखने की जरूरत है:

var options = {
    cell_height: 80,
    vertical_margin: 10,
    animate: true,
    draggable: {
        handle: '.panel-heading',
    }
};
this.$('.grid-stack').gridstack(options);

indriemarius 24 मार्च 2015

👍11 🚀1 ❤1

सभी 3 टिप्पणियाँ

हे कृष्ण,

समस्या आपके विकल्प var में प्रतीत होती है।

var options = {
    cell_height: 80,
    vertical_margin: 10,
    animate: true,
    draggable: {
        handle: '.panel-heading',
    }
};
this.$('.grid-stack').gridstack(options);

indriemarius 24 मार्च 2015

👍11 🚀1 ❤1

कूल - यह एक आकर्षण की तरह काम कर रहा है - आप महान हैं। पूरे दिन इस पर लात मारते रहे, और यहाँ आपका जवाब है, और यह बस काम कर रहा है :) कमाल है।

KrishnaPG 25 मार्च 2015

इसने वास्तव में लोगों की मदद की, धन्यवाद।

buffalonan 12 अक्तू॰ 2015

क्या यह पृष्ठ उपयोगी था?

0 / 5 - 0 रेटिंग्स

Gridstack.js: कस्टम ड्रैग हैंडल

सबसे उपयोगी टिप्पणी

सभी 3 टिप्पणियाँ

संबंधित मुद्दों