Video Tutorial: Making A Simple To Do Application-- A Question?

Rachel_L_ · ‎01-18-2016

I'm currently working through the video tutorial "Making a Simple Application Using Framework 7 in AppDesigner".

https://software.intel.com/en-us/videos/making-a-simple-to-do-application-using-framework-7-in-app-designer

My problem is that I'm not getting the result that is in the video. The input to the alert box isn't showing on the screen. I'm using XDK 2807. I have checked that the modal is properly attached to the "new" button. The alert box runs, but the "to do" item isn't added to the list.

I have looked for the source code files for this video, but there doesn't seem to be any. So, I tried to recreate the javascript by reading the tiny, less than legible screen text in the video. I am not a javascript jockey. Can anyone help me to see what is wrong with code belowt? TIA -Rachel

/*jshint browser:true */
/*global $ */

(function()
{
 "use strict";
    
 /*
   hook up event handlers 
 */
    

function register_event_handlers()
 {
    
    
     /* button  New */
    $(document).on("click", ".uib_w_7", function(evt)
    {
        /* Modals are created using custom js 
         For examples and documentation visit http://www.idangero.us/framework7/docs/modal.html */

        /*The code in the newItem function places the user input into the list*/
        function newItem(value){
            var newSwipe ='<li class="swipeout">'+
                '<div class = swipeout-content item-content">' +
                '<div class= "item-inner">' + value + '</div>' +
                '</div>' +
                '<div class="swipeout-actions-right">' +
                '<a class= "swipeout-delete swipeout-overswipe">Delete</a>' +
                '</div>' +
                '</li>';
            $$('.sortable ul').append(newSwipe);
            
        }
        myApp.prompt("What's to do?","Enter to Do item.",newItem );
        
    });
 }
 document.addEventListener("app.Ready", register_event_handlers, false);
})();

Rachel_L_ · ‎01-18-2016

For others who might have similar difficulty following this video, I have figured out the solution to my issue. In order to see the video in larger font on my 13 inch monitor, I used the zoom accessibility too. My simple issue was that I didn't add the "newItem" variable to the prompt. I've corrected the above code snip so that all you need to do is copy and paste it into your app. Hope this helps someone else from hours of extra struggle. -Rachel

myApp.prompt("What's to do?","Enter to Do item.",newItem );