3
Contributors
3
Replies
23
Views
2 Years
Discussion Span
Last Post by diafol
-1

I was able to enter stuff when viewed in my mobile.

Votes + Comments
not on web browser try to enter anything and 2nd textrea after click add more button
0

Problem is when you are cloning ckeditor TR , so textarea with same id OR name created in dom. so second editor after click on add more will not come in editor mode. if try to input some text via editor tool . it will always inject to first cke editor instance. i tried some thing below it will work for you. I think not good approch but it will work.

<html>
    <head>
        <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
        <script src="http://cdn.ckeditor.com/4.5.4/standard/ckeditor.js"></script>
    </head>
    <body>
        <div class="row hide_mail_id_domain">
            <div class="col-sm-12">
                <table class="table">
                    <thead>
                        <tr>
                            <th>Option</th>
                            <th>Action</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>
                                <textarea class="ckeditor" required="" name="question_option_1" ></textarea>
                            </td>
                            <td></td>
                        </tr>

                    </tbody>
                </table>
                <a href="javascript:void(0)" class="btn btn-success add_more right" style="float: right;">Add More</a>
            </div>
        </div>
        <script>

            var REMOVE = '';
            var i=1;
            $(document).ready(function () {
                $('.add_more').click(function () {
                    var oneplus=i+1;
                    var tr_object = $('tbody').find('tr:first').clone();
                    // getting and renaming existing textarea by name.
                    $(tr_object).find('textarea[name="question_option_1"]').attr("name", "question_option_"+oneplus+"");
                    $(tr_object).find('input').val('');
                    $(tr_object).find('td:last').html('<a href="javascript:void(0)" class="btn btn-danger remove_more">Remove</a>');
                    $('tbody').append(tr_object);
                    //replace code
                    CKEDITOR.replace("question_option_"+oneplus+"");
                    // when i were clicking on add more during my testing , then extra cke-editor id also appending to DOM. so for removing other then first
                    // included below code
                    $('#cke_question_option_1').each(function() {
                        var $ids = $('[id=' + this.id + ']');
                        if ($ids.length > 1) {
                            $ids.not(':first').remove();
                        }
                    });
                    i=i+1;
                    oneplus++;
                });
                $(document).on('click', '.remove_more', function () {
                    var id = $(this).closest('tr').find('.id').val();
                    if (id != '') {
                        if (REMOVE != '') {
                            REMOVE = REMOVE + ',' + id;
                        } else {
                            REMOVE = id;
                        }
                        $('#id').val(REMOVE);
                    }
                    $(this).closest('tr').remove();
                });
            });

        </script>
    </body>
</html>

Edited by mangel.murti: spell mistake

0

THanks for the negative rep PP. If you gave more info, perhaps you'd have the answer you were fishing for.

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.