在 laravel 的 ajax 中验证失败时保留旧的选择值

Posted

技术标签:

【中文标题】在 laravel 的 ajax 中验证失败时保留旧的选择值【英文标题】:keep old select value while validation failed in ajax in laravel 【发布时间】:2020-07-16 17:45:18 【问题描述】:

在我的 Laravel 项目中,我有一个预约表格,患者可以在从下拉列表中选择一个分支后选择医生。我使用 AJAX 来完成这些功能。

现在在任何验证失败后,所有恢复的表单值都接受医生。

但我想在验证失败后自动恢复选择的医生。

html 表单

<select class="form-control appointment_form_searchField"  id="appointment_branch" name="appointment_branch" style="font-size:.7em;;width: 100%;">
    <option value="">Select Branch</option>

    @if($_SESSION['branch'] != null)

      @foreach($_SESSION['branch'] as $data)    
        <option value=" $data->id "> $data->name </option>
      @endforeach

   @endif                              
</select>

<select class="form-control" id="appointment_doctor" name="appointment_doctor" style="font-size:.7em;padding: 0.6500rem .75rem;width: 100%;">
    <option value="">Select Doctor</option>
</select>

AJAX

jQuery(".appointment_form_searchField").change(function()         
    var branch_id = $("#appointment_branch").val();   
    var token = $('input[name=_token]').val();
    if(branch_id.trim() != '')
                    
        jQuery.ajax(    
          url:" url('/filter_doctor') ",
          type: 'GET',
          data: _token :token, branch_id : branch_id,
          success:function(msg)    
            $('#appointment_doctor option').remove();
            trhtml = '';
            trHTML += "<option value=''>Select Doctor</option>";
            msg.forEach(function(item)    
              trHTML += "<option value='"+item.id+"'>" + inputem.name + "</option>";
            );    
                $('#appointment_doctor').append(trHTML);
            
        );
                  
);

控制器

public function filter_doctor(Request $request)

    $branch_id = $request->branch_id;

    $query =  DB::table('service_doctors');
    $query->select('doctor_id','inactive_dates_in_this_month');

    if($branch_id != '0')
        $query->where('branch_id','=', $branch_id);

    $result_time = $query->get();
    $array_doctor_id = $result_time->pluck('doctor_id');
    $doctor = Doctor::whereIn('id', $array_doctor_id)->get();
    return $doctor;

有人帮忙吗?提前致谢

【问题讨论】:

您能否提供url('/filter_doctor') 的控制器文件的详细信息,以便我们查看。 该代码有几个缺陷。首先,假设您收到 JSON 响应,但未在请求中设置 json dataType,您正在迭代 msg 属性。因此,该 msg 解析可能会失败。 然后看起来你正在删除所有 甚至在检查ajax是否失败之前,假设你正在接收json。 如果 JSON 是您收到的响应,您应该返回某种状态标志来确定响应是否成功。在状态字段中显示“ok”或“error”。 @Deepak...我已经用controller更新了我的代码 【参考方案1】:

如果你使用的是 Laravel 5,那么你可以这样做。

在您的表单中添加缺少的详细信息约会分支和约会医生,如下所示。

Request::old() 选项加载以前发布的值,因此您需要首先为 appointment_branch'. Also temporary storeold 约会医生value indata-oldid 选择旧值,以便脚本可以识别哪个是用户提交的旧值,并且可以文档准备好后加载此选择框。

<select class="form-control appointment_form_searchField"  id="appointment_branch" name="appointment_branch" style="font-size:.7em;;width: 100%;">
    <option value="">Select Branch</option>

    @if($_SESSION['branch'] != null)

      @foreach($_SESSION['branch'] as $data)    
        <option value=" $data->id "  Request::old()?(Request::old('appointment_branch')==$data->id?'selected="selected"':''):'' > $data->name </option>
      @endforeach

   @endif                              
</select>

<select class="form-control" id="appointment_doctor" name="appointment_doctor" style="font-size:.7em;padding: 0.6500rem .75rem;width: 100%;"   data-oldid=" Request::old()?Request::old('appointment_doctor'):'' ">
    <option value="">Select Doctor</option>
</select>

然后像下面这样编写你的脚本。

<script>
    jQuery(document).ready(function($)
        if(jQuery("#appointment_doctor").data('oldid')!='' && typeof(jQuery("#appointment_doctor").data('oldid'))!="undefined")
            jQuery(".appointment_form_searchField").change();
        
    );



    jQuery(".appointment_form_searchField").change(function()         
        var branch_id = $("#appointment_branch").val();   
        var token = $('input[name=_token]').val();

        if(branch_id.trim() != '')
                        
            jQuery.ajax(    
              url:" url('/filter_doctor') ",
              type: 'GET',
              data: _token :token, branch_id : branch_id,
              success:function(msg)    
                $('#appointment_doctor option').remove();
                trHTML = '';
                trHTML += "<option value=''>Select Doctor</option>";
                msg.forEach(function(item)    
                  trHTML += "<option value='"+item.id+"'>" + inputem.name + "</option>";
                );    
                    $('#appointment_doctor').append(trHTML);
                
                if(jQuery("#appointment_doctor").data('oldid')!='' && typeof(jQuery("#appointment_doctor").data('oldid'))!="undefined")
                    jQuery('#appointment_doctor').val(jQuery("#appointment_doctor").data('oldid')); //select the old doctor id here
                
            );
                      
    );

</script>

【讨论】:

以上是关于在 laravel 的 ajax 中验证失败时保留旧的选择值的主要内容,如果未能解决你的问题,请参考以下文章

验证失败后的 Laravel 复选框状态

Laravel/Ajax:刷新表格将新数据堆叠在底部(旧数据保留)

验证后的Laravel Select2旧输入

Laravel 请求在验证失败时不返回修改后的请求

使用 Laravel 和 Passport 在身份验证失败时响应状态码 401?

当通过Ajax进行POST时,Laravel 5.6 CSRF令牌失败