0

I am trying to figure out why appended form elements are not being notice by kendo mobile --- i have tried 10 different fixes but those items just dont get noticed:

This is in the view:

<li>
                            <div id="currentMovements">
                                <ul id="curMoves" data-role="listview" ></ul>
                            </div>

                            Add Movements:
                            <div id="routineMovements"></div>

                        </li>

And this is my script:

<script>

        //init move count
        var move_count = 0;

        function onSelect(e) {

            console.log("Selected: " + this.text(e.node));

            //add li to movements div
            //make each field unique by li 
            //using move_count
            $("#currentMovements ul").append('<li><input type="text" name="moves[' + move_count + ']" data-min="true" id="moves[' + move_count + ']" class="k-input small-move" value="' + this.text(e.node) + '" /><input type="text" name="id[' + move_count + ']" data-min="true" id="sets[' + move_count + ']" class="k-input small-nums" value="3" /> sets of <input type="text" name="reps[' + move_count + ']" data-min="true" id="reps[' + move_count + ']"  class="k-input small-nums" value="10" /><span class="clearitem">Delete</span></li>');

            //increase move count
            move_count++;

                ///test to see if the field is being noticed
                moves = $('#moves[0]').val();   
                console.log(moves);
        }


        function populateRoutineForm() {

            $('#curMoves .clearitem').live('click', function() {
                $(this).parent().remove();
            });

            var routineMovementsData = new kendo.data.HierarchicalDataSource({
                data: [
                    {
                        text: "Chest", items: [
                            { text: "Inclined Bench" },
                            { text: "Decline Bench" },
                            { text: "Dumbell Presses" }
                        ]
                    },{
                        text: "Tricep", items: [
                            { text: "Cable Pulldowns" },
                            { text: "Skull Crushers" },
                            { text: "Close Grip Benchpress" }
                        ]
                    }
                ]
            });

            //todo can we use the MVVM stuf from above to do this now?
            $("#routineMovements").kendoTreeView({
                dataSource: routineMovementsData,
                select: onSelect
            });

        }

        function sendAddRoutine() {

            var userID = window.localStorage.getItem("userID"); 

            var routine_title = $('#routine_title').val();
            var routine_share = $('#routine_share').val();

                ///test to see if the field is being noticed
                moves = $('#moves[0]').val();   
                console.log(moves);


            $.ajax({
                url: endpoint + "app/api/add_routine.php",
                dataType: "jsonp",
                type: "GET",
                data: { userID: userID, routine_title: routine_title, routine_share: routine_share },

                success: function (data) {
                    $('#routineResult').html(data.results);

                    //app.navigate("#view-routineFeed");

                }
            });
        }

        $('#routineDoneButton').click(function () {

            sendAddRoutine();
        });

    </script>

Im wondering if there some way to re-init the view without losing other fields that appear above the append div?

4

0 回答 0