0

Asp.Net Web アプリケーションで qTip フォーム バリデーターを使用した jqueryUI のドラッグ可能な Bootstrap モーダルに問題があります。要件として、jqueryUI Draggable を使用してブートストラップ モーダルをドラッグ可能にしました。問題は、ツールチップがアクティブで、ブートストラップ モーダルをドラッグした場合、スクリーンショットに表示されているように qtip がモーダルとともに移動しないことです。次の qTip 設定を使用しています。

var q = $(inputs).qtip({
    position: {
        my: 'center left',
        at: 'center right'
    },
    content: {
        text: function (api) {
            return getValidator.call(this).html();
        }
    },
    show: {
        ready: true,
        event: 'none'
    },
    hide: {
        event: 'none'
    },
    style: {
        classes: 'ui-tooltip-red ui-tooltip-shadow ui-tooltip-rounded'
    },
    events: {
        show: function (event, api) {
            var $this = api.elements.target;
            var validator = getValidator.call($this);
            if (validator.length == 0)
                event.preventDefault();
        }
    }
});

type: 'relative',ポジションに andを使ってみましcontainer: $(this).parent(),た。しかし、qtip はまだ動いていません。

以下を使用してブートストラップモーダルを移動していますが、期待どおりに機能しています。

    $(".modal").draggable({
            handle: ".modal-header",
            containment: "body"
        });

提案/修正は大歓迎です。

4

1 に答える 1

1

DOMをよく見ると、初期化した要素に関係なく、実際のqtip要素が本文に追加されるため、これは機能しません。したがって、ドラッグ可能な div には存在せず、ドラッグされません。

私の最善の策は、ドラッグが開始されたときにqtipエラーメッセージを非表示にし、ドラッグが停止したときにそれらを再レンダリングすることです。

于 2013-06-24T14:14:42.790 に答える