javascript - Jediitable, autocomplete and autogrow jquery not working -
i trying use autocomplete , autogrow jeditable jquery plugin , cannot seem incorporate both. have jeditable + autocomplete working perfectly. when tr add code autogrow doesn't work , causes post when hit save button. appreciated.
this have far:
$('#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 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 } });
here's reference material:
for running problem have gotten work. went growfield plugin because autogrow 1 having weird results (it worked, formatting looked off when saved opted go easier route of using different plugin.)
here's final code:
$.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); } // execute when textarea rendered textarea.ready(function () { // implement scroll pane code here }); $(this).append(textarea); return (textarea); }, plugin: function (settings, original) { // applies growfield effect 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 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 } });
Comments
Post a Comment