Question

表单应该显示图像，让某人对其进行评分然后保存信息。但是，当我单击提交按钮时没有任何反应。如果我将评级更改为用户输入数字的文本框，它可以完美地工作，单选按钮它会停止工作，我无法找出原因！

<?php // no direct access
defined('_JEXEC') or die('Restricted access'); ?>
<script type="text/javascript">

    function trim(s){   
            var i;
            var returnString = "";
            for (i = 0; i < s.length; i++){   
                // Check that current character isn't whitespace.
                var c = s.charAt(i);
                if (c != " ") returnString += c;
            }
         return returnString;
    }
    //check is integer
    function isInteger(s){   
        var i;
        if(trim(s)==''){return false;}
        for (i = 0; i < s.length; i++){   
            var c = s.charAt(i);
            if (((c < "0") || (c > "9"))) return false;
        }
        return true;
    }
    function xmlhttpPost(strURL) {
                            var xmlHttpReqs = false;
                            if (window.XMLHttpRequest) {
                                xmlHttpReqs = new XMLHttpRequest();
                            }else if (window.ActiveXObject) {
                                xmlHttpReqs = new ActiveXObject("Microsoft.XMLHTTP");
                            }
                            xmlHttpReqs.open('POST', strURL, true);
                            xmlHttpReqs.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
                            xmlHttpReqs.onreadystatechange = function() {
                                if (xmlHttpReqs.readyState == 4) {

                                    updatepage(xmlHttpReqs.responseText);
                                    setTimeout("window.location = 'index.php'",2000);
                                }
                            }
                            document.getElementById("load").innerHTML ="Loadding...";
                            xmlHttpReqs.send(getquerystring());
                        }
    function getquerystring() {
                            var form     = document.forms['rateForm'];
                            var numbervote = form.numbervote.value ;
                            var name = form.name.value ;
                            var folder = form.folder.value ;
                            qstr = 'w='+escape(numbervote)+'&w1='+escape(name)+'&w2='+escape(folder);
                            return qstr;
                        }
    function chck(){
                            xmlhttpPost("<?php echo JURI::root(); ?>modules/mod_image_ratting/saverate.php");
                        }
                        function updatepage(str){
                            document.getElementById("load").innerHTML =  str;
                            document.getElementById("load").style.visibility = "visible";
                        }
    function submitVote(){
        var form = document.rateForm;
        if(form.numbervote.value==''){
            document.getElementById('numbervoteErr').style.display='block';
            return false;
        }else if(!isInteger(form.numbervote.value)){
            document.getElementById('numbervoteErr').style.display='block';
            return false;
        }else if(form.numbervote.value > 10){
            document.getElementById('numbervoteErr').style.display='block';
            return false;
        }
        else{
            chck();
        }
    }

</script>

<form action="<?php echo JRoute::_( 'index.php' );?>" method="get" name="rateForm" id="rateForm" class="form-validate" >
    <table style="width:100%;border:0px;">
        <tr>
            <td>
                <?php if ($link) : ?>
                <a href="<?php echo $link; ?>" target="_self">
                <?php endif; ?>
                    <?php echo JHTML::_('image', $image->folder.'/resize/'.$image->name, $image->name); ?>
                <?php if ($link) : ?>
                </a>
                <?php endif; ?>
            </td>
        </tr>
        <?php
            //if($image->rates > 0){
                ?>
                <tr>
                    <td>
                        <?php JHTML::_( 'behavior.modal' ); ?>
                        <?php echo $image->rates;?> people liked this photo &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <a class="modal" href="index2.php?option=com_imageratting&task=viewrates&file=<?php echo  $image->name;?>&f=<?php echo htmlentities(urlencode($image->folder));?>" style="text-decoration:underline;">View Full Size Image</a>
                    </td>
                </tr>
                <?php
            //}
        ?>
        <tr>
            <td>
                <span>
                    <input type="radio" name="numbervote" value="1" checked /> 1<br />
                    <input type="radio" name="numbervote" value="2" /> 2<br />
                    <input type="radio" name="numbervote" value="3" /> 3<br />
                    <input type="radio" name="numbervote" value="4" /> 4<br />
                    <input type="radio" name="numbervote" value="5" /> 5<br />
                </span>
                <span>
                    <input type="button" value="Rate the image!" onclick="submitVote();"/>
                </span>
            </td>
        </tr>
        <tr>
            <td>
                <div id="load" style="color:red;font-size:11px;font-style:italic;"></div>
            </td>
        </tr>
        <tr>
            <td>
                <span style="display:none;color:red;font-size:11px;font-style:italic;" id="numbervoteErr"><?php echo 'Rating must be a number between 0 and 5';?></span>
            </td>
        </tr>

    </table>
    <input type="hidden" name="isSaveRate" value="1" />
    <input type="hidden" name="option" value="com_imageratting" />
    <input type="hidden" name="name" value="<?php echo $image->name; ?>" />
    <input type="hidden" name="folder" value="<?php echo $image->folder; ?>" />
    <input type="hidden" name="task" value="rate" />
</form>

Answer 1

这种情况正在发生，因为您无法使用form.numbervote.value访问radiobutton的选定值，并返回undefined。但是，您可以使用document.rateForm.elements.numbervote获取radiobutton的所有值，然后循环遍历值以获取选中的单选按钮。以下是工作代码： -

//Added this function
    function getCheckedRadio(radio_group) 
{
    for (var i = 0; i < radio_group.length; i++) 
    {
        var button = radio_group[i];
        if (button.checked) 
        {
            return button;
        }
    }
    return undefined;
}


//Corrected this function
    function submitVote()
{

var form = document.rateForm;
var checkedButton = getCheckedRadio(document.rateForm.elements.numbervote);
if (checkedButton) 
{
    selectedvalue = checkedButton.value;
}

        if(selectedvalue=='')
    {
    document.getElementById('numbervoteErr').style.display='block';
    return false;
}else if(!isInteger(selectedvalue)){
    document.getElementById('numbervoteErr').style.display='block';
    return false;
}else if(selectedvalue > 10){
    document.getElementById('numbervoteErr').style.display='block';
    return false;
}
else
    {
    chck();
}

}

您可以查看How to get selected radio button valiue。

当简单的事情不像我们期望的那样工作时，有时真的很烦人。你会看到很多这样的东西使用普通的JavaScript，必须要小心。在这种情况下重用getCheckedRadio()等功能。

使用单选按钮，joomla / php评级图像的模块

1 个答案: