How do I remove all tags in an input field below with jQuery?

Question

How do I remove all tags in an input field below with jQuery?

<input class="form-control" id="videotags" data-role="tagsinput"  placeholder="Video Tags" type="text">

  //what I tried:
<script>$("#videotags").remove();</script>

Chuckhole

Do you want to clear input value or you want to remove input element from the dom ? – Admissive

Answer 1

If you are using Bootstrap tagsinput try this:

$("#videotags").tagsinput('removeAll');

source

Bulwark

Answer 2

This work for me:

$('#videotags').tagsinput('removeAll');

Reverence

Answer 3

Try this

$('#videotags').click(function() {
    var input = $(this);

    input.val('');
});

https://jsfiddle.net/joe_hart/7xrg242b/

Pointless

Answer 4

$("#videotags").replaceWith(function () {
return $('<' + this.nodeName +                   '>').append($(this).contents());
});

Aerify

Answer 5

Are the targets of removing not tags but attributes? The input tag in your question does not include tags.

If you want to remove all attributes in the input tags, I think you can use the method introduced in the below question.

Remove all attributes

Viceregent

Answer 6

bootstrap-tags.js do not provide to delete All tags at once. I have tried some workarounds for this. First I have fetch all the tags. Below is the code for that.

var tagData = $("#small").tags().tagData;
if (tagData.length > 0)
{
    $.each( tagData, function( index, value ){
      for(var tItem=0 ; tItem < tagData.length;)
      {
        $("#small").tags().removeTag(tagData[tItem]);
      }
     });
}

I have used 2 loops here as once you delete one record it will be reindex to 0.

Puzzle