Emmet wrap with abbreviation

Question

I'm trying to make a checklist in a more time saving way. I have to do this thing underneath for every page like 17 times. So to save some time I was hoping for Emmet to be te solution. Important to say, I want to select the three names and do everything at once. I work with Coda 2. What's the abbreviation to produce the following code after selecting the lines below:

Video
DVD
CD

To produce:

<div class="form-group">
   <div class="col-sm-12">
     <div class="checkbox">
        <label>
          <input type="checkbox" name="item1" value="Done" /> Video
        </label>
      </div>
    </div>
</div> <!-- form-group -->
<div class="form-group">
   <div class="col-sm-12">
     <div class="checkbox">
        <label>
          <input type="checkbox" name="item2" value="Done" /> DVD
        </label>
      </div>
    </div>
</div> <!-- form-group -->
<div class="form-group">
   <div class="col-sm-12">
     <div class="checkbox">
        <label>
          <input type="checkbox" name="item3" value="Done" /> CD
        </label>
      </div>
    </div>
</div> <!-- form-group -->

And why doesn't this work: (div[class=form-group]>.[class=col-sm-12]>.[class=checkbox]>label[for=list$]>input[type=checkbox name=item$ value=Gedaan id=list$])*

When I try this I get:

<div class="form-group">
    <div class="col-sm-12">
        <div class="checkbox"><label for=""><input type="checkbox" name="item1" value="done"></label></div>
    </div>
</div>
<div class="form-group">
    <div class="col-sm-12">
        <div class="checkbox"><label for=""><input type="checkbox" name="item2" value="done"></label></div>
    </div>
</div>
<div class="form-group">
    <div class="col-sm-12">
        <div class="checkbox"><label for=""><input type="checkbox" name="item3" value="done">Video
                    DVD
                    CD</label></div>
    </div>
</div>

Okay I came A little bit further.

Now it works with multiple lines. But de Video, CD, DVD stay with the last form-group.

I used this one again: (div[class=form-group]>.[class=col-sm-12]>.[class=checkbox]>label[for=list$]>input[type=checkbox name=item$ value=Gedaan id=list$])*

My result:

<div class="form-group">
    <div class="col-sm-12">
        <div class="checkbox">
            <label for="list1">
                <input type="checkbox" name="item1" value="Gedaan" id="list1"/>
            </label>
        </div>
    </div>
</div>
<div class="form-group">
    <div class="col-sm-12">
        <div class="checkbox">
            <label for="list2">
                <input type="checkbox" name="item2" value="Gedaan" id="list2"/>
            </label>
        </div>
    </div>
</div>
<div class="form-group">
    <div class="col-sm-12">
        <div class="checkbox">
            <label for="list3">
                <input type="checkbox" name="item3" value="Gedaan" id="list3"/>Video
                    DVD
                    CD
            </label>
        </div>
    </div>
</div>

Hello! Please, edit the question to add the "why doesn't this work" part there. — Valentino

amedina amedina · Accepted Answer · 2019-02-28T09:28:41

This worked for me:

(.form-group>.col-sm-12>.checkbox>label>input[type=checkbox][name="item$"][value="done"])*

And the generated HTML:

<div class="form-group">
    <div class="col-sm-12">
        <div class="checkbox">
            <label for="">
                <input type="checkbox" name="item1" value="done">Video
            </label>
        </div>
    </div>
</div>
<div class="form-group">
    <div class="col-sm-12">
        <div class="checkbox">
            <label for="">
                <input type="checkbox" name="item2" value="done">CD
            </label>
        </div>
    </div>
</div>
<div class="form-group">
    <div class="col-sm-12">
        <div class="checkbox">
            <label for="">
                <input type="checkbox" name="item3" value="done">DVD
            </label>
        </div>
    </div>
</div>

I tried yours and it works too, except for the part value=Gedaan:

Emmet wrap with abbreviation

2 Answers