Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

380
Views
How to arrange the output in alphabetical order in javascript?

I need help as soon as possible. I try have tried various way on how to arrange the output in alphabetical order but none of them seems work. The question is asked to arrange the output in alphabetical order without changing the base code.

The base code:

function add() {
  var name = document.getElementById("id-name").value;
  var address = document.getElementById("id-address").value;
  var content = document.getElementById("id-content").innerHTML;
  document.getElementById("id-content").innerHTML = content + name + "<br/>" + address + "<hr/>";
}
Name: <input type="text" id="id-name" name="name"><br /> Address: <textarea id="id-address" name="address"></textarea><br />
<button id="id-send" onclick="javascript: add();">Send</button>
<hr>
<div id="id-content"></div>

This is the example of the output that it should display:

about 4 years ago · Juan Pablo Isaza
3 answers
Answer question

0

You could keep an array of submitted data and sort the array alpabetically. This solution should work:

      let listOfData = [];
      function add() {
        var name = document.getElementById("id-name").value;

        var address = document.getElementById("id-address").value;

        var content = document.getElementById("id-content").innerHTML;
        listOfData.push({
          personName: name,
          personAddress: address
        });

        document.getElementById("id-content").innerHTML = "";

        listOfData.sort((a, b) => a.personName.localeCompare(b.personName));
        for (let person of listOfData) {
          document.getElementById(
            "id-content"
          ).innerHTML += `${person.personName} <br/> ${person.personAddress}<br/> <hr/>`;
        }
      }
about 4 years ago · Juan Pablo Isaza Report

0

You could create an array and sort it

I wrapped in a form to have simpler event handling. Also no need for javascript: label on an inline event handler

const list = []; // you can get this from localStorage if you want to save across reloads
window.addEventListener("DOMContentLoaded", () => {
  const content = document.getElementById("id-content"),
    nameField = document.getElementById("id-name"),
    addressField = document.getElementById("id-address");
  const show = () => {
    list.sort((a, b) => a.name.localeCompare(b.name))
    content.innerHTML = list.map(({ name, address }) => `${name}<br/>${address}`).join("<hr/>");
  };

  document.getElementById("myForm").addEventListener("submit", e => {
    e.preventDefault();
    const name = nameField.value;
    const address = addressField.value;
    list.push({ name, address });
    show();
  });
});
<form id="myForm">
  Name: <input type="text" id="id-name" name="name"><br /> Address: <textarea id="id-address" name="address"></textarea><br />
  <button id="id-send">Send</button>
</form>
<hr>

<div id="id-content"></div>

about 4 years ago · Juan Pablo Isaza Report

0

Use this code it will work

function add() {
  var name = document.getElementById("id-name").value;
  var address = document.getElementById("id-address").value;
  let data = document.getElementById("id-content");
  let content = data.innerHTML;

  content = content + name + "<br/>" + address + "<hr>";
  
  let dt = "";
  
  let sortArr = content.split("<hr>").sort().join().split(",");
  
  for (let i = 1; i < sortArr.length; i++) {
    dt += sortArr[i] + "<hr>";
  }

  data.innerHTML = dt;
}
about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!