examples/todos/public/scripts/app.js
function createTodoListItem(todo) {
    var checkbox = document.createElement('input');
    checkbox.className = 'toggle';
    checkbox.type = 'checkbox';
    checkbox.addEventListener('change', checkboxChanged.bind(this, todo));

    var label = document.createElement('label');
    label.appendChild( document.createTextNode(todo.title));
    label.addEventListener('dblclick', todoDblClicked.bind(this, todo));

    var deleteLink = document.createElement('button');
    deleteLink.className = 'destroy';
    deleteLink.addEventListener( 'click', deleteButtonPressed.bind(this, todo));

    var divDisplay = document.createElement('div');
    divDisplay.className = 'view';
    divDisplay.appendChild(checkbox);
    divDisplay.appendChild(label);
    divDisplay.appendChild(deleteLink);

    var inputEditTodo = document.createElement('input');
    inputEditTodo.id = 'input_' + todo._id;
    inputEditTodo.className = 'edit';
    inputEditTodo.value = todo.title;
    inputEditTodo.addEventListener('keypress', todoKeyPressed.bind(this, todo));
    inputEditTodo.addEventListener('blur', todoBlurred.bind(this, todo));

    var li = document.createElement('li');
    li.id = 'li_' + todo._id;
    li.appendChild(divDisplay);
    li.appendChild(inputEditTodo);

    if (todo.completed) {
      li.className += 'complete';
      checkbox.checked = true;
    }

    return li;
  }
function createTodoListItem(todo) {
    var checkbox = document.createElement('input');
    checkbox.className = 'toggle';
    checkbox.type = 'checkbox';
    checkbox.addEventListener('change', checkboxChanged.bind(this, todo));

    var label = document.createElement('label');
    label.appendChild( document.createTextNode(todo.title));
    label.addEventListener('dblclick', todoDblClicked.bind(this, todo));

    var deleteLink = document.createElement('button');
    deleteLink.className = 'destroy';
    deleteLink.addEventListener( 'click', deleteButtonPressed.bind(this, todo));

    var divDisplay = document.createElement('div');
    divDisplay.className = 'view';
    divDisplay.appendChild(checkbox);
    divDisplay.appendChild(label);
    divDisplay.appendChild(deleteLink);

    var inputEditTodo = document.createElement('input');
    inputEditTodo.id = 'input_' + todo._id;
    inputEditTodo.className = 'edit';
    inputEditTodo.value = todo.title;
    inputEditTodo.addEventListener('keypress', todoKeyPressed.bind(this, todo));
    inputEditTodo.addEventListener('blur', todoBlurred.bind(this, todo));

    var li = document.createElement('li');
    li.id = 'li_' + todo._id;
    li.appendChild(divDisplay);
    li.appendChild(inputEditTodo);

    if (todo.completed) {
      li.className += 'complete';
      checkbox.checked = true;
    }

    return li;
  }
function createTodoListItem ( todo ) { var checkbox = document . createElement ( 'input' ) ; checkbox . className = 'toggle' ; checkbox . type = 'checkbox' ; checkbox . addEventListener ( 'change' , checkboxChanged . bind ( this , todo ) ) ; var label = document . createElement ( 'label' ) ; label . appendChild ( document . createTextNode ( todo . title ) ) ; label . addEventListener ( 'dblclick' , todoDblClicked . bind ( this , todo ) ) ; var deleteLink = document . createElement ( 'button' ) ; deleteLink . className = 'destroy' ; deleteLink . addEventListener ( 'click' , deleteButtonPressed . bind ( this , todo ) ) ; var divDisplay = document . createElement ( 'div' ) ; divDisplay . className = 'view' ; divDisplay . appendChild ( checkbox ) ; divDisplay . appendChild ( label ) ; divDisplay . appendChild ( deleteLink ) ; var inputEditTodo = document . createElement ( 'input' ) ; inputEditTodo . id = 'input_' + todo . _id ; inputEditTodo . className = 'edit' ; inputEditTodo . value = todo . title ; inputEditTodo . addEventListener ( 'keypress' , todoKeyPressed . bind ( this , todo ) ) ; inputEditTodo . addEventListener ( 'blur' , todoBlurred . bind ( this , todo ) ) ; var li = document . createElement ( 'li' ) ; li . id = 'li_' + todo . _id ; li . appendChild ( divDisplay ) ; li . appendChild ( inputEditTodo ) ; if ( todo . completed ) { li . className += 'complete' ; checkbox . checked = true ; } return li ; }
Given an object representing a todo, this will create a list item to display it.
Given an object representing a todo this will create a list item to display it .