0

在使用相关按钮显示正确的隐藏输入时,我需要一些帮助

我有一个应用程序,你可以在这里查看

请按照以下步骤使用应用程序:

  1. 单击“Open Grid”链接并选择按钮“5”,您将看到下面出现5个按钮“AE”。
  2. 单击按钮“A”和“C”,这些按钮将变为绿色,表示它们已打开。
  3. 现在单击“添加问题”按钮将您所做的事情附加到下面的表格行中。
  4. 现在请再次重复步骤 1-3,但这次选择按钮“7”,您将看到按钮“AG”,然后单击按钮“B”、“D”和“F”以打开这些按钮。

现在您将看到有 2 个表格行,第一个表格行打开了按钮“A”和“C”,第二行打开了按钮“B”、“D”和“F”。

现在我要做的只是发布(使用 $_POST 方法)仅打开的按钮。现在我发现您无法使用 $_POST 方法发布按钮,但您可以为每个按钮创建隐藏输入字段并发布它们,如果按钮打开则隐藏输入值为 1,如果关闭则值为 0。

但是我不确定我是否正确编码,所以我的问题是有人可以查看下面的代码并说明我下面的代码是否可以完成这项工作,还是需要一些调整才能使其工作?我担心相关按钮的隐藏输入不正确:

现在下面是输出字母按钮及其隐藏输入以用于顶部选项和答案控制的代码:

 <table id="optionAndAnswer" class="optionAndAnswer">
    <tr>
        <table id="answerSection">
            <tr>

        <?php
            $i = 1;
            foreach($a as $key => $val){
                if($i%7 == 1) echo"<tr><td>";
                echo"<input type=\"button\" onclick=\"btnclick(this);\" value=\"$val\" id=\"answer".$val."\" name=\"answerName[$val]\" class=\"answerBtns answers answerBtnsOff\">";    
                echo"<input type=\"hidden\" value=\"0\" id=\"hiddenAnswer".$val."\" name=\"hidden[$val]\" class=\"offButtons\">";   
                if($i%7 == 0) echo"</td></tr>";
                $i++;
            }
        ?>
            </tr>
            <tr>
        <td>
        <input class="answerBtns answers answerBtnsOff" name="answerName[True]"  id="answerTrue"    type="button"   value="True"    onclick="btnclick(this);"/>
        <input class="offButtons" name="hidden[True]" id="hiddenAnswerTrue" value="0" type="hidden"/>
        <input class="answerBtns answers answerBtnsOff" name="answerName[False]" id="answerFalse"   type="button"   value="False"   onclick="btnclick(this);"/>
        <input class="offButtons" name="hidden[False]" id="hiddenAnswerFalse" value="0" type="hidden"/>
        <input class="answerBtns answers answerBtnsOff" name="answerName[Yes]"   id="answerYes"     type="button"   value="Yes"     onclick="btnclick(this);"/>
        <input class="offButtons" name="hidden[Yes]" id="hiddenAnswerYes" value="0" type="hidden"/>
        <input class="answerBtns answers answerBtnsOff" name="answerName[No]"    id="answerNo"      type="button"   value="No"      onclick="btnclick(this);"/>
        <input class="offButtons" name="hidden[No]" id="hiddenAnswerNo" value="0" type="hidden"/>
        </td>
        </tr>
        </table>
        </td>
        </tr>
        </table>

下面是它从顶部控件输出字母按钮和隐藏输入并附加到表格行中的代码(用户可以根据需要打开和关闭表格行中的字母按钮):

    function insertQuestion(form) {   

                var context = $('#optionAndAnswer');
        var currenttotal = context.find('.answerBtnsOn').length;        



        var $tbody = $('#qandatbl > tbody'); 
        var $tr = $("<tr class='optionAndAnswer' align='center'>");
        var $td = $("<td class='extratd'>");
        var $answer = $("<div class='answer'>3. Answer:<br/></div>");

        var $this, $row, $cell;
        $('#optionAndAnswer .answers').each(function(i, v) {
            $this = $(this);
            if(i%7 == 0) {
                $row = $("<tr/>").appendTo($answer);
                $cell = $("<td/>").appendTo($row);
            }

            var v = $this.val();
            var a = { name:$this.attr('name'), value:$this.val(), class:$this.attr('class'), id:$this.attr('id')+'Row' };
            var h = $this.is(':visible')?'inline-block':'none'
            var $newBtn = $("<input type='button' style='display:" + h + "' onclick='btnclick(this);' />").attr(a);

            var $newHdn = $("<input type='hidden' value='0' id='hiddenAnswer" + v  + "' name='hidden[" + v + "]' class='offButtons' />");

            $newBtn.appendTo($cell);
            $newHdn.appendTo($cell);
        });


        $tr.append($td);
        $td.append($answer);
        $tbody.append($tr); 



    }

最后下面是打开和关闭字母按钮及其相关隐藏输入的代码:

    function btnclick(btn)
    {
        var context = $(btn).parents('#optionAndAnswer');
        if (context.length == 0) {
            context = $(btn).parents('tr');
        }
        var $btn = $(btn);
        var value = btn.value;

    $(btn).toggleClass("answerBtnsOff");
    $(btn).toggleClass("answerBtnsOn");

        var hiddenId = '#hiddenAnswer'+btn.value;
        if ( $(btn).hasClass("answerBtnsOff") )
        {
            $(hiddenId).val('0');
            $(hiddenId).toggleClass('offButtons');
            $(hiddenId).toggleClass('onButtons');       
        }
        else
        {
            $(hiddenId).val('1');
            $(hiddenId).toggleClass('onButtons');
            $(hiddenId).toggleClass('offButtons');
        }   

        $('.answertxt', context).val(context.find('.answerBtnsOn').length > 0 ? context.find('.answerBtnsOn').length : 0);

        return false;
    }
4

1 回答 1

0

我通常在测试时将隐藏输入转换为文本输入,这样我就可以看到值是什么。

You can also use Chrome JS console where you can type some JS like $("#input_id").val(); and you'll get the value

于 2012-10-05T11:27:04.517 回答