Javascript populating var from input fields

Question

I have some input fields and script with some variables. I am trying to have the variables populated by the input fields, but I am doing something wrong as it is not doing anything for me.

I tried to add input fields like so:

<div data-role="content">
  <form type="post" onsubmit="calendarDemoAdd();">
    <div data-role="fieldcontain">
      <label for="title"> Reminder for </label>
      <input name="" id="title" placeholder="" value="" type="text">
    </div>
    <div data-role="fieldcontain">
      <label for="where"> Where </label>
      <input name="" id="where" placeholder="" value="" type="text">
    </div>
    <div data-role="fieldcontain">
      <label for="notes"> Notes </label>
      <input name="" id="notes" placeholder="" value="" type="text">
    </div>
    <div data-role="fieldcontain">
      <label for="startDate"> Start Date </label>
      <input name="" id="startDate" placeholder="September 24, 2014 14:30:00" value="" type="date">
    </div>
    <div data-role="fieldcontain">
      <label for="endDate"> End Date </label>
      <input name="" id="endDate" placeholder="September 24, 2014 14:30:00" value="" type="date">
    </div>
    <input type="submit" value="Submit" data-inline="true"/>
  </form>  // inserted missing tag
</div>

I also edited the javascript file like so:

"use strict";

// create an event starting now, lasting an hour
var startDate = document.getElementById("startDate").value;
var endDate = document.getElementById("endDate").value;


var title = document.getElementById("title").value;
var where = document.getElementById("where").value;
var notes = document.getElementById("notes").value;
var calSuccess = function(message) { alert("Success: " + JSON.stringify(message)); };
var calError = function(message) { alert("Error: " + message); };


function calendarDemoAdd() {
  window.plugins.calendar.createEvent(title,where,notes,startDate,endDate,calSuccess,calError);
}

function calendarDemoRemove() {
  window.plugins.calendar.deleteEvent(title,where,notes,startDate,endDate,calSuccess,calError);
}

What is the result you get so far? do you get an error? what happens to your js vars? which js var is not being populated? — Mohammed Joraid, Jan 21 '14 at 09:33
Nope, absolutely nothing happens. I also tried: var startDate = new Date (document.getElementById("startDate").value); That gives an error, but I forgot what it was. — , Jan 21 '14 at 09:35
If I use the following, it works perfectly, but I would like to have the variables populated by the input fields. I added the original Javascript above. This works fine. — , Jan 21 '14 at 09:37
which var is not being populated? Maybe cuz the field is empty? how do you trigger the JS to fill in the var from the field, is it on e.g. Keyup? — Mohammed Joraid, Jan 21 '14 at 10:00

score 0 · Accepted Answer · edited May 23 '17 at 12:28

0

Hope this helps:

Try parsing the date first, like this answer.

function parseDate(input) {
  var parts = input.split('-');
  // new Date(year, month [, day [, hours[, minutes[, seconds[, ms]]]]])
  return new Date(parts[0], parts[1]-1, parts[2]); // Note: months are 0-based
}

edited May 23 '17 at 12:28

Community

1
1

answered Jan 21 '14 at 09:46

mparkuk

509
7
14

mparkuk, that might be it. Will give it a try during my lunch hour. Thanks – Jan 21 '14 at 09:51

Javascript populating var from input fields

1 Answers1