1
I have a registration screen that has a tag field.. As it fills and presses enter, it looks like this:
Let’s assume he registered, but forgot to enter a tag, for example: 
This tag will be lost, when he clicks edit this registration will have only A, B and C.
How could I check this? When it clicks register, see if all the elements are inside: $('.chips').material_chip('data')); if one has not, insert.
3
You can do it this way:
// evento submit do formulário
$("form").on("submit", function(){
// pega o valor do que foi digitado e não foi incluído no chip
var chipp = $(".chips input").val().trim();
// se não for null
if(chipp){
// adiciona o chip ao array
var obj = {};
obj["tag"] = chipp;
$('.chips').material_chip('data').push(obj);
// renderiza todos os chips
// se você só precisa da array, talvez o código abaixo não seja necessário
$('.chips').material_chip({
data: $('.chips').material_chip('data')
});
}
});
Example without submitting the display form:
$("form").on("submit", function(e){
e.preventDefault();
var chipp = $(".chips input").val().trim();
if(chipp){
var obj = {};
obj["tag"] = chipp;
$('.chips').material_chip('data').push(obj);
$('.chips').material_chip({
data: $('.chips').material_chip('data')
});
console.log($('.chips').material_chip('data'));
}
});
$('.chips').material_chip('data');
$('.chips').material_chip();<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/js/materialize.min.js"></script>
<form method="post" action="teste2.php">
<div class="chips">
<input name="tags" class="custom-class" placeholder="Digite as tags">
</div>
<button>OK</button>
</form>Excellent answer Sam, in this Materialize has to be done all on the outside, because by default it is very poorly implemented. For example, I think I should go storing the date with space instead of enter, if one gives space and keeps typing it records as a single string, tbm if the tags break the size of the input, do not record more on the date.
Browser other questions tagged javascript html jquery materialize
You are not signed in. Login or sign up in order to post.
I think there is no possibility for this, because how are you going to insert something that you don’t have? These chips work precisely with the enter key to be registered in date, if the person typed something in the input and forgot to press enter is as if that input is empty.
– LeAndrade
@Leandrade could not do onBlur to "enter"?
– hugocsl
@hugocsl Cara for the brief read in the documentation (because it is very little) the default event is enter itself, and I have not seen methods to change this. I think even creating a function with Blur the chips will wait the enter to save in date.
– LeAndrade
Putz... I’ll dig deeper and see if I can find something.
– dds