Jquery表单验证,其中需要根据输入复选框数组检查输入文本数组

时间:2017-02-21 04:47:27

标签: php html checkbox jquery-validate

我有一个表单,我想分享表单的截图来更好地解释问题: - enter image description here

在表单中,有五个表情符号,每个表情符号都有一个复选框和一个输入文本。如果你选择一个特定的笑脸(通过选中复选框),那么图像位置就会与你放在文本框中的文本一起保存在数据库中。

笑脸(以及复选框和文本框在html中列出如下: -

<div id="smiley_container">
    <?php for($i=1;$i<=5;$i++) 
          { ?>
                <div class="form-group col-sm-12">
                    <label class="col-sm-2">Smiley <?php echo $i;?><span class="required_span">*</span>
                    </label>
                    <div class="col-sm-1">
                        <img src="<?php echo base_url();?>uploads/smiley/<?php echo $i;?>.png" style="width:40px;"/>
                    </div>
                    <div class="col-sm-1">
                        <input type="checkbox" name="smileycheck[]" id="smileycheck_<?php echo $i;?>" value="<?php echo $i;?>" />
                    </div>
                    <div class="col-sm-7">
                        <input type="text" class="form-control" placeholder="Set name for the smiley" name="smileyname[]" id="smileyname_<?php echo $i;?>"  />
                    </div>
             </div>
    <?php } ?>
</div>

现在我有一个像这样的验证码 -

$(function() {
    // Initialize form validation on the registration form.
    // It has the name attribute "registration"
    $("form[name='myQstnForm']").validate({
        // Specify validation rules
        rules: {
            // The key name on the left side is the name attribute
            // of an input field. Validation rules are defined
            // on the right side
            desc: "required",         
            type: "required",
            "option[]": "required",
            "smileyname[]": "required",
        },
        // Specify validation error messages
        messages: {
            desc: "Please provide question text",         
            type: "Please select question type",
            "option[]": "Please provide data",
            "smileyname[]": "Please provide data",
        },
        // Make sure the form is submitted to the destination defined
        // in the "action" attribute of the form when valid
        submitHandler: function(form) {
            form.submit();
        }
    });
});

现在,上面的jquery代码希望填充所有选项文本。实际上,只需要那些文本来填补已经选中了相应的复选框。

我该如何解决这个问题?

1 个答案:

答案 0 :(得分:0)

使用5复选框常用名称....

复选框的示例代码

<form action="#" method="post">
<input type="checkbox" name="gender" value="Male">Male</input>
<input type="checkbox" name="gender" value="Female">Female</input>
<input type="submit" name="submit" value="Submit"/>
</form>
<?php
if (isset($_POST['gender'])){
echo $_POST['gender']; // Displays value of checked checkbox.
}
?>