Динамическое добавление нового option в form
Прошу прощения, если тема пробегала.
Меня интересует механизм динамического добавления к уже имеющимся option в form. Допустим, имею форму: <form action="list.asp" name="archive"> <select name="Year" id="Year"> <option value="noValue" selected>Выберите год</option> <option value="2009">2009</option> <option value="2008">2008</option> <option value="2007">2007</option> <option value="2006">2006</option> </select> <form> Каким образом реализуется механизм автоматического добавления нового <option value="2010">2010</option> по наступлению 2010 года? Надеюсь понятно изъяснил :yes: |
при загрузке скрипта взять текущий год. проверить его на равность 2010. елси он равен - добавить чайлда селекту.
вы это хотели услышать? |
Спасибо.
Скрипт вроде написал. Но не могу сделать грамотную сортировку. Необходима обратная последовательность. Не поможите?
<html>
<head>
<script Language="JavaScript">
function checkYear() {
var currDate = new Date()
var currYear = currDate.getYear();
var a = [];
var i = 0;
constYear = 2006;
while(constYear <= currYear) {
a[i] = constYear++;
var listYear = new Option(a[i], a[i], false, false);
var archive = document.archive.Year;
archive.options[archive.options.length] = listYear;
}
}
</script>
</head>
<body>
<form action="list.asp" name="archive">
<select name="Year" id="Year" onchange="checkYear()">
<option value="noValue" selected>Выберите год</option>
</select>
<form>
</body>
</html>
|
во первых, var archive = document.getElementsByName('Year')[0];
а вообще. что-то под FF оно у меня вообще не запускается. то ли лыжи не едут, то ли... вставил alert('..') первой строчкой в скрипте - и фиг. --edited а, всё. стоило заменить onchange на onclick --edited x2 чисто ради интереса. а что у вас возвращает это?
var currDate = new Date();
var currYear = currDate.getYear();
alert (currYear);
|
я бы это сделал так:
<html>
<head>
<script language="javascript" type="text/javascript">
function checkYear() {
var archive = document.getElementsByName('Year')[0];
if (archive.length == 1) // вероятно нам не нужно заполнять повторно при клике.
{
var currDate = new Date();
var currYear = currDate.getFullYear();
constYear = 2006;
//var a = [];
//var i = 0;
var i = currYear - constYear;
while(constYear <= currYear) {
var a = constYear++;
var listYear = new Option(a, a, false, false);
archive.options[i--] = listYear;
}
}
}
</script>
</head>
<body>
<form action="list.asp" name="archive">
<select name="Year" onclick="checkYear();">
<option value="noValue" selected>Выберите год</option>
</select>
<form>
</body>
</html>
|
Цитата:
Т.е. в ФФ onchange вообще не работает? onclick конечно хорошо, но при дефолтной загрузке страницы в выборке отображается «Выберите месяц», а уже когда щелкаем на выборке происходит резайс элемента и по-умолчанию предлагается 2008 с 2009 и т.д. Мне честно говоря так не нравится. Есть какой-то выход из положения? Цитата:
Спрашиваю, потому что интересно. Цитата:
|
в фф onchange работает.
что в вашем понятии означает onchange? когда он должен срабатывать? Цитата:
прописывать обязательно, т.к. не все браузеры поймут что такое document.archive.Year. и не понятно зачем городить велосипед и обращаться к форму а потом к потомку если можно обратиться к потомку напрямую. по поводу 2009. стоит тестировать свои скрипты/страницы более чем в одном браузере. желательно кроме ие проверять в ff и opera. и вы поймете что многое написанное может не выполняться. ибо нужно изначально писать кроссбраузерно. т.е. код, который поймут разные браузеры и адекватно его отработают. |
Цитата:
Не подскажите, как этого избежать? Цитата:
Учту. Но частично код брал из книги Флэнагана «JavaScript». 5-е издание. Цитата:
Обязательно проверяю. Меня это и смутило. Тем более код был приведен в вышеуказанной книге. |
Цитата:
|
Цитата:
onclick -> on click -> срабатывает при клике по элементу Цитата:
// вероятно нам не нужно заполнять повторно при клике. if (archive.length == 1)которая смотрит, если у нас кол-во элементов ==1 (надпись выберите год) то она заходит во внутрь и заполняет его годами. при повторном клике никакое заполнение не происходит. вообще, правильнее будет сравнивать не по длине а по archive.selected == "noValue"или по наличию "noValue" среди потомков archive. способов масса. Цитата:
|
Цитата:
Не поймите меня неправильно, но ни в IE, ни в FF2 у меня не работает :( Все равно происходит повторное заполнение при клике, но теперь уже по годам. У вас работает? Цитата:
Поэтому решил по ней изучать JavaScript. Теперь буду внимательнее к коду в этой книге. Цитата:
И скрипт в вашем исполнении красив ;) |
Цитата:
|
Цитата:
Только работает он так (у меня, в ИЕ7 и ФФ2). При загрузке страницы в выборке установлено «Выберите год». Кликаем. Происходит ресайз формы до ширины 2008. Т.е. происходит повторное заполнение формы, только теперь годами. Т.е. чтобы выбрать год, нужно щелкнуть 2 раза. Вот это меня и смущает. |
если мне не изменяет память, то до момента клика в селекте находится только "Выберите год". в момент клика срабатывает событие onclick() и выполняется JS код, который заполняет селект годами. ибо если бы там было что-то кроме "Выберите год", то не сработало бы условие где .length==1 и код бы не выполнился.
|
Цитата:
Извините, если вас замучал. В таком случае думаю нужно прописать в body onload="checkYear();" Но теперь другая засада, при загрузке по-умолчанию в селекте становится 2008, а хочется текущий. Не подскажите, как исправить? |
Цитата:
Цитата:
Цитата:
Цитата:
function checkYear() {
var yearsList = document.getElementsByName('Year')[0];
if (yearsList.value == "noValue")
{ // вероятно, нам не нужно заполнять повторно при клике.
var currDate = new Date();
var currYear = currDate.getFullYear();
constYear = 2006;
var i = currYear - constYear;
while(constYear <= currYear) {
var a = constYear++;
var listYear = new Option(a, a, false, false);
yearsList.options[i--] = listYear;
}
}
yearsList.selectedIndex=0;
}
|
http://javascript.ru/forum/offtopic/...html#post16016
по поводу document.form_name.el_name -> document.getElementById('el_name') - в общем-то оно вроде везде работает, но может лучше и не пользоваться такой штукой, не знаю artwalek, такие вещи лучше на сервере делать, а не на клиенте я бы сделал так:
function addYears() {
var year = document.form1.year;
var currDate = new Date();
var currYear = currDate.getFullYear();
for( var i=currYear; i >= 2006; i-- ) {
var opt = new Option(i, i);
year.options[ year.options.length ] = opt;
}
year.selectedIndex = 1;
}
p.s. constYear получилась глобальной переменной |
AzriMan
Спасибо вам. Вы мне помогли! x-yuri document.form_name.el_name Мы с AzriMan выяснили, что в ФФ2 не работает. Поэтому наверное лучше не пользоваться. И этот метод описан в книге Флэнагана. Цитата:
|
Цитата:
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="en"> <head> <title>title</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> </head> <body onload="alert(document.form1.asd1.value);"> <form name="form1" action="index.php"> <div><input type="hidden" name="asd1" value="4"></div> </form> </body> </html> вот такой код в ff2 (2.0.0.20) работает есть другой нюанс, в xhtml 1.0 strict у элемента form нету атрибута name :blink: p.s. но, как я говорил, я не знаю как лучше поступать Цитата:
p.s. я сказал лучше, в твоем случае вряд ли это имеет значение |
| Часовой пояс GMT +3, время: 10:28. |