Создание кода для javascript для включения объекта «клиент»

/*arrayofobjects.js*/
//global variables

//****modify item 1)disable submit 2)enable edit(load object data into form/ edit/reset submit&Edit)


var objectarray = []; //array
var indexvalue = 0; //used as global for modifyItem

function addToArray() {
  //read items from form and create client object
  var clientobject = {
    name,
    address,
    postal,
    phone,
    email,

    info: [],
    asset: []
  };

  //input variables into clientobject
  clientobject.name = document.getElementById("name").value;
  clientobject.address = document.getElementById("address").value;
  clientobject.postal = document.getElementById("postal").value;
  clientobject.phone = document.getElementById("phone").value;
  clientobject.email = document.getElementById("email").value;
  clientobject.age = document.getElementById("age").value;
  clientobject.income = document.getElementById("income").value;

  //alert("Client Name: "+clientobject.firstname+" "+clientobject.lastname);
  //load into objectarray

  //get radio buttons
  var clienttype = document.querySelector("input[name=clienttype]:checked").value;
  var residence = document.querySelector("input[name=residence]:checked").value;
  var home = document.querySelector("input[name=home]:checked").value;

  //push these into the info array inside client object
  clientobject.info.push(clienttype);
  clientobject.info.push(residence);
  clientobject.info.push(home);

  //push asset values
  if (document.querySelector("input[name=vehicle]:checked")) {
    clientobject.asset.push("vehicle");
  }
  if (document.querySelector("input[name=TFSA]:checked")) {
    clientobject.asset.push("TFSA");
  }
  if (document.querySelector("input[name=RRSP]:checked")) {
    clientobject.asset.push("RRSP");
  }
  if (document.querySelector("input[name=TFSA]:checked")) {
    clientobject.asset.push("TFSA");
  }

  objectarray.push(clientobject);
  displayList(); //display object array
}

function displayList() {
  //variables
  var clientlist = ""; //this will be the list of elements in the array list
  var displayRadiobuttons = ""; //display elements as a list of radio buttons

  for (var i = 0; i < objectarray.length; i++) {
    //local instance of clientobject
    var clientobject = {
      name,
      address,
      postal,
      phone,
      email,

      info: [],
      asset: []
    };

    clientobject = objectarray[i];
    clientlist =
      clientobject.name +
      ", " +
      clientobject.address +
      ", " +
      clientobject.postal +
      ", " +
      clientobject.phone +
      ", " +
      clientobject.email +
      ", " +
      clientobject.age +
      ", " +
      clientobject.income +
      "  ";

    //use for loop to go through info and asset arrays
    for (var x = 0; x < clientobject.info.length; x++) {
      clientlist += clientobject.info[x] + " ";
    }
    for (var x = 0; x < clientobject.asset.length; x++) {
      clientlist += clientobject.asset[x] + " ";
    }

    //create radio button tags and elements
    displayRadiobuttons += "<input type=radio name=listitem ";
    displayRadiobuttons += " value = " + i + " ";
    displayRadiobuttons += " onchange=modifyItem(this.value)>";
    displayRadiobuttons += clientlist + "<br>";
  }
  //display list
  document.getElementById("showlist").innerHTML = displayRadiobuttons;
}


/*delete item from objectarry at index i using splice
function deleteItem(i) {
	//delete ONE  item at index i	
	objectarray.splice(i,1);
	//display modified list
	displayList();
}*/

function modifyItem(i) {
  indexvalue = i; //need this

  var dataitem;
  var clientobject = {
    name,
    address,
    postal,
    phone,
    email,
    info: [],
    asset: []
  };

  clientobject = objectarray[i];

  //change buttons
  document.getElementById("submit").disabled = true;
  document.getElementById("edit").disabled = false;
  //load data into form
  document.getElementById("name").value = clientobject.name;
  document.getElementById("address").value = clientobject.address;
  document.getElementById("postal").value = clientobject.postal;
  document.getElementById("phone").value = clientobject.phone;
  document.getElementById("email").value = clientobject.email;

  //load data from info and asset
  //info will only contain 2 items, so these can be accessed directly
  dataitem = clientobject.info[0];

  if (dataitem == "Yes") //commercial is the value of radio button
  {
    document.register.clienttype[0].checked = true;
  } //must be residential
  else //residential is the value of radio button
  {
    document.register.clienttype[1].checked = true;
  }

  //residence
  dataitem = clientobject.info[1];
  if (dataitem == "Male") {
    document.register.residence[0].checked = true; //register is id of form in html file
  } else {
    document.register.residence[1].checked = true;
  }

  dataitem = clientobject.info[2];
  if (dataitem == "Own") //commercial is the value of radio button
  {
    document.register.home[0].checked = true;
  } //must be residential
  else //residential is the value of radio button
  {
    document.register.home[1].checked = true;
  }
  document.getElementById("age").value = clientobject.info.age;
  document.getElementById("income").value = clientobject.info.income;

  //reset the checkboxes to unchecked
  document.register.vehicle.checked = false;
  document.register.RRSP.checked = false;
  document.register.TFSA.checked = false;
  document.register.RRIF.checked = false;

  //use a for loop to load check boxes
  //check if asset length >0
  if (clientobject.asset.length > 0) {
    for (var i = 0; i < clientobject.asset.length; i++) {
      dataitem = clientobject.asset[i];
      if (dataitem == "vehicle") {
        document.register.vehicle.checked = true;
      }

      if (dataitem == "RRSP") {
        document.register.RRSP.checked = true;
      }

      if (dataitem == "TFSA") {
        document.register.TFSA.checked = true;
      }
      if (dataitem == "RRIF") {
        document.register.RRIF.checked = true;
      }
    }
  }
}

function setClientObject() //setClientObject is 'edit' button onclick
{
  //the global value for indexvalue was set in the previous function
  //load data
  var clientobject = {
    name,
    address,
    postal,
    phone,
    email,

    info: [],
    asset: []
  };

  //input variables into clientobject
  clientobject.name = document.getElementById("name").value;
  clientobject.address = document.getElementById("address").value;
  clientobject.postal = document.getElementById("postal").value;
  clientobject.phone = document.getElementById("phone").value;
  clientobject.email = document.getElementById("email").value;

  //alert("Client Name: "+clientobject.firstname+" "+clientobject.lastname);

  //load into objectarray
  //get radio buttons
  var clienttype = document.querySelector("input[name=clienttype]:checked").value;
  var residence = document.querySelector("input[name=residence]:checked").value;
  var home = document.querySelector("input[name=home]:checked").value;
  clientobject.age = document.getElementById("age").value;
  clientobject.income = document.getElementById("income").value;

  //push these into the info array inside client object
  clientobject.info.push(clienttype);
  clientobject.info.push(residence);
  clientobject.info.push(home);

  //push asset values
  if (document.querySelector("input[name=vehicle]:checked")) {
    clientobject.asset.push("vehicle");
  }
  if (document.querySelector("input[name=RRSP]:checked")) {
    clientobject.asset.push("RRSP");
  }
  if (document.querySelector("input[name=TFSA]:checked")) {
    clientobject.asset.push("TFSA");
  }
  if (document.querySelector("input[name=RRIF]:checked")) {
    clientobject.asset.push("RRIF");
  }

  objectarray[indexvalue] = clientobject; //take clientobject and put in the objectarray

  //reset submit button
  document.getElementById("submit").disabled = false;
  document.getElementById("edit").disabled = true;
  displayList(); //display object array
}