mardi 3 avril 2018

How to call the listitem function of the fntaskUI expression within the fntaskController expression

I am Creating a tasklist project.In the code given below fntaskController function takes in date,time,inputvalues and the fntaskUI function render them with the given data.but i Cannot call the listitem function of fntaskUI within fntaskController when a click event is triggered.

let fntaskController = (function (taskEvent) 

                             //Get task added date
                             let _taskAddedDate = new Date();
                             let _taskAddedDay = _taskAddedDate.getUTCDay() + 1;
                             let _taskAddedMonth = _taskAddedDate.getUTCMonth() + 1;
                             let _taskAddedYear = _taskAddedDate.getUTCFullYear();

                             //Get task added time 
                             let _taskHour = _taskAddedDate.getUTCHours();
                             let _taskMinute = _taskAddedDate.getUTCMinutes();
                             let _taskSecond = _taskAddedDate.getUTCSeconds();

                             //setupeventlistner
                             let eventListnerInit = function () {
                                 //Add Btn click 
                                 document.querySelector(taskEvent.dom.addEvent).addEventListener('click', getitems);
                                 document.querySelector(taskEvent.dom.deleteEvent).addEventListener('click', deleteItems);
                             }

                             let getitems = function (e) {
                                 var _task_items = taskEvent.getValue();
                                 listitems();
                                 return {
                                     taskData: _task_items,
                                     taskHour: _taskHour,
                                     taskMinute: _taskMinute,
                                     taskSecond: _taskSecond
                                 }
                             }

                             let deleteItems = function () {
                                 //delete list items   
                             }

                             return {
                                 taskGetItems: getitems(),
                                 init: function () {
                                     //Event Listner Initilization
                                     eventListnerInit();
                                 }
                             }

                         })(fninputevnt);

Here fntaskUI function should render a new element with data from the fntaskController function defined above.But cannot make the function to execute within the fntaskController.

let fntaskUI = (function (UI, inputdata) {
     // Task UI Controller
     let listItem = function () {
         let taskContainer = document.createElement('a');
         taskContainer.className = 'list-group-item';
         taskContainer.href = '#';
         taskContainer.innerHTML = `<div class="row">
        <div class="col-sm-4 col-xs-12">
          <i class="fas fa-2x fa-user pull-left"></i>
          <h4 class="list-group-item-heading">${UI.taskGetItems.taskData}</h4>
          <p class="list-group-item-text">Tokyo, Japan</p>
        </div>
        <div class="col-sm-4 col-xs-12">
            <i class="fas fa-2x fa-calendar-alt pull-left"></i>
          <p class="list-group-item-text">${UI.taskGetItems.taskHour}:${UI.taskGetItems.taskMinute}:${UI.taskGetItems.taskSecond}</p>
        </div>
        <div class="col-sm-4 col-xs-12">
          <button class="btn btn-primary pull-right btn-delete">
            <i class="fas fa-times no-margin icon-color"></i>
          </button>
        </div>
      </div>`
         document.querySelector(inputdata.dom.appendList).appendChild(taskContainer);
     }

     return {
         listItem: function () {
             listItem();
         }
     }

 })(fntaskController, fninputevnt);




Aucun commentaire:

Enregistrer un commentaire