CODEWITHSUNDEEP
javascriptjqueryhtmlmeteor
Jerome
Jerome

Reputation: 1192

How to use .prev with a Meteor event?

Yesterady I asked how I could remove the input before my button How to remove the input element before my button? and I got an answer who worked in the snippet. Now I try to use it in my event but I can't remove the field, I can only remove the button.

Template.myTemplate.events({
'click .removeField': function(event, template){
    $(this).prev('input').remove();
    $(event.target).prev('input').remove();
    $(event.target).prev().prev('input').remove();
    $(event.target).remove();
  }

the $(event.target) is i.fa.fa-times so I tried with prev().prev('input') to be in a -> input

My HTML is the following one:

<div class="form-style-2">
 <div class="form-style-2-heading"></div>
 <form action="" method="post">
 <label>
  <span>Container name
  <span class="required">*</span>
  </span>
  <input type="text" class="input-field nameModif" value="" required/>
 </label>
 <label id="labelEnv">
  <span>Environment
  </span>
  <input type="text" class="input-field env"/><a class="removeField" aria-expanded="false"><i class="fa fa-times"></i></a>
  <a class="addEnv" aria-expanded="false"><i class="fa fa-plus"></i></a>
 </label>
</form>
</div>

Upvotes: 0

Views: 27

Answers (1)

Kosh
Kosh

Reputation: 18393

In some cases $(event.target) will be <i class="fa fa-times"> and it has no previous input. Let's get up to parent <label> then remove children within it:

$(event.target).closest('label').children('input, .removeField').remove();

Update if you have several inputs and you need to remove the input just before a:

var et = $(event.target);
if (et.is('i')) et = et.parent('a');
et.prev('input').remove().end().remove();

Upvotes: 2

Related Questions