如何使三个输入类型按钮之一需要

时间:2017-09-30 18:49:04

标签: javascript jquery html validation required

我的问题是我有一个带有一些字段和三个输入类型按钮的表单,它们都代表一条消息。我想选择所需的三条消息之一。我的代码如下:

<input id="poruka1" type="button"  class="hm_datumibtn poruka" name="poruka1" value="Pored mene, sve želje "  >


 <input id="poruka2" type="button"  class="hm_datumibtn poruka" name="poruka2" value="Pored sebe, sve želje " >




<input id="poruka3" type="button"  class="hm_datumibtn poruka" name="poruka3" value="Pored tebe, sve želje "  >

你知道我怎么能解决这类问题?

<script>


            function upis(){

                //var datum = $(this).find('.datum').val();
                //var poruka = $(this).find('.poruka').val();
                //var poruka = $(this).attr('value');
                if (poruka_forma.poruka1.value == '' && poruka_forma.poruka2.value == ''&& poruka_forma.poruka3.value == '') {
                    alert('You have to choose message.');
                    return false;
                }
                else {
                    myForm.submit();
                }

                var ime = document.getElementById("ime").value;
                var ime_slavljenik = document.getElementById("ime_slavljenik").value;
                var elementsdate = document.getElementsByClassName("selected_date");
                var datum = elementsdate[0].value;
                var elements = document.getElementsByClassName("selected");
                var poruka = elements[0].value;

                //var poruka = document.getElementById("poruka").value;


                //var datum = document.getElementById("datum").value;
                //var poruka = document.getElementById("poruka").value;
                //var email = document.getElementById("email").value;
                //var dataString = "ime="+encodeURIComponent(ime)+"&ime_slavljenik="+encodeURIComponent(ime_slavljenik);

            $.ajax({

                  type:"post",
                  url: "upis.php",
                  cashe: false,
                  //data: dataString+'&datum='+datum+'&poruka='+poruka,
                  data: {ime:ime,ime_slavljenik:ime_slavljenik,datum:datum, poruka:poruka},
                  success: function(data){
                      //window.alert(data);
                      document.getElementById("placefortableanketa").innerHTML = data;
                  },
                  error: function (req, status, err) {
                console.log('Something went wrong', status, err);
                }
              })
              return false;
        }
        </script>

1 个答案:

答案 0 :(得分:2)

我想您可能想要使用<form> <input type="radio" id="radio_btn_1" name="radio_btn" value="choice_1" required="required" checked="checked" /><label for="radio_btn_1">Choice 1</label><br /> <input type="radio" id="radio_btn_2" name="radio_btn" value="choice_2" required="required" /><label for="radio_btn_2">Choice 2</label><br /> <input type="radio" id="radio_btn_3" name="radio_btn" value="choice_3" required="required" /><label for="radio_btn_3">Choice 3</label><br /> </form>。例如:

required

您可以添加checked属性以使其必需。此外,添加<label>属性将使默认选择一个单选按钮。

您还可以将forlabel属性一起使用。单击id后,它会在for属性中选择<label>引用的单选按钮。

编辑:我看到您的评论,因为设计,您不想使用单选按钮。您实际上可以隐藏单选按钮,只需使用for属性<style> #radio_btn_1:checked + label{background-color:red;} #radio_btn_2:checked + label{background-color:red;} #radio_btn_3:checked + label{background-color:red;} </style> <form> <input style="display:none;" type="radio" id="radio_btn_1" name="radio_btn" value="choice_1" required="required" checked="checked" /><label for="radio_btn_1">Choice 1</label><br /> <input style="display:none;" type="radio" id="radio_btn_2" name="radio_btn" value="choice_2" required="required" /><label for="radio_btn_2">Choice 2</label><br /> <input style="display:none;" type="radio" id="radio_btn_3" name="radio_btn" value="choice_3" required="required" /><label for="radio_btn_3">Choice 3</label><br /> </form>即可。例如:

mat <- matrix(c(sample(1:10, 5), sample(11:20, 5)), ncol=2)
mat <- as.data.frame(mat)
mat$value <- 1 

dcast(data = mat, V1 ~ V2, value.var = "value", sum)
# V1 15 16 17 18 20
# 1  2  0  0  0  0  1
# 2  6  1  0  0  0  0
# 3  8  0  0  1  0  0
# 4  9  0  1  0  0  0
# 5 10  0  0  0  1  0