Usando o plug- in TokenInput e usando a validação de formController integrada do AngularJS.
No momento, estou tentando verificar se o campo contém texto e, em seguida, definir o campo para válido se contiver. O problema de usar o plug-in é que ele cria sua própria entrada e, em seguida, um ul + li para configurar.
Tenho acesso a addItem (formname) e meus recursos no controlador, só preciso configurá-lo como $ valid.
Markup.
<form class="form-horizontal add-inventory-item" name="addItem">
<input id="capabilities" name="capabilities" token-input data-ng-model="inventoryCapabilitiesAutoComplete" data-on-add="addCapability()" data-on-delete="removeCapability()" required>
<div class="required" data-ng-show="addItem.capabilities.$error.required" title="Please enter capability."></div>
</form>
JS.
$scope.capabilityValidation = function (capability) {
if (capability.name !== "") {
addItem.capabilities.$valid = true;
addItem.capabilities.$error.required = false;
} else {
addItem.capabilities.$valid = false;
addItem.capabilities.$error.required = true;
}
};
Estou executando a função capacityValidation quando TokenInput tem algo inserido e passando no objeto.
EDITAR:
Descobri que o ng-model em minha entrada faz coisas e obtém os resultados do preenchimento automático, e é por isso que não consigo fazer o ng-valid funcionar, pois ele é baseado no modelo.
$scope.inventoryCapabilitiesAutoComplete = {
options: {
tokenLimit: null
},
source: urlHelper.getAutoComplete('capability')
};
Eu não escrevi esta implementação de preenchimento automático. Existe outra maneira de fazer isso onde eu teria acesso ao atributo ng-model e movesse a função do modelo para outro lugar?
fonte
<div ... data-ng-show="capabilities_error" ...>
Em outras palavras, há uma razão para você querer / precisar usar FormController?addItem.capabilities.$valid = true
e / ou definir addItem.capabilities. $ Error.required como true ou false, conforme apropriado?Respostas:
Você não pode alterar diretamente a validade de um formulário. Se todas as entradas descendentes forem válidas, o formulário é válido; se não, não é.
O que você deve fazer é definir a validade do elemento de entrada. Igual a;
Agora a entrada (e portanto o formulário) é inválida. Você também pode ver qual erro causa a invalidação.
fonte
capabilities
for uma variável? Eu tenho uma matriz que contém nomes de entrada e quero fazer um loop dentro da matriz e defini-los inválidos um por um: /name
atributo do formulário e o atributo de entradaid
. Isso é diferente dos valores definidos porngModel
$scope.addItem['myVariableName'].$setValidity("youAreFat", false);
$scope.addItem.capabilities.$setValidity("youAreFat", false);
As respostas acima não me ajudaram a resolver meu problema. Após uma longa pesquisa, encontrei esta solução parcial .
Finalmente resolvi meu problema com este código para definir o campo de entrada manualmente como ng-invalid (para definir como ng-valid, defina-o como 'true'):
fonte
$setValidity
comtrue
como o segundo parâmetro sempre que a entrada for válida.Me deparei com este post com um problema semelhante. Minha correção foi adicionar um campo oculto para manter meu estado inválido para mim.
No meu caso, tive um bool anulável em que uma pessoa teve que selecionar um dos dois botões diferentes. se a resposta for sim, uma entidade é adicionada à coleção e o estado do botão muda. Até que todas as questões sejam respondidas (um dos botões em cada um dos pares tem um clique) o formulário não é válido.
fonte
É muito simples. Por exemplo: em seu controlador JS use isto:
ou
ou
ou
Tudo funciona para mim para requisitos diferentes. Informe-se se isso resolver seu problema.
fonte