Question

我尝试通过在codeigniter上使用ajax提交表单进行验证，当我想插入数据但只有几个输入字段而输入字段我不使用时我试图隐藏，但attr需要仍在运行我隐藏的输入字段，如何解决这个问题。所以在隐藏时删除所需的输入字段。

浏览

<form id="fr" method="post" class="form-horizontal form-label-left">    
    <div class="form-group">        
        <label for="fullname">Section * :</label>
        <select name="section" class="form-control" required="required">
            <option value="">Select section</option>
            <option value="manager">Manager</option>
            <option value="head manager">Head Manager</option>
        </select>
        <span class="help-block"></span>    
    </div>  
    <div class="form-group">
        <label for="nama">Kitchen * :</label>
        <input type="text" name="name_kitchen"  class="form-control" required="required" />
        <span class="help-block"></span>
    </div>
    <div class="form-group">
        <label for="nama">Resto * :</label>
        <input type="text" name="name_resto"  class="form-control" required="required" />
        <span class="help-block"></span>
    </div>  

    <div class="form-group">
        <label for="fullname">&nbsp;</label><br>
        <button type="button" id="submit"  class="btn btn-primary"><i class="fa fa-save"></i> Simpan</button>
    </div>  
</form> 

<script>
    $("[name='section']").change(function(){
        var value=$(this).val();
        if(value == "manager"){
            $("[name='name_kitchen']").hide();
            $("[name='name_resto']").show();
        }else{
            $("[name='name_kitchen']").show();
            $("[name='name_resto']").hide();        
        }   
    });

    $("#submit").click(function() {
        $.ajax({
            type: "POST",
            url: base_url+"add",
            dataType: 'json',
            data: $('#fr').serialize(),
            success: function(data) {
                if(data.status) { 
                    $(".add-from-staff").toggle("slow");    
                    $("#fr").load(location.href + " #fr");
                    $('form#fr input[type="text"],texatrea, select').val('');                   
                }else {
                    for (var i = 0; i < data.inputerror.length; i++) 
                    {
                        $('[name="'+data.inputerror[i]+'"]').parent().parent().addClass('has-error');
                        $('[name="'+data.inputerror[i]+'"]').next().text(data.error_string[i]); 
                    }
                }
            },
            error: function (request, jqXHR, textStatus, errorThrown) { 
                 alert('Error');
                console.log(request.responseText);
            }       
        });     
    });     
</script>

控制器

public function add() {
    $this->_validate();
    $insert = $this->My_models->_add();
    echo json_encode(array("status" => TRUE));          
}   

function _validate() {
    $data = array();
    $data['error_string'] = array();
    $data['inputerror'] = array();
    $data['status'] = TRUE;

    if($this->input->post('name_kitchen') == '')
    {
        $data['inputerror'][] = 'name_kitchen';
        $data['error_string'][] = 'Kitchen is required';
        $data['status'] = FALSE;
    }


    if($this->input->post('name_resto') == '')
    {
        $data['inputerror'][] = 'name_resto';
        $data['error_string'][] = 'Resto is required';
        $data['status'] = FALSE;
    }

    if($data['status'] === FALSE)
    {
        echo json_encode($data);
        exit();
    }
}

那么当我选择隐藏已禁用所需的其中一个选项时，该怎么办？

Answer 1

在此示例中，我不会使用required属性。它造成了比它值得更多的头痛。相反，依赖于服务器端验证。

为了确定使用哪个“部分”，在我看来，将另一条信息传递给控制器将是解决问题的最简单方法。这可以通过许多不同的方式完成。添加另一个隐藏字段是一种选择。

<form>添加

内的某个地方

<input type="hidden" id="use-section" name="use_section" value="">

首次显示页面时，您显示“默认”部分并不清楚。如果有，那么将其用于上述字段中的“值”。

处理程序期间

 $("[name='section']").change(function(){ ...

设置“use_section”字段的值。

var value=$(this).val();
$("#use-section").val(value);

您可以在模型中评估控制器中的“use_section”，或者在您的情况下，我假设您正在捕获发布的数据。

if($this->input->post('use_section') === "manager")
{
    //get the fields you want
} 
else
{
     //get the other fields
}

我对_validate()有一个建议。而不是将exit()调用为短路add()返回值 - 如果有效则返回TRUE，如果不工作则返回$data。 _validate()的最后几行变为

if($data['status'] === FALSE)
{
    return $data;
}

return TRUE;

然后使用此add()方法

public function add()
{
    if(TRUE === ($status = $this->_validate()))
    {
        $insert = $this->My_models->_add();
        $status = array("status" => TRUE);              
    } 
    echo json_encode($status);
}

在CodeIgniter中使用exit或die是不合适的，因为它会缩短框架设计的执行流程。

Answer 2

当你隐藏任何div时，你可以使用jquery

获取元素并删除其必需属性

$("[name='name_kitchen']").removeAttr('required');

e.g:
$("#elementID").removeAttr('required');

在ajax中提交之前需要删除输入

2 个答案: