功能未按预期响应

时间:2013-11-26 18:44:49

标签: javascript php jquery html

我正在尝试从我的数据库中提取数据,这些数据将动态添加到表单中。根据数据库中的数据值,我有一对单选按钮(“是”和“否”)将被检查不同。

为了实现这一点,我有一个函数接受单选按钮的值作为参数,并根据检查“是”或“否”的位置警告消息。但是,目前该功能一直将未选中的单选按钮返回,即使已经检查过,我也看不出有什么问题。

我很感激我能得到的任何帮助。

我的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();

    }

});

});

1 个答案:

答案 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'));