Браузер Автозаполнение и привязка данных
У меня есть эта довольно простая форма, в которой есть адрес электронной почты и поле ввода пароля. На моей веб-странице активирован пароль автозаполнения/сохранения Google Chrome. Теперь, когда я загружаю свою веб-страницу, Chrome автоматически заполняет поле электронной почты и пароля (что приятно).
Проблема заключается в том, что EmberJS, похоже, не "видит" эти автоматически заполненные значения. Если я использую this.get('userName')
, например, в контроллере, ember возвращает мне пустые значения.
Для того, чтобы иметь ember "видеть" эти автоматически заполненные значения, я должен щелкнуть по каждому {{input}}
или вкладке через них, а затем ember начнет его видеть.
Это очень простая форма:
<div>
<form class="form-signin form-vertical" id="login-form" {{action "login" on="submit"}}>
<h3 class="form-signin-heading text-center sf-primary-color">Please Login</h3>
{{input class="form-control" name="email" placeholder="Email address" value=userName type="text" tabindex=1}}
{{input class="form-control" name="password" placeholder="Password" value=password type="password" tabindex=2}}
{{#if errorMessage}}
<div class="alert alert-danger text-center sf-fade-in">{{errorMessage}}</div>
{{/if}}
<div class="well">
You may login with <kbd>demo</kbd>/<kbd>demo</kbd>.
</div>
{{input type="submit" value="Log In" tabindex=3}}
</form>
</div>
Я создал скрипку. Проблема не воспроизводится в скрипке, потому что независимо от того, сколько раз я ее запускал. Браузер не предлагает сохранять пароль.
Звучит так, как привязка данных Ember не обнаруживает браузер с автозавершением {{input}}
В стороне, мне пришлось использовать трюк, обозначенный здесь, чтобы эти поля ввода предлагались автоматически.
EDIT: я определил наблюдателя, как показано ниже, и он не запускается, когда сайт загружен первым, а автозаполнение выполнило задание.
userNameChanged: function() {
console.log('User Name Changed');
}.observes('userName'),
Информация о версии следующая:
DEBUG: ------------------------------- ember.js:3461
DEBUG: Ember : 1.4.0 ember.js:3461
DEBUG: Ember Data : 1.0.0-beta.4 ember.js:3461
DEBUG: Handlebars : 1.3.0 ember.js:3461
DEBUG: jQuery : 1.10.2 ember.js:3461
DEBUG: -------------------------------
Ответы
Ответ 1
Не идеальное, но функциональное решение:
Ember.TextField.reopen({
fetchAutofilledValue: function() {
var $textField = this.$();
setTimeout( function(){
$textField.trigger("change")
}, 250);
}.on('didInsertElement')
});
Ответ 2
Это то, что я использую ATM.
Ember.TextField.reopen({
triggerEvents: function () {
Ember.run.next(this, function () {
this.$().trigger("change");
});
}.on("didInsertElement")
});
Модификация решения, найденного в связанном потоке проблем github.
(Обновлено в соответствии с предложением @briangonzalez)
Ответ 3
У меня нет ответа, но у меня есть та же проблема, и я нашел эту проблему Github:
https://github.com/emberjs/ember.js/issues/2968
Кроме того, это хорошее резюме о том, какие события отправляются разными браузерами на автозаполнение:
http://avernet.blogspot.in/2010/11/autocomplete-and-javascript-change.html