5

I'm using the PHP CodeIgniter framework.

The problem is that I want the user to check those fields that they have entered and approved by selecting checkbox then submitting the form.

Like these are the fields.

<tr>    
    <td>Remarks </td>
    <td><textarea name="particular" rows="3" class="save_record autosuggestship"></textarea></td>   
    <td>&nbsp;</td>
    <td>&nbsp;</td>                 
</tr>
<tr>
    <td>Custom Reference No.</td>
    <td><input type = 'text' name = 'custom_ref_no' class = 'save_record autosuggestship' id="custom_ref_no" /></td>
    <td>Date</td>
    <td><input name = 'costom_date' type = 'text' class = 'save_record date_class autosuggestship' id="costom_date" /></td>
</tr>
<tr>
    <td>
        <p> Container Information </p>
    </td>
    <td>

And this the Checkbox to approve.

<tr>
    <td>Approve</td>
    <td><input type="checkbox" id="Approve" /></td>
    <td>&nbsp;</td>
    <td align="left">&nbsp;</td>
</tr>
4

3 回答 3

1

如何使用 jQuery 进行操作:

这不是万无一失的,因为浏览器总是可以决定不运行这个 js 片段,但仍然有用,因为它在提交表单(并等待服务器响应)之前通知用户,所以这主要是为了节省一些带宽,因为这可以防止对服务器的无用请求。

Useless requests表示此处的 HTTP 请求(表单提交)返回消息,要求用户勾选一个复选框,然后再次提交相同的数据。

$(document).ready(function() {

    // Catch submit events:
    $('form').submit(function() {
        // Check if checkbox is checked:
        if ($('#checkme').is(':checked')) {
            // Allow form submit:
            return true; 
        } else {
            // Prevent form submit:
            alert('You must check the Approve checkbox to continue!');
            return false;
        }
    });

});

请参阅如何使用 PHP标题<form>下的示例。

上面的客户端解决方案基于tomhallam的答案,将其修改为更小、更简单、更完整,并遵循更好的 jQuery 建议。

如何使用 PHP 做到这一点:

在服务器端做同样的检查总是好的,在这种情况下使用 PHP。无论客户端是否缺乏对 Javascript 或服务器定义的任何其他客户端检查方法的支持,服务器端检查都能保证真正检查值。

<?php
/* POST($key) returns value of $_POST($key) if set, 
 *  otherwise empty string is returned. */
function POST( $key ) {
    if ( isset( $_POST[$key] )) return $_POST[$key];
    else return '';
}

if ( isset( $_POST['checkme'] )) {
    // Checkme is checked, do something with form data:
    mySql_insert_formdata( $_POST );
    $_POST['error'] = 'Form processed, thanks for your data';
} elseif ( isset($_POST['submitted'])) {
    // Form submitted but checkme not checked, set error message
    $_POST['error'] = 'Checkme must be cheked first!';
}

echo POST('error');
?>

<form action="forms.php" method="post">
    <!-- Hidden field to check at server if form is submitted -->
    <input type="hidden" name="submitted" value="anything" />
    <!-- Some fields for user to fill, POST() inserts previous value if any -->
    <label for="email">eMail</label>
    <input type="email" id="email" name="email" value="<?php echo POST('email'); ?>" /><br/>
    <!-- Checkbox that must be checked -->
    <input type="checkbox" id="checkme" name="checkme" />
    <label for="checkme">Approve</label><br/>
    <!-- And submit button -->
    <input type="submit" value="Submit" />
</form>

结合客户端和服务器端解决方案:

Javascript(客户端)解决方案不能保证做任何事情,它取决于浏览器设置和 javascript 支持。
PHP(服务器端)解决方案保证可以正常工作,客户端/浏览器无法更改这一点。

但是,我认为同时拥有它们很好,因此只要支持 Javascript,客户端就会立即收到有关问题的通知,而不必等待服务器处理。
当用户没有 JS 支持时,他必须等待服务器检查表单并使用数据或返回"try again"错误。

于 2012-04-30T09:24:29.413 回答
1

使用 jQuery:尝试在<script></script>包含 jQuery 的标签中插入这个页面。

$(document).ready(function() {
    $('form input[type=submit]').on('click', function(e) {
      e.preventDefault();
      if($('#Approve').attr('checked') == 'checked') {
        $('form').submit();
      }
      else {
        alert('You must check the Approve checkbox to continue!');
      }
    });
    // if the user presses enter.
    $('form').on('keyup', function(e) {
      if(e.which == 13) {
       $('form').submit();
      }
    });
});

在 PHP 中(确保你给你的输入一个name="Approve"

if(isset($_POST['Approve']) {
  // they have ticked the checkbox.
}
于 2012-04-30T08:52:49.207 回答
0

使用表单 onsubmit 事件处理程序

<form onsubmit="return this.Approve.checked?true:alert('must approve!'),false">
<table>
<tr>
    <td>Approve</td>
    <td><input type="checkbox" id="Approve" /></td>
    <td>&nbsp;</td>
    <td align="left">&nbsp;</td>
</tr>
</table>
<input type="submit"/>
</form>

您可以使用函数代替内联代码,不要忘记保留内联“return myfunc()”,因为表单提交将取决于该返回,如果为 true,则提交表单,否则它只是等待。

于 2012-04-30T08:55:59.910 回答