Tell me more ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 2 down vote favorite
1

please see the jsfiddle

I want output check-box for each array.

  1. how to create array?
  2. how to add check-box with unique name to array?

Whatever is in the textbox, Separate words and convert to check-box

jQuery:

$(document).ready(function () {
    $(".step1_btn").click(function () {
        var text = $(".source").text();
        text = text.replace(/\W+/g, ',');
        $('.splited').html(text);
    });
});

HTML:

<textarea class="source">Jusf to clarify, I will to have strings of varying</textarea>
<button type="button" class="step1_btn">Display Date</button>
<div id="demo" class="splited"></div>
share|improve this question
What's the error that you're getting? – taylorc93 Jul 19 at 13:58
1  
"how to create array?" - You haven't told us what data you want to put in the array. – nnnnnn Jul 19 at 13:58
@taylorc93 Not an error. I do not know how to write. – Sinac Jul 19 at 13:59
@nnnnnn Whatever is in the textarea. Separate word – Sinac Jul 19 at 14:02

closed as unclear what you're asking by Doorknob, Igor, darkajax, DSG, David Thomas Jul 20 at 0:25

Please clarify your specific problem or add additional details to highlight exactly what you need. As it's currently written, it’s hard to tell exactly what you're asking.If this question can be reworded to fit the rules in the help center, please edit the question.

4 Answers

up vote 2 down vote accepted

I believe you are trying to split the words in the textbox into separate checkboxes, this will do that:

$(".step1_btn").click(function () {

    var text = $(".source").text();
    var parts = text.split(" ");

    for (var i = 0; i < parts.length; i++) {
        var input = "<input type='checkbox' value='" + i + "'/>";
        var cbLabel = "<label>" + parts[i] + "</label>";
        $("#demo").append(input + cbLabel);
    }
});

Demo: http://jsfiddle.net/JWPZh/2/

share|improve this answer
up vote 1 down vote

You can try something like 

 $(".step1_btn").click(function () {

        var text = $(".source").text();

        text = text.replace(/\W+/g, ',');

        $('.splited').html(text);

        $.each(text.split(','), function (index, value) {
            // Check if it is already added
            if (!$("#" + value).length) {
               // Dont exist add new one
               $("#demo").append("<input id=" + value +  " type='checkbox' value='"+ value+"' />" + value );
            }
        });

    });
share|improve this answer
up vote 1 down vote

I interpretted your question as follows:

  1. Split the text in the textarea element using a single empty space as a delimiter.
  2. Use the resultant array to create input and respective label elements.

If this is the case, then the code below should satisfy your need.

$(document).ready(function () {
    $('.step1_btn').on('click', function () {
        var counter = 0,
            fragment = document.createDocumentFragment(),
            parts = $('.source').text().split(' '),
            length = parts.length,
            input,
            label;

        for (; counter < length; counter += 1) {
             label = document.createElement('label');
             label.innerHTML = parts[counter];
             label.setAttribute('for', parts[counter]);
             input = document.createElement('input');
             input.setAttribute('type', 'checkbox');
             input.setAttribute('name', parts[counter]);
             fragment.appendChild(label);
             fragment.appendChild(input);
        }
        $(document.getElementById('demo')).append(fragment);
    });
});

fiddle

share|improve this answer
up vote 0 down vote

Perhaps this is what you're after?

var source = $(".source").text()
var array = []
$.each( source.split(/\W+/g), function(i, v){
    array.push( $("<input type=checkbox id='"+v+"' value='"+v+"'/>") )
})

array will contain an <input> element for each word in the source string

share|improve this answer

Not the answer you're looking for? Browse other questions tagged or ask your own question.