2

I am trying to get the data using the Materilize css's chips. But no data is received when I try to submit it using a form. I checked that the input fields value was null once I added the chips.

I wrote a jquery code to verify this

$('#showvalues').on('click', function(){
    alert($('#emotiontags').val())   
})

and my chips code looks like 

<div class="chips chips-autocomplete col s4 offset-s3">
    <input placeholder="You Emotions" id="emotiontags" type="text" 
    name="emotiontags">
</div>

<button class="btn waves-effect waves-light" id="showvalues">
   Show values
   <i class="material-icons right">send</i>
</button>

Here is its out with normal text enter image description here

and here is the output when I try to add chipsenter image description here

Shahrukh Mohammad
  • 985
  • 2
  • 17
  • 33

1 Answers1

3

Well it has been 6 months but I wanted to give an answer for people encountering this question. According to the documentation of MaterializeCSS, chipsData is the property that stores an array of the current chips data.

After getting the instance of your chips elements by something like this;

var chipInstance = M.Chips.getInstance($(".chips"));

Chips array can be accessed and logged to the console via

console.log(chipInstance.chipsData);
Eralp Sahin
  • 299
  • 4
  • 13