2016-06-20 2 views
0

Как добавить аргументы в действие формы с помощью типа ввода = «скрыто». Мой HTML фрагмент ...Добавление аргумента в действие формы с использованием типа ввода скрыто

<form id="form1"> 
<input type="text" name="txt"/> 
<input type="hidden" name="usID" value=123/> 
<input type="hidden" name="usname" value="name1"/> 
<input type="submit" onclick="add()" value="ADD"/> 
</form> 

Мой JavaScript сниппет ...

function add() 
{ 
document.getElementsByName('usID').value=789; 
document.getElementsByName('usname').value="name2"; 

document.getElementById('form1').action = "/page"; 
document.getElementById('form1').submit(); 
} 

После ввода "текст" в текстовое поле и нажимной ADD, ссылка выглядит следующим образом ... http://localhost:3000/page?txt=text&usID=123&usname=name1

Почему нет имени пользователя username и имени пользователя 789 и «name2» соответственно? Любая другая альтернатива, если не это?

ответ

1

getElementsByName собирается вернуть коллекцию элементов html (NodeList), а не один элемент html. что означает, что возвращаемое значение не имеет атрибута value, который изменит ввод. Вы должны либо дать им id и найти их с getElementById, а затем изменить значение, или захватить первый элемент коллекции

document.getElementsByName('usname')[0].value="name2"; 

или (предпочтительный способ)

<input type="hidden" name="usname" value="name1" id="usname"/> 

function add(){ 
    document.getElementById('usname').value="name2"; 
    ... 
} 

хотя я должен спросите, есть ли причина, по которой вы меняете элемент скрытого поля?

+0

В основном я должен был передать значения из базы данных в виде действий. Я был под этим заблуждением, что, если мы добавим значение изначально в '', тогда только мы сможем добавить/изменить его значение позже. Во-вторых, теперь я понял, что значение имени образует компонент ссылки, а не значение id. Благодарим за помощь! –

1

это поможет вам:

<!DOCTYPE html> 
<html> 
    <head> 
    </head> 
    <body> 
     <script> 
      function add() 
       { 
        var usID = document.forms["frm"]["usID"]; 
        var usname = document.forms["frm"]["usname"]; 
        usID.value=789; 
        usname.value="name2"; 
        document.getElementById('form1').action = "/page"; 
        document.getElementById('form1').submit(); 
       } 
     </script> 

     <h3>Please select the <span>first letter</span> of your <span>last name</span>: </h3> 

      <form id="form1" name="frm"> 
      <input type="text" name="txt"/> 
      <input type="hidden" name="usID" value=123/> 
      <input type="hidden" name="usname" value="name1"/> 
      <input type="submit" onclick="add()" value="ADD"/> 
      </form> 
    </body> 
</html> 
+0

Да, это помогает. Я ошибался в доступе к элементам с помощью метода document.getElementsByName. Спасибо! –

Смежные вопросы