Проблемы в форме с checkbox, что делать? )
У нас есть форма, в которой нужно ввести имя, отметить пол и внести эти данные в список с пометкой пола (м) или (ж). Также можно удалять из списка.
У нас чикбоксы не работают, помогите пожалуйста исправить :)http://fotki.yandex.ru/users/rusakov.../739309?page=0
<HTML>
<HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<TITLE>Добавление и удаление элементов из списков</TITLE>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<script type="text/javascript">
function focusElement() {
var elem = document.forms[0].myInput;
elem.focus();
}
function addList(){
valid = true;
document.forms[0].myInput.focus()
var list1 = document.getElementsByTagName('select')[0];
var li = document.createElement('option');
var chek_m = document.getElementsByTagName ;
/*Запрещение ввода пустой строки */
if (document.forms[0].myInput.value<1)
return valid;
/* Ввод в список из текстового поля */
li.innerHTML =document.forms[0].myInput.value
/* Очистка текстового поля */
document.forms[0].myInput.value=""
list1.appendChild(li);}
</script>
</HEAD>
<BODY onload='focusElement()'>
<form name="form1">
<br /><b>Введите имя</b><br />
<input name="myInput" value= "" size="42"> <br /><br />
<input type="checkbox" name="checkbox" id="chek_m"> men <br>
<input type="checkbox" name="checkbox" id="chek_w"> women <br>
<input onclick='addList()' type='button'
value='Добавить'><br />
<input type=button value='Удалить'
onClick="for(i=0;i<form.elements[3].length;i++)
if(form.elements[3].options[i].selected==true)
form.elements[3].options[i] = null;"><br /><br />
<b>Список<br /><br />
<select size="5" multiple id="list1"></<select>
</form>
</BODY>
</HTML>
|
что вы понимаете под не работают? они активны
<HTML>
<HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<TITLE>Добавление и удаление элементов из списков</TITLE>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<script type="text/javascript">
function focusElement() {
var elem = document.forms[0].myInput;
elem.focus();
}
function addList(){
valid = true;
document.forms[0].myInput.focus()
var list1 = document.getElementsByTagName('select')[0];
var li = document.createElement('option');
var chek_m = document.getElementsByTagName ;
/*Запрещение ввода пустой строки */
if (document.forms[0].myInput.value<1)
return valid;
/* Ввод в список из текстового поля */
li.innerHTML =document.forms[0].myInput.value
/* Очистка текстового поля */
document.forms[0].myInput.value=""
list1.appendChild(li);}
</script>
</HEAD>
<BODY onload='focusElement()'>
<form name="form1">
<br /><b>Введите имя</b><br />
<input name="myInput" value= "" size="42"> <br /><br />
<input type="checkbox" name="checkbox" id="chek_m"> men <br>
<input type="checkbox" name="checkbox" id="chek_w"> women <br>
<input onclick='addList()' type='button'
value='Добавить'><br />
<input type=button value='Удалить'
onClick="for(i=0;i<form.elements[3].length;i++)
if(form.elements[3].options[i].selected==true)
form.elements[3].options[i] = null;"><br /><br />
<b>Список<br /><br />
<select size="5" multiple id="list1"></<select>
</form>
</BODY>
</HTML>
|
Цитата:
Для этого используют радиобаттоны или селект... |
так надо чтобы к вносимому имени приписывался пол ... Надо через чик бокс, препод сказал (
|
разбейте нос вашему преподу))) и скажите что так не делают))
а если серьезно, то вешайте на checkbox событие onchange и если один чек бокс активный, то второй делаем не активным |
для начала его вобще нужно хоть как то обработать http://codepen.io/anon/pen/qicda
дальше можете активностями рулить |
как то так:
<input type="checkbox" name="checkbox" id="chek_m" onchange="if (this.checked) document.getElementById('chek_w').checked = false;"> men <br>
<input type="checkbox" name="checkbox" id="chek_w" onchange="if (this.checked) document.getElementById('chek_m').checked = false;"> women <br>
|
.......
if (document.forms[0].myInput.value<1)
return valid;
/* Ввод в список из текстового поля */
var j = document.getElementById('chek_w').checked;
var m = document.getElementById('chek_m').checked;
if (!(m || j))
{
alert('выберите пол!');
return;
}
li.innerHTML = (m ? 'мужик, епта.' : 'бабенция.') + ' ' + document.forms[0].myInput.value;
/* Очистка текстового поля */
..... |
ага, тернарный оператор здесь самое понятное решение)
|
спасибо всем кто откликнулся ) все попробуем! :yes:
|
не забудь про нос попробовать)) потом расскажешь))) мне аж интересно
|
Ребят, спасибо) Препод бяка! :cray: Мы изменили что можно выбирать имя общее (например для Саши,Жени), работает.
Но у нас не работает теперь удаление из списка и нужно сделать вывод сообщения если поле пустое при нажатии "добавить".. Ну и еще нельзя чтобы имена повторялись, нужно какое то ограничение... HEEEELP )))) :help: |
<HTML>
<HEAD> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <TITLE>Добавление и удаление элементов из списков</TITLE> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251"> <script type="text/javascript"> function focusElement() { var elem = document.forms[0].myInput; //elem.focus(); } function addList(){ valid = true; document.forms[0].myInput.focus() var list1 = document.getElementsByTagName('select')[0]; var li = document.createElement('option'); var chek_m = document.getElementById('chek_m').checked; var chek_w = document.getElementById('chek_w').checked; var chek_wm = chek_m && chek_w; /*Запрещение ввода пустой строки */ if (document.forms[0].myInput.value<1) return valid; /* Ввод в список из текстового поля */ if (chek_m) { li.innerHTML =document.forms[0].myInput.value + ' [men]'; } if (chek_w){ li.innerHTML =document.forms[0].myInput.value + ' [women]'; } if (chek_wm) { li.innerHTML =document.forms[0].myInput.value + ' [all]'; } /* Очистка текстового поля */ document.forms[0].myInput.value="" list1.appendChild(li);} </script> </HEAD> <BODY onload='focusElement()'> <form name="form1"> <br /><b>Введите имя</b><br /> <input name="myInput" value= "" size="42"> <br /><br /> <input type="checkbox" name="checkbox" id="chek_m" > men <br> <input type="checkbox" name="checkbox" id="chek_w" > woman <br> <input onclick='addList()' required type='button' value='Добавить'><br /> <input type=button value='Удалить' onClick="for(i=0;i<form.elements[3].length;i++) if(form.elements[3].options[i].selected==true) form.elements[3].options[i] = null;"><br /><br /> <b>Список<br /><br /> <select size="5" id="list1"></<select> </form> </BODY> </HTML> |
Цитата:
|
помогите:cray:
|
:cray: :cray: :cray:
|
эх студенты, студенты.. а подумать??)) не вариант?))
вот наваял:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Добавление и удаление элементов из списков</title>
<style type="text/css">
#list
{
width: 300px;
height: 120px;
}
#name1
{
width: 250px;
}
</style>
<script type="text/javascript">
var name1, chek_m, chek_w, list, numb = 0;
var cache_name = new Array();
function bodyOnLoad()
{
name1 = document.getElementById('name1');
chek_m = document.getElementById('chek_m');
chek_w = document.getElementById('chek_w');
list = document.getElementById('list');
}
function add()
{
if (name1.value == '')
{
alert('Назовите свое имя!');
return;
}
if (!chek_m.checked && !chek_w.checked)
{
alert('Выберите пол!');
return;
}
for (var i = 0; i < cache_name.length; i++)
if (cache_name[i] == name1.value)
{
alert('Человек с таким именем уже есть!');
return;
}
var pol = 'пол: ' + (chek_m.checked ? 'мужской. ' : 'женский. ');
var name = 'имя: ' + name1.value;
cache_name.push(name1.value);
list.innerHTML += '<option value="' + numb + '">' + pol + name + '</option>';
numb++;
name1.value = '';
chek_m.checked = false;
chek_w.checked = false;
}
function del()
{
list.children[list.value].outerHTML = '';
}
</script>
</head>
<body onload="bodyOnLoad();">
<div>Введите имя</div>
<div>
<input id="name1" value= "">
</div>
<div>
<div><input type="radio" name="radio1" id="chek_m">муж.</div>
<div><input type="radio" name="radio1" id="chek_w">жен.</div>
</div>
<div>
<input type="button" value="добавить" onclick="add();">
<input type="button" value="удалить" onclick="del();">
</div>
<div>
<div>Список</div>
<select size="5" id="list"></<select>
</div>
</body>
</html>
|
Аааааааа0))) ты гений!!!! :dance:
Спасибо! )****** |
| Часовой пояс GMT +3, время: 12:32. |