从验证重新加载页面后，带有 Select2 的 Laravel 输入值不会持续存在

Posted 2023-03-14

【中文标题】从验证重新加载页面后，带有 Select2 的 Laravel 输入值不会持续存在

【英文标题】：Laravel input value with Select2 not persisting after page reload from validation

【发布时间】：2016-04-14 08:26:53

【问题描述】：

我有一个这样的选择表单输入：

<div class="form-group col-md-3 @if($errors->first('contas.0.banco')) has-error @endif">
    !! Form::label('contas[0][banco]', 'Nome do Banco') !!
     Form::select('contas[0][banco]', [] , null , ['class' => 'form-control select-banco']) 
    <small class="text-danger"> $errors->first('contas.0.banco') </small>
</div>

值是空的，因为我正在使用 Select2 插件加载 javascript：

var arrayBancos = [
     id: 'HSBC', codigo: '399', text: 'HSBC Bank Brasil', site: 'www.hsbc.com.br', mime: '.png' ,
     id: 'Santander', codigo: '033', text: 'Banco Santander', site: 'www.santander.com.br', mime: '.png' ,
     id: 'Citibank', codigo: '745', text: 'Banco Citibank', site: 'www.citibank.com.br', mime: '.jpg' 
];

$.fn.select2.amd.require(['select2/compat/matcher'], function (oldMatcher) 
    selectElement.select2(
        data: arrayBancos,
        language: 'pt-BR',
        matcher: oldMatcher(matchStart),
        escapeMarkup: function (markup)  return markup; , // let our custom formatter work
        templateResult: formatSelecaoBanco,
        templateSelection: formatBanco,
        dropdownCss:  'min-width': '350px' 
    );
);

如您所见，插件中添加了一些自定义项（最重要的一项，搜索在 arrayBancos.id、arrayBancos.codigo 和 arrayBancos.text 中查找匹配项），因此我在选择输入中填充了Javascript 让事情变得更简单。

一切正常，除了一件事：当页面来自验证并检测到无效输入时，该字段的值不保持（所有其他都可以）。可能是因为select里面还没有option的值，所以不能设置，只有当jQuery加载完成，插件初始化的时候才会有option。

那么...有什么想法可以解决这个问题吗？也许在 html 上设置 <options> 并使用 data-* 属性转换为类似于上面的数组？

【参考方案1】：

在您在下拉菜单中设置选项后，在页面加载时，您应该像这样设置它的值：

$(".select-banco").select2("val", "HSBC");