我将开始用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。请帮助我?作为初学者请原谅我是否犯了错误
答案 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>