Число не меняется после добавления значения в текстовый ввод

У меня есть тестовое приложение, которое вы можете использовать:

Чтобы использовать приложение, выполните следующие действия: Приложение

<сильный>1. Откройте приложение, и вы увидите, что «Общее количество оставшихся оценок» равно 20. Нажмите кнопку «Добавить вопрос», это добавит строку внизу.

<сильный>2. Теперь в добавленной строке вы увидите ввод текста. Введите число 10 в поле ввода текста и щелкните мышью. Вы увидите, что "Общее количество оставшихся оценок" изменилось с 20 до 10, что верно (20-10=10)

<сильный>3. Теперь в той же строке есть зеленая кнопка плюса, нажмите на нее, и появится модальное окно со строкой поиска внутри.

<сильный>4. В строке поиска введите 2+2 и введите поиск. Появится строка, в которой в столбце «Количество оценок» указано число 5. Нажмите кнопку «Добавить», чтобы добавить строку.

<сильный>5. Вот где проблема, вы увидите, что в добавленной строке в текстовом вводе написано «5», но если вы вернетесь наверх, все равно будет написано «Общее количество оставшихся оценок: 10». Это должно измениться на 15, так как 20 - 5 = 15. Но это не изменится.

Мой вопрос заключается в том, что после того, как пользователь добавил число в добавленную строку, как я могу изменить общее количество оценок? Это потому, что я использую атрибут «OnChange»?

Ниже приведен jsfiddle, где показан весь код: (Jsfiddle не является рабочим примером, он просто так, чтобы вы могли видеть весь код):

http://jsfiddle.net/WZKrP/2/


javascript jquery jsfiddle
person user1701484    schedule 11.10.2012    source источник
comment
Извините, ребята, позвольте мне просто исправить приложение, а затем я дам вам знать, когда оно будет исправлено, чтобы вы могли протестировать его снова :)   -  person user1701484    schedule 11.10.2012

Ответы (2)


arrow_upward
1
arrow_downward

На кнопке «добавить» в модальном окне вы вызываете parent.addwindow(key_0,'5','1','A-D','Single','A');, но функция addWindow() в вашем javascript имеет только 1 параметр: addwindow(textWeight)... Вы отправляете 5 параметров.

Функция вызывается правильно, вы просто ничего не делаете с данными.

это то, что вы отправляете в функцию

введите здесь описание изображения

Редактировать после комментариев

используйте $(plusbutton_clicked).closest('tr').find('input.txtWeightRow').val(textWeight).‌​trigger('change');, чтобы вызвать изменение

person VVV    schedule 11.10.2012
comment
Я пытался сократить код, поэтому я включил только функцию textWeight, но понял, что допустил ошибку с приложением. Дайте мне 5 минут, чтобы исправить приложение, а затем вы сможете протестировать его снова. Прости за это - person user1701484; 11.10.2012
comment
Ну, все, что вам нужно сделать после этого, это взять val() и 5 ​​к нему. Обязательно используйте parseInt(5), чтобы пятерка стала числом, а не строкой. PS: замените 5 вашей переменной. - person VVV; 11.10.2012
comment
Пожалуйста, протестируйте приложение сейчас, теперь вы сможете выполнять шаги без каких-либо проблем (хорошо, пока вы не дойдете до шага 5, когда оно не изменит число, лол) - person user1701484; 11.10.2012
comment
Не могли бы вы изменить строку 166: $(plusbutton_clicked).closest('tr').find('input.txtWeightRow').val(textWeight); на $(plusbutton_clicked).closest('tr').find('input.txtWeightRow').attr('value', textWeight);. Вы меняете val(), но не значение. Я думаю, что change применяется только тогда, когда вы меняете значение, а не val. Это не то же самое. - person VVV; 11.10.2012
comment
или еще лучше измените его на $(plusbutton_clicked).closest('tr').find('input.txtWeightRow').val(textWeight).trigger('change'); - person VVV; 11.10.2012
comment
Гениально сработало, могу я задать один маленький вопрос. Когда я использую метод onchange, это означает, что пользователь вводит число в текстовое поле, а затем, когда он щелкает, число изменяется. Существует еще один атрибут onkeypress, где, если вы вводите число, оно сразу же вносит изменения при вводе числа. Мой вопрос: что бы вы сказали лучше onchange или onkeypress для этого сценария? - person user1701484; 11.10.2012
comment
Я думаю, вы говорите о методе blur(), который срабатывает, когда ввод теряет фокус(). В вашем примере общее значение оценки меняется, когда я нажимаю Enter, что тоже нормально. Все зависит от того, чего вы хотите достичь. Используйте onchange, чтобы отображать обновленное поле по мере ввода пользователем, или blur()/ENTER, если вы хотите рассчитать все сразу. - person VVV; 11.10.2012
comment
О, я вижу, вы обновили комментарий. Я бы выбрал onchange, потому что ввод можно заполнить другими способами, кроме ввода, например, щелкнув правой кнопкой мыши -> вставить. Но это всего лишь мнение. - person VVV; 11.10.2012
comment
Я понимаю, что может быть небольшая проблема с вашим ответом. Позвольте мне кое-что проверить, и я свяжусь с вами - person user1701484; 11.10.2012
comment
Хорошо, да, есть проблема, которая странная. Хорошо, если вы выполните те же шаги в моем вопросе, вы обнаружите, что с вашим изменением это работает. Но затем снова нажмите кнопку «Добавить вопрос», чтобы добавить еще одну строку. Вы можете видеть, что общее количество оставшихся оценок восходит к 20, тогда, если я введу число 10 в текстовое поле второй строки, тогда общее количество оставшихся оценок будет 10, должно быть 5, но оно игнорирует первую строку, я догадываюсь из-за триггера, сделанного в первой строке, но я не уверен - person user1701484; 11.10.2012
comment
Ошибка - это еще одна проблема. Это в функции calculateTotal(). Вы говорите totalweight = totalmarks - Number($(elm).val(), 10);. Вы нигде не храните переменную, поэтому она всегда сбрасывается. Это то же самое, что сказать 0 = 20 - 5, а затем 0 = 20 - 10, поэтому, конечно, totalweight всегда будет равно последней строке. - person VVV; 11.10.2012

arrow_upward
0
arrow_downward

Я думаю, что этот код $('#mainTxtWeight').val(textWeight); вызывает проблему.

Согласно документации W3C , если вы программно изменяете value элемента управления вводом, вы должны вручную запускать событие изменения.

Попробуйте использовать событие blur или просто вручную запустите событие change

Обратитесь к моему ответьте на другой вопрос SO для получения дополнительной информации.

person prashanth    schedule 11.10.2012