2015-03-28 5 views
0

Я создал форму, и я ищу, чтобы ввести данные, введенные пользователем. Javascript, который у меня есть, до сих пор охватывает все данные. У меня возникла проблема с извлечением данных выбранного переключателя. Я прочитал несколько статей, и они говорят, что «имя» должно быть тем же, но это не работает, и если я дам ему уникальный «идентификатор», то выбор одного или других переключателей не работает. Кроме того, я не могу использовать JQueryhtml form - получение значения с выбранной радиокнопки

JS

var myNodeList = document.getElementsByName('cf'); 
var myArray = []; // empty Array 
for (var i = 0; i < myNodeList.length; i++) { 
    if(i<4) 
     for (i; i < 3; i++) { 
      var self = myNodeList[i].value; 
      myArray.push(self); 
     } 
    else if(i==4) 
     myArray.push(document.getElementById('status').value); 
    else if(i==5) 
     myArray.push(document.getElementById('subscribe').value); 
    else if(i==6) 
     myArray.push(document.getElementsByName('support')[i]); 
    else if(i==7) 
     for (i; i < myNodeList.length; i++) { 
      var self = myNodeList[i].value; 
      myArray.push(self); 
     } 
} 
console.log(myArray) 

HTML

<!DOCTYPE html> 
<html> 
<head> 
    <title>Contact Me</title> 
    <link rel="stylesheet" type="text/css" href="contactform_Lab8.css"> 
</head> 

<body> 

<form id="contactus"> 
    <fieldset> 
     <label for="name">Name:</label> 
      <input id="name" type="text" name="cf" autofocus required> 
     <label for="email">Email:</label> 
      <input id="email" type="email" name="cf" required> 
     <label for="phone">Phone:</label> 
      <input id="phone" type="tel" name="cf" required> 
     <label for="status">Status:   
      <select id="status" name="cf" required> 
       <option value="client">Client</option> 
       <option value="partner">Partner</option> 
       <option value="vendor">Vendor</option> 
      </select> 
     </label> 
     <label for="subscribe"> 
      <input id="subscribe" type="checkbox" name="cf" value="check" checked> 
     Send me your newsletter</label> 
     <label for="sales"> 
      <label for="support"> 
       <input id="sales" type="radio" name="slsSupport" value="sales" checked>Sales 
       <input id="support" type="radio" name="slsSupport" value="support">Support 
      </label> 
     </label> 
     <label for="msg">Message:</label> 
      <textarea id="msg" name="cf" rows="10" cols="30" required></textarea> 
     </fieldset> 
     <fieldset> 
     <button type="submit">Send</button> 
     <button type="reset">Reset</button> 
     </fieldset> 
</form> 
<script src="contactform_Lab8.js"></script> 

</body> 

</html> 
+0

Вы попробуйте это: ** $ ('вход [имя = "разрешения"]: проверено'). Val() ** – HoangHieu

ответ

0

имена ID уникальны и не должны использоваться дважды в одной и той же странице. Вы можете получить значение из только проверенных радиокнопок, как это:

var inputs = document.getElementsByTagName('input'); 

for(var i = 0; i < inputs.length; i++) { 
    if(inputs[i].type.toLowerCase() == 'radio') { 
     if (inputs[i].checked){ 
      alert('Checked radio buttons value is:' + inputs[i].value); 
     } 
    } 
} 
+0

Как я могу форматировать html для переключателей для работы с уникальными 'id'? @Slugge – Bigboy6

+0

Им совсем не нужно иметь идентификатор вообще, поскольку поля ввода «имя» здесь определяют, какой элемент он есть. Таким образом, все идентификаторы, которые вы установили в этих полях, можно удалить, а также имя должно быть уникальным, иначе вы не сможете отличать значения. Вы должны прочитать HTML-формы tbh :) – Slugge

+0

@ Bigboy6, пропустив дерево HTML DOM. –

0

В Jquery

$("input[name=slsSupport]:checked").val(); 

В равнинных JS вы хотите, чтобы найти все кнопки радио, дать каждой радиокнопку идентификатор затем выберите их по одному:

function GetSelected() { 
    for(var i=0;i<2;i++) { 
     var element = document.getElementById('radio'+i); 
     if (element.checked === true) 
      return element 
    } 
} 
0

Идентификатор должен быть уникальным во всем документе HTML. Чтобы группировать входы (например, радио), вы должны дать им одно и то же имя (не ID).

Чтобы найти значение с JQuery выглядеть this question и для чистого раствора JS выглядеть this other question.

+0

Кажется, жизнь была бы такой простой, если бы я мог JQuery, но я не могу использовать ее, как это для класса :(@ Rémy J – Bigboy6

+0

@ BigBoy6 Вторая ссылка предназначена для чистого решения JS. –

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