0

I am working on a simple project which is turning out to be difficult for some reason. First let me show you the result I am getting as of now; it's just this:

Leicester City vs Manchester United - 9/21 14:30

Now, I want to have the date and time on a separate line, however, every way I tried has failed me including \n,
, document.createElement("br") and some unicode characters. I've really hit a brick wall this time. Any help is welcomed.

p.s.: I am only into my 3rd month of programming

This is my code:

function listEvents(feedRoot) {
  var entries = feedRoot.feed.getEntries();
  var eventDiv = document.getElementById('events');
  if (eventDiv.childNodes.length > 0) {
    eventDiv.removeChild(eventDiv.childNodes[0]);
  }   
  var ul = document.createElement('p');
  var len = entries.length;
  for (var i = 0; i < len; i++) {
    var entry = entries[i];
    var title = entry.getTitle().getText();
    var startDateTime = null;
    var startJSDate = null;
    var times = entry.getTimes();
    if (times.length > 0) {
      startDateTime = times[0].getStartTime();
      startJSDate = startDateTime.getDate();
    }
    var entryLinkHref = null;
    if (entry.getHtmlLink() != null) {
      entryLinkHref = entry.getHtmlLink().getHref();
    }
    var dateString = (startJSDate.getMonth() + 1) + "/" + startJSDate.getDate();
    if (!startDateTime.isDateOnly()) {
      dateString += " " + startJSDate.getHours() + ":" + 
          padNumber(startJSDate.getMinutes());
    }
    var li = document.createElement('article');

    if (entryLinkHref != null) {
      entryLink = document.createElement('a');
      entryLink.setAttribute('href', entryLinkHref);
      entryLink.appendChild(document.createTextNode(title));
      li.appendChild(entryLink);
      li.appendChild(document.createTextNode(' - ' + dateString));

    } else {
      li.appendChild(document.createTextNode(title + ' - ' + dateString));
    }       

    ul.appendChild(li);

  }
  eventDiv.appendChild(ul);
}
nubToMax
  • 1
  • 1
  • Creating and _appending_ a `br` creates a line-break. Can you show the code using that solution? – Teemu Sep 19 '14 at 09:26
  • I wrote this: var bra = document.createElement("br"); var hmm = document.getElementById("events"); hmm.appendChild(bra); And the result is: Leicester City vs Manchester United - 9/21 14:30 Leicester City vs Manchester United - 9/21 14:30 ; simply put, it doubles the first, existing result, on a new line; it doesn't split the one into two lines. – nubToMax Sep 19 '14 at 09:43
  • Can you create an example code of "create-br" version at http://jsfiddle.net ? – Teemu Sep 19 '14 at 10:05
  • You mean to see the code with that? Here I pasted my entire document (line 151 is the start I suppose) [PasteBin]: http://pastebin.com/22y7mwUS – nubToMax Sep 19 '14 at 10:09
  • If I've understood your question correctly, you need to split `dateString` and append the line-break between date and time parts. There's no line-break character which could be use in _text nodes_ producing a line-break on a HTML page, you need an element (like `br`) to show a line-break. – Teemu Sep 19 '14 at 10:16
  • No no, split move the date and time bellow the text (see picture http://i60.tinypic.com/2i1i8tz.png ) – nubToMax Sep 19 '14 at 10:23
  • Ehh... You need to store date and time to separate variables, then append a `date` text node, append a `br` element and finally append the `time` text node. – Teemu Sep 19 '14 at 10:27
  • I am not understanding why I can't append an element of br in between the title and the date seeing how they are separate; and also, why when I added the 3 lines of code for adding the br element, it duplicated the first line on a new line instead of simply splitting it – nubToMax Sep 19 '14 at 10:31
  • I thought you want to have a line-break between date and time. "... `I want to have the date and time on a separate line ...`" – Teemu Sep 19 '14 at 10:47
  • Yes...on separate line from the text not each other; I apologize for the confusion – nubToMax Sep 19 '14 at 11:05
  • Hmm... `hmm` is a `div`, you should append the line-break to `li` as well as you're appending `title` and `dateString`. – Teemu Sep 19 '14 at 11:11
  • 1
    Got it! Those 3 lines from earlier are now: var bra = document.createElement("br"); li.appendChild(bra); and that did the trick :). Thank you a bunch for going through with this and helping me out sir (I assume you are male :D ) – nubToMax Sep 19 '14 at 11:17

0 Answers0