2014-10-28 5 views
-2

Немного застрял, куда идти отсюда. Я бы хотел, чтобы моя радиокнопка (ы) вернула значение выбранной кнопки. Но прямо сейчас его единственное значение возвращает значение первого элемента. Как я могу сделать это через все значения, вот мой код.Выбор радиокнопки

<!DOCTYPE html> 
<html> 
<body> 
    <?php include 'db_connector.php'; 
     $result = mysqli_query($con,"SELECT name FROM os_scope"); 
     while($row = mysqli_fetch_array($result)) { 
      $row['name']; 
      echo "<input type='radio' name='os' value=".$row['name']." id='myRadio'>"; 
     } 
    ?> 

    <p>Click the "Try it" button to display the value of the radio button.</p> 
    <button onclick="myFunction()">Try it</button> 
    <p id="demo"></p> 

    <script> 
     function myFunction() { 
      var x = document.getElementById("myRadio").value; 
      document.getElementById("demo").innerHTML = x; 
     } 
    </script> 
</body> 
</html> 
+4

идентификаторы должны быть уникальными в контексте документа ... –

ответ

1
<script> 
    function myFunction() { 
     var x = document.getElementsByName('os'); 
     var rate_value; 
     for(var i = 0; i < x.length; i++){ 
      if(x[i].checked){ 
       rate_value = x[i].value; 
       break; 
      } 
     } 
     document.getElementById("demo").innerHTML = rate_value; 

    } 
</script> 

+0

OMG Большое вам спасибо, что работало именно так, как я этого хочу. – Annie

+0

Как я могу использовать возвращаемое значение id для записи запроса mysql с помощью кода выше? SELECT * FROM os WHERE scope = 'id'; – Annie

1

Попробуйте это: перебирать все радиокнопку с именем = «зева», а затем проверить, какой из них имеет checked атрибут верно.

ПРИМЕЧАНИЕ - id s должно быть уникальным всегда, следовательно, использовать различные id для различных радио-кнопки.

function myFunction() { 
    var radiobutton = document.getElementsByName("os"); 
    var x = ''; 
    for(var i=0;i<radiobutton.length;i++) 
    { 
     if(radiobutton[i].checked) 
     x = radiobutton[i].value; 
    } 
    document.getElementById("demo").innerHTML = x; 
} 
+0

Спасибо так много, вы понятия не имеете, сколько помощь это было для меня , – Annie

+0

рад помочь вам :) –

+0

Как использовать возвращаемое значение id для написания запроса mysql, используя код выше? Что-то вроде ... SELECT * FROM os WHERE scope = 'id' 'id' - это возвращаемое значение с помощью переключателя. Любая помощь будет принята с благодарностью. – Annie

1

Во-первых: элемент Идентификатор должен быть уникальным id='myRadio' в цикле в то время как привычка быть уникальным.

я предложил бы использовать class (вместо id) и jQuery (для-CSS, как селекторы в JavaScript):

function getSelectedRadioValue() { 
 
    alert($('.myRadio:checked').first().val()); 
 
}
<html> 
 

 
<head> 
 
    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
</head> 
 

 
<body> 
 
    <input type='radio' name='os' value="1" class='myRadio'>1 
 
    <input type='radio' name='os' value="2" class='myRadio'>2 
 
    <input type='radio' name='os' value="3" class='myRadio'>3 
 

 
    <p>Click the "Try it" button to display the value of the radio button.</p> 
 
    <button onclick="getSelectedRadioValue()">Try it</button> 
 
    <p id="demo"></p> 
 

 
</body> 
 

 
</html>

АЯКС Пример

Ajax является synchronious сервер и они возвращают данные, которые вы можете использовать в jquery на своем веб-сайте. Например:

function sendMessage() { 
 

 
    $.post("your url to serverside script you want to execute.php" 
 
    , { 'Index': 'Data Found in $_Post'} //in execute.php $_POST['Index'] will now contain: 'Data Found in $_Post' 
 
    , function(data) { 
 
    //in data will be the stuff you echo-ed in your php script (if you used json_encode($data) in php this will be automatically detected and converted to a javascript object. 
 
    $("$body").html(data); //for instance we get html from the AJAX call (execute.php) and insert in the #body div 
 
    }).fail(function(){ 
 
    alert('The server returned an error'); //ofcourse server returns an error, because URL used in this example does not exist 
 
    }); 
 

 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="body"> 
 

 
</div> 
 

 
<button onclick="sendMessage()">execute AJAX call</button>

+0

Большое вам спасибо, я очень ценю вашу помощь. – Annie

+0

Как я могу использовать возвращаемое значение id для написания запроса mysql, используя код выше? Что-то вроде ... SELECT * FROM os WHERE scope = 'id' 'id' - это возвращаемое значение с помощью переключателя. Любая помощь будет принята с благодарностью. – Annie

+0

Отправить форму или использовать AJAX. (сделайте это serveride в php) –

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