Так что я полный новичок в JS. Я прочитал сотню других постов, попробовал их решения, и я не могу заставить его работать, чтобы спасти мою жизнь.
Вот проблема:
У меня есть JS и AJAX, которые работают. Но только по явно выраженным значениям. В ту минуту, когда я пытаюсь абстрагировать ее для обработки всех переменных, она перестает работать.
Я также открыт для лучшего способа сделать это, но это то, что я понял до сих пор, основываясь на моих ограниченных знаниях.
У меня очень очень большая форма. Почти 400 сотен полей для сбора данных в полевых условиях на мобильных телефонах. Пропускная способность не является проблемой, но стабильность и надежность таковы, поэтому предполагается, что форма отправляет каждый фрагмент данных по мере его ввода, что позволяет вносить изменения и изменения, пока они не будут готовы к отправке. До этого времени он отправляет обратно ту же информацию, которая затем используется для отображения зеленой точки, чтобы убедиться, что данные действительно были сохранены. Таким образом, для каждого поля формы есть <span>
с идентификатором, названным в его честь в форме FormFieldAStatus. Я включил это ниже.
Фрагмент формы:
<input type="text" class="form-textbox validate[required]" id="input_1" name="formFieldA" size="20" onchange="saveData(); readData()" />
<span class="ajax-success" id="formFieldAStatus"></span>
Вот код, который работает:
function readData() {
new Ajax.Request('AjaxRead.php', {
method: 'post',
parameters: $('Worksheet').serialize(true),
onSuccess: function(transport) {
var icon = '<img src="images/greendot.png" align="bottom" style="margin-right:5px;">';
if (transport.responseText) {
var json=transport.responseText.evalJSON();
if(json.formFieldA) {
var status = $('formFieldAStatus');
status.update(icon); }
if(json.formFieldB) {
var status = $('formFieldBStatus');
status.update(icon); }
if(json.formFieldC) {
var status = $('formFieldCStatus');
status.update(icon); }
}
},
onFailure:function(){ alert('Something went wrong...') }
});
}
Серьезно. Я не ставлю 400 из этих строк, чтобы проверить каждое поле. Это безумие.
Вот код, который должен работать, но не работает.
function readData() {
new Ajax.Request('AjaxRead.php', {
method: 'post',
parameters: $('Worksheet').serialize(true),
onSuccess: function(transport) {
var icon = '<img src="images/greendot.png" align="bottom" style="margin-right:5px;">';
if (transport.responseText) {
var json=transport.responseText.evalJSON();
for(var key in json) {
if(!json[key]=='') {
var statusName=key+'Status';
// Take your pick of the following. I've tried them all.
var status = $(statusName);
var status = $(window[statusName]);
var status = $(key+'Status');
var status = $(window[key+'Status']);
eval("var status = $('"+key+"Status');");
// Did any of them work ever?
status.update(icon); }
}
}
},
onFailure:function(){ alert('Something went wrong...') }
});
}
Любая помощь будет принята с благодарностью. И если есть лучший способ сделать это, тогда я весь в ушах.
Приветствие.
Последние подробности:
Я добавил это:
console.log('statusname: '+statusName);
console.log('status: '+status);
console.log('status Object: '+Object.inspect(status));
И выплюнуло:
statusname: fieldNameAStatus
status: [object HTMLElement]
status Object: <span id="fieldNameAStatus" class="ajax-success">
для каждого из методов, которые я пробовал ...
в ту минуту, когда я раскомментирую это:
status.update(icon);
Вместо этого я получаю:
statusname: formIDStatus
status: null
status Object: null
Странно, правда?
Ok. Итак, теперь, когда у меня отключен файл console.log (кроме личного, спасибо за то, что рассказали мне об этом), я решил взглянуть на то, что он показывает, когда я использую работающий вручную указанный код для каждого поля.
status: [object HTMLElement]
status Object: <span id="fieldNameAStatus" class="ajax-success">
Вот что у нас есть:
Рабочий код:
ключи считываются, создается объект состояния, представляющий собой строку html, определяющую <span>
, которая должна быть, и обновляется без проблем.
Неработающий:
прочитаны ключи, создан объект состояния, представляющий собой HTML-строку, определяющую <span>
, которая должна быть, но вызов обновления объекта убивает его на первой итерации цикла.
Что теперь?