如果未单击复选框,则如果为空白,则如何将文本框的值设置为0

时间:2017-07-13 11:30:26

标签: php jquery

我将开始用php学习jquery。我有表格(我从谷歌复制)

$('document').ready(function() {
  $('.toggleswitch').bootstrapToggle();
  $("#check1 .stars").click(function() {
    $(this).attr("checked");
  });

});
/****** Rating Starts *****/

@import url(http://netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css);
fieldset,
label {
  margin: 0;
  padding: 0;
}

body {
  margin: 20px;
}

h1 {
  font-size: 1.5em;
  margin: 10px;
}

.rating {
  border: none;
  float: left;
}

.rating>input {
  display: none;
}

.rating>label:before {
  margin: 5px;
  font-size: 1.25em;
  font-family: FontAwesome;
  display: inline-block;
  content: "\f005";
}

.rating>.half:before {
  content: "\f089";
  position: absolute;
}

.rating>label {
  color: #ddd;
  float: right;
}

.rating>input:checked~label,
.rating:not(:checked)>label:hover,
.rating:not(:checked)>label:hover~label {
  color: #FFD700;
}

.rating>input:checked+label:hover,
.rating>input:checked~label:hover,
.rating>label:hover~input:checked~label,
.rating>input:checked~label:hover~label {
  color: #FFED85;
}


/* Downloaded from http://devzone.co.in/ */
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-toggle/2.2.2/css/bootstrap-toggle.min.css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-toggle/2.2.2/js/bootstrap2-toggle.min.js"></script>
<form action="" method="POST" />
<fieldset id='check1' class="rating">
  <input class="stars" type="radio" id="star_a-5" name="rating" value="5" />
  <label class="full" for="star5" title="Awesome - 5 stars"></label>
  <input class="stars" type="radio" id="star_a_5-half" name="rating" value="4.5" />
  <label class="half" for="star4half" title="Pretty good - 4.5 stars"></label>
  <input class="stars" type="radio" id="star_a-4" name="rating" value="4" />
  <label class="full" for="star4" title="Pretty good - 4 stars"></label>
  <input class="stars" type="radio" id="star_a_4-half" name="rating" value="3.5" />
  <label class="half" for="star3half" title="Meh - 3.5 stars"></label>
  <input class="stars" type="radio" id="star_a-3" name="rating" value="3" />
  <label class="full" for="star3" title="Meh - 3 stars"></label>
  <input class="stars" type="radio" id="star_a_3-half" name="rating" value="2.5" />
  <label class="half" for="star2half" title="Kinda bad - 2.5 stars"></label>
  <input class="stars" type="radio" id="star2" name="rating" value="2" />
  <label class="full" for="star2" title="Kinda bad - 2 stars"></label>
  <input class="stars" type="radio" id="star1half" name="rating" value="1.5" />
  <label class="half" for="star1half" title="Meh - 1.5 stars"></label>
  <input class="stars" type="radio" id="star1" name="rating" value="1" />
  <label class="full" for="star1" title="Sucks big time - 1 star"></label>
  <input class="stars" type="radio" id="starhalf" name="rating" value="0.5" />
  <label class="half" for="starhalf" title="Sucks big time - 0.5 stars"></label>
</fieldset>
<br>

<input type="submit" onclick="setValue()" name="btn_submit" value="submit" />
</div>

使用这个PHP:

<?php
if(isset($_POST['btn_submit']))
{
    echo '<pre>';
    print_r($_POST);
}

?>

此表格工作正常。如果我点击星级率并提交按钮,我得到输出

 Array
(
    [rating] => 1
    [btn_submit] => submit
)

如果我没有选择任何评级输出就像

Array
    (

        [btn_submit] => submit
    )

但我希望

Array
        (
            [rating] => 0
            [btn_submit] => submit
        )

我试过

 function setValue()
        {
             var input = document.getElementById('check1');

     if(input.value.length == '')
    input.value = 0;
        }

如果我没有点击星形率输入字段设置为0?如果我有更多文本输入,如check2 check3 check4使用 jquery ,我该怎么办?我想将所有输入文本字段设置为如果未点击评级,则在发送数据前为0。请帮助我?作为初学者请原谅我是否犯了错误

3 个答案:

答案 0 :(得分:1)

这不会作为参数发布到服务器,如果您不检查任何复选框

另外,您可以签入PHP文件,即是否已发布。

尝试

if(isset($_POST['btn_submit']))
{
    $_POST['rating'] = isset($_POST['rating']) ? $_POST['rating'] : '0';
    echo '<pre>';
    print_r($_POST);

答案 1 :(得分:1)

首先在PHP中添加条件,如下所示

if(!isset($_POST['rating'])){
   $_POST['rating'] = 0;
}
print_r($_POST);

答案 2 :(得分:1)

不要使用提交按钮来检查值 - 而是设置值和用户要检查的表单的提交事件

我还必须删除未使用的引导程序并更改无线电的ID

当你点击服务器时,你需要检查是否设置了提交但没有通过无线电。那意味着0 - 现在我的jQuery不允许提交,如果没有评级 - 我给表单一个ID

$('document').ready(function() {
  $("#myForm").on("submit",function(e) {
     if($("#check1 .stars:checked").length==0) {
       alert("Please rate");
       e.preventDefault();
     }
  })
});
/****** Rating Starts *****/
@import url(https://netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css);

fieldset,
label {
  margin: 0;
  padding: 0;
}

body {
  margin: 20px;
}

h1 {
  font-size: 1.5em;
  margin: 10px;
}

.rating {
  border: none;
  float: left;
}

.rating>input {
  display: none;
}

.rating>label:before {
  margin: 5px;
  font-size: 1.25em;
  font-family: FontAwesome;
  display: inline-block;
  content: "\f005";
}

.rating>.half:before {
  content: "\f089";
  position: absolute;
}

.rating>label {
  color: #ddd;
  float: right;
}

.rating>input:checked~label,
.rating:not(:checked)>label:hover,
.rating:not(:checked)>label:hover~label {
  color: #FFD700;
}

.rating>input:checked+label:hover,
.rating>input:checked~label:hover,
.rating>label:hover~input:checked~label,
.rating>input:checked~label:hover~label {
  color: #FFED85;
}


/* Downloaded from http://devzone.co.in/ */
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<form id="myForm" action="" method="POST" />
<fieldset id='check1' class="rating toggleswitch">
  <input class="stars" type="radio" id="star5" name="rating" value="5" data-toggle="toggle"/>
  <label class="full" for="star5" title="Awesome - 5 stars"></label>
  <input class="stars" type="radio" id="star4half" name="rating" value="4.5" data-toggle="toggle"/>
  <label class="half" for="star4half" title="Pretty good - 4.5 stars"></label>
  <input class="stars" type="radio" id="star4" name="rating" value="4" data-toggle="toggle"/>
  <label class="full" for="star4" title="Pretty good - 4 stars"></label>
  <input class="stars" type="radio" id="star3half" name="rating" value="3.5" data-toggle="toggle"/>
  <label class="half" for="star3half" title="Meh - 3.5 stars"></label>
  <input class="stars" type="radio" id="star3" name="rating" value="3" data-toggle="toggle"/>
  <label class="full" for="star3" title="Meh - 3 stars"></label>
  <input class="stars" type="radio" id="star2half" name="rating" value="2.5" data-toggle="toggle"/>
  <label class="half" for="star2half" title="Kinda bad - 2.5 stars"></label>
  <input class="stars" type="radio" id="star2" name="rating" value="2" />
  <label class="full" for="star2" title="Kinda bad - 2 stars"></label>
  <input class="stars" type="radio" id="star1half" name="rating" value="1.5" data-toggle="toggle"/>
  <label class="half" for="star1half" title="Meh - 1.5 stars"></label>
  <input class="stars" type="radio" id="star1" name="rating" value="1" data-toggle="toggle" />
  <label class="full" for="star1" title="Sucks big time - 1 star"></label>
  <input class="stars" type="radio" id="starhalf" name="rating" value="0.5" data-toggle="toggle"/>
  <label class="half" for="starhalf" title="Sucks big time - 0.5 stars"></label>
</fieldset>
<br>

<input type="submit" name="btn_submit" value="submit" />
</div>