Question

I am trying to build a tags input which act like delicious tags , i managed to send the value of a text to the text input field , but can’t append more than one tags . How i can make it submit more than one tag with separator ” , ” ..

        <label for="tags">Tags</label>
    <input type="text" name="tags" id="tags"  />


    <p>
        <a class="but">tag 1</a>
        <a class="but">tag 2</a>
        <a class="but">tag 3</a>
        <a class="but">tag 4</a>
        <a class="but">tag 5</a>
        <a class="but">tag 6</a>
        <a class="but">tag 7</a>
        <a class="but">tag 8</a>
    </p>
   <script>
    $(".but").click(function () {
      var text = $(this).text();
      $("#tags").val(text);
    });
   </script>

Answer 1

This will keep the current value of the #tags input (if there is one) and append the new tag separating each tag with ,

$(".but").click(function () {
    var text = $(this).text();
    var input = $("#tags");
    var curtext = input.val();
    input.val( (curtext ? curtext + ", " : "") + text);
    $(this).hide(); // Hide the tag link
});

Example: http://jsfiddle.net/petersendidit/ZFYC5/