0

Jeditable jquery プラグインで autocomplete と autogrow を使用しようとしていますが、両方を組み込むことができないようです。現在、Jeditable + オートコンプリートが完全に機能しています。自動拡張のコードを追加しようとすると、機能せず、保存ボタンを押すとポストバックが発生します。どんな助けでも大歓迎です。

これは私がこれまでに持っているものです:

    $('#directionList').autocomplete({
        source: function (request, response) {
            $.ajax({
                url: '../api/standarddirections/?q=' + request.term,
                dataFilter: function (data) { return data; },
                success: response
            });
        },
        minLength: 2
    });

    $.editable.addInputType('autocomplete', {
        element: $.editable.types.textarea.element,
        plugin: function (settings, original) {
            $('textarea', this).autocomplete(settings.autocomplete);
        }
    });

    $(".directionAutoComplete").editable(function (value, settings) {
        console.log(this);
        console.log(value);
        console.log(settings);
        return (value);
    }, {
        type: "autocomplete",
        indicator: 'Saving...',
        tooltip: "Enter a direction...",
        onblur: function (value, settings) {
            console.log(this);
            console.log(value);
            console.log(settings);
            return (value);
        },
        cancel: 'Cancel',
        submit: 'Save',
        autocomplete: {
            source: function (request, response) {
                $.ajax({
                    url: '../api/standarddirections/?q=' + request.term,
                    dataFilter: function (data) { return data; },
                    success: response
                });
            },
            minLength: 2
        }
    });

ここにいくつかの参考資料があります：

  1. ジェディタブル
  2. Jeditable - 自動成長チュートリアル
4

1 に答える 1

0

この問題に遭遇した人のために、私はそれを機能させました。自動拡張プラグインで奇妙な結果が得られたという理由だけで、growfield プラグインを使用しました (それは機能しましたが、保存したときに書式設定がうまくいかなかったので、別のプラグインを使用するより簡単な方法を選択しました)。

これが私の最終的なコードです：

$.editable.addInputType('growfield', {
                element: function (settings, original) {
                    var textarea = $('<textarea>');
                    if (settings.rows) {
                        textarea.attr('rows', settings.rows);
                    } else {
                        textarea.height(settings.height);
                    }
                    if (settings.cols) {
                        textarea.attr('cols', settings.cols);
                    } else {
                        textarea.width(settings.width);
                    }
                    // will execute when textarea is rendered
                    textarea.ready(function () {
                        // implement your scroll pane code here
                    });
                    $(this).append(textarea);
                    return (textarea);
                },
                plugin: function (settings, original) {
                    // applies the growfield effect to the in-place edit field
                    $('textarea', this).growfield(settings.growfield);
                    $('textarea', this).autocomplete(settings.autocomplete);
                }
            });

 $(".directionAutoComplete").editable(function (value, settings) {
                console.log(this);
                console.log(value);
                console.log(settings);
                return (value);
            }, {
                type: "growfield",
                indicator: 'Saving...',
                tooltip: "Enter a direction...",
                onblur: function (value, settings) {
                    console.log(this);
                    console.log(value);
                    console.log(settings);
                    return (value);
                },
                cancel: 'Cancel',
                submit: 'Save',
                growfield: {},
                autocomplete: {
                    source: function (request, response) {
                        $.ajax({
                            url: '../api/standarddirections/?q=' + request.term,
                            dataFilter: function (data) { return data; },
                            success: response
                        });
                    },
                    minLength: 2
                }
            });
于 2013-05-14T22:40:47.463 に答える