О Jeditable плагин jquery в контексте Backbone.View

98
9

Используя плагин Jeditable,
можно создать, очень легко, кнопку отправки и отмены.
Здесь очень простой пример кода (*)

Теперь предположим, что в MyView (Backbone.View) я хотел бы вызвать событие, щелкнув по кнопке submit, созданной Jeditable.
Вот код, относящийся к Backbone.View (**).

Когда я "click.submitBtn" событие "click.submitBtn" значение $ ('. Edit_area'). Text - пустая строка. Чтобы исправить эту проблему, я применил следующий код (* **)

У вас есть умная идея улучшить код (* **)? Мне не нравится callback, используя setTimeout.

(*)

 $('.edit_area').editable(function(value, settings) {
return(value);
}, {
type : 'textarea',
submit : '<div class="submitBtn">Ok</div>'
cancel : '<div class="submitBtn">Undo</div>'
});

(**)

MyView = Backbone.View.extend({
events: {
"click .edit_area" : "edit",
"click .submitBtn" : "close"
},
});

(* **)

close: function close () 
{
var that = this;
console.log($(this.el).find("[data-tid='editable']").text()); // empty string
setTimeout(function () {
console.log($(that.el).find("[data-tid='editable']").text()); // update string
that.model.save({
name: $(that.el).find("[data-tid='editable']").text()
});
}, 0);
},

спросил(а) 2012-05-18T12:32:00+04:00 8 лет, 4 месяца назад
1
Решение
89

Var That = Это неправильно. Это DOM, а не позвоночник. Ты можешь сделать:

$('.edit_area').editable(this.close, { 
type : 'textarea',
submit : 'OK',
submitdata: {view: this},
});

"Представление" в хеше будет представлением позвоночника. Доступ к нему возможен в функции закрытия.

close:function(value, settings) { 
settings.submitdata.view.model.save({
name: value
});
});

ответил(а) 2014-07-15T06:26:00+04:00 6 лет, 2 месяца назад
57

в функции инициализации

$('.edit_area').editable(this.close, { 
type : 'textarea',
submit : 'OK',
});

Определение функции закрытия

close:function(value, settings) { 
this.model.save({
name: value
});
});

Полный код

var editableview = Backbone.View.extend({
initialize: function () {
_.bind(this.close, this);
},
render: function () {
$(this.el).find('.edit_area').editable(this.close, {
type: 'textarea',
submit: '<div class="submitBtn">Ok</div>'
cancel: '<div class="submitBtn">Undo</div>'
});
},
close: function (value, settings) {
this.model.save({
name: value
});
});
});

ответил(а) 2012-05-18T13:09:00+04:00 8 лет, 4 месяца назад
Ваш ответ
Введите минимум 50 символов
Чтобы , пожалуйста,
Выберите тему жалобы:

Другая проблема