Вывод нужного количества полей

@new day · Регистрация: 02.12.2012

Студворк — интернет-сервис помощи студентам

Всем привет. Может кто подскажет я пытаюсь сделать следующее: при вводе числа в текстовое поле в форме необходимо вывести соответственно количество текстовых полей. Например, если задали цифру 2 то должно появится 2 текстовых поля, если 8 значит 8. Не пойму как сделать соответствие введенной цифре с количеством текстовых полей. Спасибо. Если есть возможность скиньте ссылку то ли на использующие функции.

@koza4ok · 15.01.2013, 02:17

читайте про
1. createElement
2. appendChild
3. documentFragment

Вам нужноа функция которая будет принимать параметр-число создаваемых полей.
Если без documentFragmentто будет так

JavaScript
1
2
3
4
5
6
7
8
9
function appedInput(num)
{
for(var i=o;i<num;i++)
{
input=document.createElement('input');
parentElement.appendChild(input)
}
 
}

Будут проблемы-пишите
Вот ещеhttp://javascript.ru/optimize/documentfragment-0

@new day · 16.01.2013, 01:27 **[ТС]**

Я не пойму. Смотри сделал так:

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<head>
 
<script type="text/javascript">
function appedInput(num)
{
for(var i=o;i<num;i++)
{
input=document.createElement('input');
parentElement.appendChild(input);
}
 
}
</script>
 
 
 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Документ без названия</title>
</head>
 
<body>
<input type="text" value=""id="num">
<input type="button" value=" нажми меня" onclick="appedInput();"><br>
</body>

Ничего не получается. А как вывести и где указано что это инпут с типом текст, и еще нужно чтобы у всех полей были разные имена для того, чтобы при нажатии кнопки данные из всех выбранных полей записались базу данных. Спсибо.

@Soldado · 16.01.2013, 12:27

У Вас i=o (это буква), а нужно i=0. Но дело не только в этом, вы ведь хотите в форме вывести инпуты, ещё у них должны быть различные name - это если форму собираетесь отправлять. Проще сделать так:

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<html>
  <head>
    <title>Количество полей</title>
    
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />    
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    
 <script type="text/javascript">
$(document).ready(function(){
 $("#countInp").keyup(function(){
       var count = parseInt($(this).val());
       for(i=1;i <= count; i++)
{
 $('#btnSub').before('<input type="text" class="newInp" name="f'+i+'"/><br/>');
    
} 
      });
      
      
// дополнительный проверочный код - смотрим name поля      
$('#myForm').on("click", ".newInp", function(){
var attrName =$(this).attr("name");
alert(attrName);
});   
                     
 });/*end  ready*/
 </script><style>
 .newInp{
margin-bottom:5px; 
 }
 
 
 </style>
  </head>
  <body style="padding:180px;">
Введите количество полей: <input type="text" id="countInp" size="1" maxlength="1"/><br/>
<form id="myForm">
 
 
<input type="submit" id="btnSub"/>
</form>
  </body>
</html>

Демо-страница

@new day · 16.01.2013, 22:50 **[ТС]**

Извините, но этот код не работает. Подскажите пожалуйста а где используется id="countInp"?

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<html>
  <head>
    <title>Количество полей</title>
    
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />    
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    
 <script type="text/javascript">
$(document).ready(function(){
 $("#countInp").keyup(function(){
       var count = parseInt($(this).val());
       for(i=1;i <= count; i++)
{
 $('#btnSub').before('<input type="text" class="newInp" name="f'+i+'"/><br/>');
    
} 
      });
      
      
// дополнительный проверочный код - смотрим name поля     
$('#myForm').on("click", ".newInp", function(){
var attrName =$(this).attr("name");
alert(attrName);
});   
                     
 });/*end  ready*/
 </script><style>
 .newInp{
margin-bottom:5px; 
 }
 
 
 </style>
  </head>
  <body style="padding:180px;">
Введите количество полей: <input type="text" id="countInp" size="1" maxlength="1"/><br/>
<form id="myForm">
 
 
<input type="submit" id="btnSub"/>
</form>
  </body>
</html>

@Soldado · 16.01.2013, 23:39

1. Что значит где используется id="countInp"? В строке 10 -скрипт, строка 36 - html.
2. Нерабочий код? А как же демо-страница? Да, его нужно усовершенствовать, например, можно назначить событие через one или переделать под возможность изменения количества полей, но и в таком виде код работает.

@new day · 17.01.2013, 00:14 **[ТС]**

Сообщение от Soldado

1. Что значит где используется id="countInp"? В строке 10 -скрипт, строка 36 - html.
2. Нерабочий код? А как же демо-страница? Да, его нужно усовершенствовать, например, можно назначить событие через one или переделать под возможность изменения количества полей, но и в таком виде код работает.

Извините объясните мне. Я ввожу допустим цифру - 5 и нажимаю на кнопку, и должно по идее отобразиться 5 текстовых полей! Но они не выводятся? Если есть возможность подскажите в чем бок. Спасибо.

@Soldado · 17.01.2013, 00:26

В моём примере достаточно просто ввести цифру. Вы смотрели демо-страницу? Я проверил в разных браузерах - вроде работает

@new day · 17.01.2013, 00:52 **[ТС]**

Спасибо, ноаверное глюк был - все работает.

@new day · 27.01.2013, 23:57 **[ТС]**

Сообщение от Soldado

В моём примере достаточно просто ввести цифру. Вы смотрели демо-страницу? Я проверил в разных браузерах - вроде работает

подскажите пожалуйста вот допустим я ввел цифру 3 появилось 3 текстовых поля и у каждого из них есть name как я понимаю в этом случае f1,f2,f3 после ввода каких-то слов я хочу отослать в таблицу mysql с названиями переменных
f1,f2,f3, но ничего в таблицу не вноситься. Подскажите в чем проблема? Или как можно сделать чтобы введенные значения в тестовые поля можно было отослать в базу? Спсибо

@Soldado · 28.01.2013, 00:39

Надеюсь Вы знаете что записывает данные в БД php-обработчик, нужно в него передать данные, указав адрес страницы обработчика и метод в теге <form>. По последней моде, делают это без перезагрузки страницы с помощью ajax. Пример ajax отправки, а запись это уже php

@new day · 28.01.2013, 22:22 **[ТС]**

Сообщение от Soldado

Надеюсь Вы знаете что записывает данные в БД php-обработчик, нужно в него передать данные, указав адрес страницы обработчика и метод в теге <form>. По последней моде, делают это без перезагрузки страницы с помощью ajax. Пример ajax отправки, а запись это уже php

Вы наверное не поняли моего вопроса. Вот ваш код:

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<html>
  <head>
    <title>Количество полей</title>
    
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />    
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    
 <script type="text/javascript">
$(document).ready(function(){
 $("#countInp").keyup(function(){
       var count = parseInt($(this).val());
       for(i=1;i <= count; i++)
{
 $('#btnSub').before('<input type="text" class="newInp" name="f'+i+'"/><br/>');
    
} 
      });
      
      
// дополнительный проверочный код - смотрим name поля     
$('#myForm').on("click", ".newInp", function(){
var attrName =$(this).attr("name");
alert(attrName);
});   
                     
 });/*end  ready*/
 </script><style>
 .newInp{
margin-bottom:5px; 
 }
 
 
 </style>
  </head>
  <body style="padding:180px;">
Введите количество полей: <input type="text" id="countInp" size="1" maxlength="1"/><br/>
<form id="myForm" method="post">
 
 
<input type="submit" id="btnSub" name="send"/>
</form>
  </body>
</html>

При вводе цифры 3 появиться соответственно 3 текстовых поля с name f1,f2 и f3 как я понимаю, но при вводе текста и передачи данных в php обработчик ничего не заноситься, вот допустим:

PHP
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<?php
 
if ( isset ( $_POST["send"] ) ) {
if ( isset ( $_POST["f1"] ) && ( $_POST["f1"] !== '' ) ) {
        $f1 = trim ( htmlspecialchars ( stripslashes ( $_POST["f1"] ) ) );
    } else {
        die ( "Вы не ввели все данные" )
        ;
    if ( isset ( $_POST["f2"] ) && ( $_POST["f2"] !== '' ) ) {
        $f2 = trim ( htmlspecialchars ( stripslashes ( $_POST["f2"] ) ) );
    } else {
        die ( "Вы не ввели все данные" )
        ;}
    if ( isset ( $_POST["f3"] ) && ( $_POST["f3"] !== '' ) ) {
        $f3 = trim ( htmlspecialchars ( stripslashes ( $_POST["f3"] ) ) );
    } else {
        die ( "Вы не ввели все данные" )
        ;}
   $db = mysql_connect ( 'localhost', 'root', 'root' );
    if(!$db) die("Ошибка доступа к базе данных. Приносим свои извинения");
    if(!mysql_select_db ( 'sporting')) die("База данных отсутствует. Приносим свои извинения");
        mysql_query ("set_client='cp1251'");
        mysql_query ("set character_set_results='cp1251'");
        mysql_query ("set collation_connection='cp1251_general_ci'");
        mysql_query ("SET NAMES cp1251");
    // Добавляем статью в базу
    //mysql_query("SET NAMES utf8 ");
        //mysql_set_charset('utf8');
    $sql=  ( "INSERT INTO `sor3` (f1,f2,f3) VALUES ( '$f1','$f2','$f3')");
         //echo $sql;
         $add= mysql_query($sql);
 
    // Если статья добавлена успешно, то выводим соответствующее сообщение
    if ( $add == true ) {
        echo " Информация занесена в базу данных";
    } else {
        echo " Информация не занесена в базу данных";
    }
} else {
    
     
}
?>

Может быть нужно перепресваивать переменные текстовые поля name с f1,f2 и f3 в другие чтобы потом из указывать в php-обработчике и соответственно в таблице базе данных. Спаспибо за помощь.

@Soldado · 29.01.2013, 11:04

php-oбработчик у Вас на этой же странице находится или на другой?

@new day · 30.01.2013, 01:34 **[ТС]**

я пробывал оба случая , и ничего не получается!

@Soldado · 30.01.2013, 12:47

Загрузил Ваш php-kod в редактор Codelobster и подсветило красным скобку { - нет для неё пары -закрывающейся скобки
Посчитал:
- открывающихся { - 10 штук
- закрывающихся } - 9 штук

Исправьте ошибку

@new day · 01.02.2013, 00:50 **[ТС]**

поставил скобку но все равно не добавляет ... пустые строки в таблице бд

@new day · 03.02.2013, 23:42 **[ТС]**

Сообщение от Soldado

Загрузил Ваш php-kod в редактор Codelobster и подсветило красным скобку { - нет для неё пары -закрывающейся скобки
Посчитал:
- открывающихся { - 10 штук
- закрывающихся } - 9 штук

Исправьте ошибку

Исправил ошибку но не рабатает, может быть подскажите в чем проблема? Плиз очень нужно но не могу понять почему не отправляются! Спасибо.

@Soldado · 04.02.2013, 17:56

Я исправил немного Ваш обработчик, но он не годится для общего случая, в нём Вы обрабатываете данные только трёх полей, а js-скрипт просили с генерацией разного количества инпутов.
Демонстрация - всё добавляет в БД

PHP код

Кликните здесь для просмотра всего текста

PHP
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<?php
 
if ( isset ( $_POST["send"] ) ) {
if ( isset ( $_POST["f1"] ) && ( $_POST["f1"] !== '' ) ) {
        $f1 = trim ( htmlspecialchars ( stripslashes ( $_POST["f1"] ) ) );
    } else {
        die ( "Вы не ввели все данные1" );
    }   
    if ( isset ( $_POST["f2"] ) && ( $_POST["f2"] !== '' ) ) {
        $f2 = trim ( htmlspecialchars ( stripslashes ( $_POST["f1"] ) ) );
    } else {
        die ( "Вы не ввели все данные2" );
    }   
    if ( isset ( $_POST["f3"] ) && ( $_POST["f3"] !== '' ) ) {
        $f3 = trim ( htmlspecialchars ( stripslashes ( $_POST["f3"] ) ) );
    } else {
        die ( "Вы не ввели все данные3" )
        ;}
   $db=mysql_connect ("localhost","root","root");// изменить пароль БД
    if(!$db) die ("Ошибка доступа к базе данных. Приносим свои извинения") ;
    if(!mysql_select_db ("sporting",$db)) die("База данных отсутствует. Приносим свои извинения");
        mysql_query ("set_client='cp1251'");
        mysql_query ("set character_set_results='cp1251'");
        mysql_query ("set collation_connection='cp1251_general_ci'");
        mysql_query ("SET NAMES cp1251");
    // Добавляем статью в базу
    //mysql_query("SET NAMES utf8 ");
        //mysql_set_charset('utf8');
    $sql=  ( "INSERT INTO `sor3` (f1,f2,f3) VALUES ( '$f1','$f2','$f3')");
         //echo $sql;
         $add= mysql_query($sql);
 
    // Если статья добавлена успешно, то выводим соответствующее сообщение
    if ( $add == true ) {
        echo " Информация занесена в базу данных";
    } else {
        echo " Информация не занесена в базу данных";
    }
} 
else{
    echo "Нет Send";
}
?>

HTML - код

Кликните здесь для просмотра всего текста

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
  <head>
    <title>Бд количество полей</title>
    
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    
 <script type="text/javascript">
$(document).ready(function(){
 $("#countInp").on("keyup",function(){
    $(".newInp").next().andSelf().remove();
       var count = parseInt($(this).val());
       for(i=1;i <= count; i++)
{
 $('#btnSub').before('<input type="text" class="newInp" name="f'+i+'"/><br/>');
    
} 
      });
      
      
 $('#myForm').submit(function(stop){
stop.preventDefault();// отменяем стандартную отправку
 
 
     var f1 = $('input[name=f1]').val();
     var f2 = $('input[name=f2]').val();
     var f3 = $('input[name=f3]').val();
  $.post(
       'phpobrabotka.php',
        {f1:f1,f2:f2,f3:f3,send:1},
        function (data){$('#result').text(data)}
       );
 
});
                     
 });/*end  ready*/
 </script><style>
 .newInp{
margin-bottom:5px; 
 }
 
 
 </style>
  </head>
  <body style="padding:180px;">
Введите количество полей: <input type="text" id="countInp" size="1" maxlength="1"/><br/>
<form id="myForm" action="phpobrabotka.php" method="post">
 
 
<input type="submit" id="btnSub" name="send"/>
</form>
 
<div id="result">--</div>
  </body>
</html>

Вам нужно более конкретно определиться, что из себя будет представлять форма, сколько будет полей и как её обрабатывать в php
Архив для локального сервера:

Новые блоги и статьи Все статьи Все блоги /
Подстановка значения реквизита справочника в табличную часть документа Maks 10.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "ПланированиеПерсонала", разработанного в конфигурации КА2. Задача: при выборе сотрудника (справочник Сотрудники) в ТЧ документа. . .	Очистка реквизитов документа при копировании Maks 09.04.2026 Алгоритм из решения ниже применим как для типовых, так и для нетиповых документов на самых различных конфигурациях. Задача: при копировании документа очищать определенные реквизиты и табличную. . .	модель ЗдравоСохранения 8. Подготовка к разному выполнению заданий anaschu 08.04.2026 https:/ / github. com/ shumilovas/ med2. git main ветка * содержимое блока дэлэй из старой модели теперь внутри зайца новой модели 8ATzM_2aurI	Блокировка документа от изменений, если он открыт у другого пользователя Maks 08.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа, разработанного в конфигурации КА2. Задача: запретить редактирование документа, если он открыт у другого пользователя. / / . . .
Система безопасности+живучести для сервера-слоя интернета (сети). Двойная привязка. Hrethgir 08.04.2026 Далее были размышления о системе безопасности. Сообщения с наклонным текстом - мои. А как нам будет можно проверить, что ссылка наша, а не подделана хулиганами, которая выбросит на другую ветку и. . .	Модель ЗдрввоСохранения 7: больше работников, больше ресурсов. anaschu 08.04.2026 работников и заданий может быть сколько угодно, но настроено всё так, что используется пока что только 20% kYBz3eJf3jQ	Дальние перспективы сервера - слоя сети с космологическим дизайном интефейса карты и логики. Hrethgir 07.04.2026 Дальнейшее ближайшее планирование вывело к размышлениям над дальними перспективами. И вот тут может быть даже будут нужны оценки специалистов, так как в дальних перспективах всё может очень сильно. . .	Горе от ума kumehtar 07.04.2026 Эта мне ментальная установка, что вот прямо сейчас, мол, мне для полного счастья не хватает (нужное вписать), и когда я этого достигну - тогда и полный кайф. Одна из самых сильных ловушек на пути. . . .

@new day 0 / 0 / 0 Регистрация: 02.12.2012 Сообщений: 52

	Вывод нужного количества полей 14.01.2013, 23:11. Показов 1693. Ответов 17 Метки нет (Все метки) Всем привет. Может кто подскажет я пытаюсь сделать следующее: при вводе числа в текстовое поле в форме необходимо вывести соответственно количество текстовых полей. Например, если задали цифру 2 то должно появится 2 текстовых поля, если 8 значит 8. Не пойму как сделать соответствие введенной цифре с количеством текстовых полей. Спасибо. Если есть возможность скиньте ссылку то ли на использующие функции. 0

@Soldado 901 / 833 / 198 Регистрация: 28.06.2012 Сообщений: 1,607 Записей в блоге: 4
	16.01.2013, 23:39
	1. Что значит где используется id="countInp"? В строке 10 -скрипт, строка 36 - html. 2. Нерабочий код? А как же демо-страница? Да, его нужно усовершенствовать, например, можно назначить событие через one или переделать под возможность изменения количества полей, но и в таком виде код работает. 0

@Soldado 901 / 833 / 198 Регистрация: 28.06.2012 Сообщений: 1,607 Записей в блоге: 4
	17.01.2013, 00:26
	В моём примере достаточно просто ввести цифру. Вы смотрели демо-страницу? Я проверил в разных браузерах - вроде работает 1

@new day 0 / 0 / 0 Регистрация: 02.12.2012 Сообщений: 52
	17.01.2013, 00:52 [ТС]
	Спасибо, ноаверное глюк был - все работает. 0

@Soldado 901 / 833 / 198 Регистрация: 28.06.2012 Сообщений: 1,607 Записей в блоге: 4
	28.01.2013, 00:39
	Надеюсь Вы знаете что записывает данные в БД php-обработчик, нужно в него передать данные, указав адрес страницы обработчика и метод в теге <form>. По последней моде, делают это без перезагрузки страницы с помощью ajax. Пример ajax отправки, а запись это уже php 0

@Soldado 901 / 833 / 198 Регистрация: 28.06.2012 Сообщений: 1,607 Записей в блоге: 4
	29.01.2013, 11:04
	php-oбработчик у Вас на этой же странице находится или на другой? 0

@new day 0 / 0 / 0 Регистрация: 02.12.2012 Сообщений: 52
	30.01.2013, 01:34 [ТС]
	я пробывал оба случая , и ничего не получается! 0

@Soldado 901 / 833 / 198 Регистрация: 28.06.2012 Сообщений: 1,607 Записей в блоге: 4
	30.01.2013, 12:47
	Загрузил Ваш php-kod в редактор Codelobster и подсветило красным скобку { - нет для неё пары -закрывающейся скобки Посчитал: - открывающихся { - 10 штук - закрывающихся } - 9 штук Исправьте ошибку 0

@new day 0 / 0 / 0 Регистрация: 02.12.2012 Сообщений: 52
	01.02.2013, 00:50 [ТС]
	поставил скобку но все равно не добавляет ... пустые строки в таблице бд 0