复选框不工作


Checked Checkbox Not Working?

我有一个HTML表单,张贴到一个PHP脚本。除复选框外,一切正常。当它被选中时,值没有被发送。

HTML:

<input name="test" id="checkbox-02" type="checkbox" value="1" />
PHP:

if(!isset($_POST['test'])) {
  $eventRepeat="No";
}
if(isset($_POST['test'])) {
  $eventRepeat="Yes";
}

当这段代码运行时,$eventRepeat总是显示为"No"。我尝试使用命令"print_r($_POST)",所有输入都被张贴,除了复选框,,即使它被选中

你知道是什么原因导致的吗?我确实有jQuery运行,所以当它被选中两个div出现。会不会是某种干扰?这是jQuery:

$(document).ready(function () {
$('#checkbox-02').change(function () {
    if (!this.checked) 
    //  ^
       $('#repeatUntilDIV').fadeIn('slow');
       $('#repeatFrequencyDIV').fadeIn('slow');
});
});

作为参考,这里是完整的代码:

           <form class="cmxform form-horizontal tasi-form" id="commentForm" role="form" action="" method="post">
        <div class="form-group">
            <label for="inputEventTitle" class="col-lg-2 control-label">Event Title</label>
            <div class="col-lg-10">
                <input type="text" class="form-control" id="inputEventTitle" name="inputEventTitle" placeholder="Event Title" required>
            </div>
        </div>
        <div class="form-group">
            <label for="inputEventDescription" class="col-lg-2 control-label">Description</label>
            <div class="col-lg-10">
                <input type="text" class="form-control" id="inputEventTitle" name="inputEventDescription" placeholder="Event Description" required>
            </div>
        </div>
        <div class="form-group">
            <label for="inputEventStartTime" class="col-lg-2 control-label">Start Time</label>
            <div class="col-lg-10">
              <select name="inputEventStartTime" class="form-control" id="dp1" required>
                <option label="Start Time">
                <option value="12:00AM">12:00AM</option>
                <option value="12:15AM">12:15AM</option>
                <option value="12:30AM">12:30AM</option>
                <option value="12:45AM">12:45AM</option>
                <option value="1:00AM">1:00AM</option>
              </select>
          </div>
        </div>  
        <div class="form-group">
            <label for="inputEventEndTime" class="col-lg-2 control-label">End Time</label>
            <div class="col-lg-10">
              <select name="inputEventEndTime" class="form-control" id="dp1" required>
                <option label="End Time">
                <option value="1:00AM">1:00AM</option>
                <option value="1:15AM">1:15AM</option>
                <option value="1:30AM">1:30AM</option>
                <option value="1:45AM">1:45AM</option>
                <option value="2:00AM">2:00AM</option>
              </select>                </div>
        </div>                      
        <div class="form-group">
          <label class="control-label col-sm-2">Date</label>
          <div class="col-sm-6">
            <input id="dp1" name="inputEventDate" type="text" size="16" class="form-control" required>
          </div>
        </div>
         <div class="form-group">
            <label for="inputEventDate" class="col-lg-2 control-label">Repeat?</label>
            <div class="col-lg-10 checkboxes">
              <label class="label_check" for="checkbox-02"> </label>
              <input name="test" id="checkbox-02" type="checkbox" value="1" /> Yes, I want to repeat this event.
            </div>
        </div>
         <div class="form-group" id="repeatUntilDIV" style="display:none;">
            <label for="inputEventEndDate" class="col-lg-2 control-label">Repeat Until</label>
            <div class="col-lg-10">
              <input name="inputEventEndDate" id="eventEndDate" type="text" placeholder="End Date" class="form-control">                                            
            </div>
        </div>  
         <div class="form-group" id="repeatFrequencyDIV" style="display:none;">
            <label for="inputEventFrequency" class="col-lg-2 control-label">Repeat Every</label>
            <div class="col-lg-10">
             <select name="inputEventFrequency" class="form-control" id="dp1">
                <option label="Repeat Every">
                <option value="1">Repeat Every Day</option>
                <option value="2">Repeat Every Other Day</option>
                <option value="7">Repeat Every Week</option>
                <option value="14">Repeat Every Other Week</option>
                <option value="30">Repeat Every Month</option>
              </select>
            </div>
        </div>                          
  </div>
  <div class="modal-footer">
    <button type="button" class="btn btn-primary" data-dismiss="modal">Cancel</button>
    <input type="submit" name="addPrimaryEvent" class="btn btn-success" value="Submit" />
       </form>

我得到这个从var_dump($_POST):

  array(8) {
  ["inputEventTitle"]=>
  string(5) "Title"
  ["inputEventDescription"]=>
  string(11) "Description"
  ["inputEventStartTime"]=>
  string(6) "2:00AM"
  ["inputEventEndTime"]=>
  string(6) "3:00AM"
  ["inputEventDate"]=>
  string(10) "05-26-2014"
  ["inputEventEndDate"]=>
  string(10) "05-29-2014"
  ["inputEventFrequency"]=>
  string(1) "1"
  ["addPrimaryEvent"]=>
  string(6) "Submit"
}

很不清楚为什么这不起作用。但我注意到了不一致之处。不平衡的HTML标签,以及一个空的action="",这不是HTML5有效。要了解更多细节,请参阅这里的精彩答案。

所以我把它设置为#。您可能希望将其更改为PHP脚本(如action="form.php")的完整文件名或路径。或者你可以像这样把它删掉:

<form class="cmxform form-horizontal tasi-form" id="commentForm" role="form" action="#" method="post">

但我更喜欢明确&建议采用action="form.php"的处理方式。下面是整理后的HTML表单:

<form class="cmxform form-horizontal tasi-form" id="commentForm" role="form" action="#" method="post">
    <div class="form-group">
        <label for="inputEventTitle" class="col-lg-2 control-label">Event Title</label>
        <div class="col-lg-10">
            <input type="text" class="form-control" id="inputEventTitle" name="inputEventTitle" placeholder="Event Title" required="" />
        </div>
    </div>
    <div class="form-group">
        <label for="inputEventDescription" class="col-lg-2 control-label">Description</label>
        <div class="col-lg-10">
            <input type="text" class="form-control" id="inputEventTitle" name="inputEventDescription" placeholder="Event Description" required="" />
        </div>
    </div>
    <div class="form-group">
        <label for="inputEventStartTime" class="col-lg-2 control-label">Start Time</label>
        <div class="col-lg-10">
            <select name="inputEventStartTime" class="form-control" id="dp1" required="">
                <option value="12:00AM">
                    12:00AM
                </option>
                <option value="12:15AM">
                    12:15AM
                </option>
                <option value="12:30AM">
                    12:30AM
                </option>
                <option value="12:45AM">
                    12:45AM
                </option>
                <option value="1:00AM">
                    1:00AM
                </option>
            </select>
        </div>
    </div>
    <div class="form-group">
        <label for="inputEventEndTime" class="col-lg-2 control-label">End Time</label>
        <div class="col-lg-10">
            <select name="inputEventEndTime" class="form-control" id="dp1" required="">
                <option value="1:00AM">
                    1:00AM
                </option>
                <option value="1:15AM">
                    1:15AM
                </option>
                <option value="1:30AM">
                    1:30AM
                </option>
                <option value="1:45AM">
                    1:45AM
                </option>
                <option value="2:00AM">
                    2:00AM
                </option>
            </select>
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-sm-2">Date</label>
        <div class="col-sm-6">
            <input id="dp1" name="inputEventDate" type="text" size="16" class="form-control" required="" />
        </div>
    </div>
    <div class="form-group">
        <label for="inputEventDate" class="col-lg-2 control-label">Repeat?</label>
        <div class="col-lg-10 checkboxes">
            <input name="test" id="checkbox-02" type="checkbox" value="1" /> Yes, I want to repeat this event.
        </div>
    </div>
    <div class="form-group" id="repeatUntilDIV" style="display:none;">
        <label for="inputEventEndDate" class="col-lg-2 control-label">Repeat Until</label>
        <div class="col-lg-10">
            <input name="inputEventEndDate" id="eventEndDate" type="text" placeholder="End Date" class="form-control" />
        </div>
    </div>
    <div class="form-group" id="repeatFrequencyDIV" style="display:none;">
        <label for="inputEventFrequency" class="col-lg-2 control-label">Repeat Every</label>
        <div class="col-lg-10">
            <select name="inputEventFrequency" class="form-control" id="dp1">
                <option value="1">
                    Repeat Every Day
                </option>
                <option value="2">
                    Repeat Every Other Day
                </option>
                <option value="7">
                    Repeat Every Week
                </option>
                <option value="14">
                    Repeat Every Other Week
                </option>
                <option value="30">
                    Repeat Every Month
                </option>
            </select>
        </div>
    </div>
    <div class="modal-footer">
        <button type="button" class="btn btn-primary" data-dismiss="modal">Cancel</button> <input type="submit" name="addPrimaryEvent" class="btn btn-success" value="Submit" />
    </div>
</form>