我正在尝试从我的数据库中提取数据,这些数据将动态添加到表单中。根据数据库中的数据值,我有一对单选按钮(“是”和“否”)将被检查不同。
为了实现这一点,我有一个函数接受单选按钮的值作为参数,并根据检查“是”或“否”的位置警告消息。但是,目前该功能一直将未选中的单选按钮返回,即使已经检查过,我也看不出有什么问题。
我很感激我能得到的任何帮助。
我的jQuery代码(Extract):
function checkRadio(radio){
if(radio.checked)
{
alert("button is checked");//$(".BizEdititemDiscountDetails").hide();
}
else
{
alert("button is not checked");//$(".BizEdititemDiscountDetails").show();
}
};
function radioCheck(){
var state=$("#BizEditItemRadioNo").val();
checkRadio(state);
};
<!--Loads item categories-->
$('#BizEditItemCat').load('getitemcategory.php');
<!--Loads item subcategories-->
$('#BizEditItemCat').change(function(){
var category=$('#BizEditItemCat').val();
var encoded= encodeURIComponent(category);
//window.location.href='getbusinesssubcategory.php?category='+encoded;
$('#BizEditItemSubCat').load('getitemsubcategory.php?category='+encoded);
});
<!--Loads items-->
$('#BizEditItemSubCat').change(function(){
var category=$('#BizEditItemCat').val();
var subcategory=$('#BizEditItemSubCat').val();
$('#BizEditItemOld').load("getitems.php",{category:category,subcategory:subcategory});
});
<!--Loads item details-->
$('#BizEditItemOld').change(function(){
var category=$('#BizEditItemCat').val();
var subcategory=$('#BizEditItemSubCat').val();
var item=$('#BizEditItemOld').val();
$('#ItemDetailsContainer').load("getitemdetails.php",{category:category,subcategory:subcategory,item:item},function(){
radioCheck();
});
});
动态添加部分(提取):
if($discount=="1")
{
echo"<div class='BizEditItemDetails'>";
echo"<label for='BizEditItemName'>Name:</label>";
echo"<input class='BizEditItemInput' type='text' id='BizEditItemName' name='BizEditItemName' size='30' maxlength='50' value=\"$name\">";
echo"<span></span>";
echo"</div>";
echo"<div class='BizEditItemDetails'>";
echo"<label for='BizEditItemPrice'>Price:</label>";
echo"<input class='BizEditItemInput' type='number' id='BizEditItemPrice' name='BizEditItemPrice' step='any' min=0 value=\"$price\">";
echo"<span></span>";
echo"</div>";
echo"<div class='BizEditItemDetails'>";
echo"<label>Discount:</label>";
echo"<input type='radio' checked='checked' class='BizEditItemInput' value='Yes' id='BizEditItemRadioYes' name='BizEditItemDiscount'>Yes";
echo"<input type='radio' class='BizEditItemInput' value='No' id='BizEditItemRadioNo' name='BizEditItemDiscount' step='any'>No";
echo"</span></span>";
echo"</div>";
echo"<div class='BizEditItemDetails'>";
echo"<div class='BizEdititemDiscountDetails'>";
echo"<label for='BizEditItemPercent'>Discount Percentage</label>";
echo"<input class='BizEditItemInput' type='number' id='BizEditItemPercent' name='BizEditItemPercent' step='any' min=0 value=\"$discountpercent\">%";
echo"<span></span>";
echo"</div>";
echo"</div>";
echo"<div class='BizEditItemDetails'>";
echo"<div class='BizEdititemDiscountDetails'>";
echo"<label for='BizEditItemDiscountPrice'>Discounted Price:</label>";
echo"<input class='BizEditItemInput' type='number' id='BizEditItemDiscountPrice' name='BizEditItemDiscountPrice' step='any' min=0 value=\"$discountprice\" readonly >";
echo"<span></span>";
echo"</div>";
echo"</div>";
echo"<div class='BizEditItemDetails'>";
echo"<label for='BizEditItemQty'>Quantity:</label>";
echo"<input class='BizEditItemInput' type='number' id='BizEditItemQty' name='BizEditItemQty' min=0 value=\"$qty\">";
echo"<span></span>";
echo"</div>";
echo"<div class='BizEditItemDetails'>";
echo"<label for='BizEditItemDesc'>Desc:</label>";
echo"<textarea class='BizEditItemInput' id='BizEditItemDesc' name='BizEditItemDesc' cols='30' rows='5'>$desc</textarea>";
echo"<span></span>";
echo"</div>";
echo"<div class='BizEditItemDetails'>";
echo"<input class='BizEditItemInput' style='margin-left:360px' type='submit' name='BizEditItemSubmit' value='Submit'>";
echo"</div>";
}
从动态添加部分的摘录中可以看出,单选按钮已经通过checked =“checked”进行了检查,但我一直收到警报(“未选中按钮”),而我的服务器中没有任何其他错误log(localhost)或Chrome中的开发人员控制台。
编辑:(其余的jQuery代码)
<!--Manages loaded item details-->
$('#ItemDetailsContainer').on('change','#BizEditItemRadioNo',function(){
radioCheck(this);
<!--Shows the details when yes is clicked-->
$('#BizEditItemRadioYes').click(function(){
$('.BizEdititemDiscountDetails').show();
});
<!--Hides the details when no is clicked-->
$('#BizEditItemRadioNo').click(function(){
$('.BizEdititemDiscountDetails').hide();
});
<!--calculates the discounted price when discount is checked yes-->
$('#BizEditItemRadioYes').change(function(){
if($(this).val() == 'Yes'){
<!--calculates discount price when discount percentage changes-->
$('#BizEditItemPercent').change(function(){
var percent=$('#BizEditItemPercent').val();
var price=$('#BizEditItemPrice').val();
var discountpercent=percent / 100;
var discountprice=price * discountpercent;
$('#BizEditItemDiscountPrice').val(price - discountprice);
});
<!--calculates discount price when discount price changes-->
$('#BizEditItemPrice').change(function(){
var percent=$('#BizEditItemPercent').val();
var price=$('#BizEditItemPrice').val();
var discountpercent=percent / 100;
var discountprice=price * discountpercent;
$('#BizEditItemDiscountPrice').val(price - discountprice);
});
}
});
$('#BizEditItem').validate({
errorElement:"span",
errorPlacement:function(error,element){
$(error).insertAfter(element);
},
rules:{
BizEditItemCat:{
required:true
},
BizEditItemSubCat:{
required:true
},
BizEditItemOld:{
required:true
},
BizEditItemName:{
required:true,
minlength:5
},
BizEditItemPrice:{
required:true,
min:0
},
BizEditItemDiscount:{
required:true
},
BizEditItemPercent:{
required:true
},
BizEditItemDiscountPrice:{
required:true
},
BizEditItemQty:{
required:true,
min:0
},
BizEditItemDesc:{
required:true,
minlength:20
},
messages:{
BizEditItemCat:{
required:"Please select an item category."
},
BizEditItemSubCat:{
required:"Please select an item subcategory."
},
BizEditItemOld:{
required:"Please select an item."
},
BizEditItemName:{
required:"Please enter an item name.",
minlength:"Please enter at least 5 characters."
},
BizEditItemPrice:{
required:"Please enter an item price.",
min:"Please enter a value greater than 0."
},
BizEditItemDiscount:{
required:"Please enter a value."
},
BizEditItemPercent:{
required:"Please enter a value."
},
BizEditItemDiscountPrice:{
required:"Please enter a value."
},
BizEditItemQty:{
required:"Please enter the number of items you have in stock.",
min:"Please enter a value greater than 0."
},
BizEditItemDesc:{
required:"Please enter an item description.",
minlength:"Please enter at least 20 characters."
},
},
},
submitHandler:function(form){
form.submit();
}
});
});
答案 0 :(得分:3)
.val()
返回input元素的当前值。 e.g。
<input type="radio" name="foo" value="bar" id="baz" />
var x = $('#baz').val(); // returns 'bar'
然后你做相同的
checkRadio('bar');
if ('bar'.checked) { ... }
字符串没有'.checked'属性。您需要传递表示单选按钮本身的节点,例如
checkRadio($('#baz'));