Javascript wont add data to table in html

Question

I was not able to get this to display the data entered into my table like I wanted. Keeps saying "Uncaught ReferenceError: createRequest is not defined at HTMLButtonElement.onclick" however I did! or I thought I did... please help me to see what I did wrong! I tried fixing the error messages but it doesn't seem to help. thank you

function myRequest(medium, subject, quantity) {
requestMedium = medium;
requestSubject = subject;
requestQuantity = quantity;
}
var requestButton = document.getElementById("createRequest");
if (requestButton.addEventListener) {
requestButton.addEventListener("click", Request, false);
} else if (requestButton.attachEvent) {
requestButton.attachEvent("onclick", Request);
}
function createRequest 
{

var requestMedium = document.getElementById(medium).value;
var requestSubject = document.getElementById(subject).value;
var requestQuantity = document.getElementById(quantity).value;
//create new request request, store reference in myRequest
//myRequest= new request(requestMedium, requestSubject, requestQuantity);
var addRequest = new Request(requestMedium, requestSubject, requestQuantity);
//display usere's request on page
createRequestDisplay(addRequest);

}
//display gloval request object on page
function displayRequest() {
document.getElementById("requestDisplay").innerHTML = Request.requestMedium + "<br>" +
    Request.requestSubject + "<br>" +
    Request.requestQuantity;
}
//display any request object to new document node on page
function createDisplayRequest(request) {
// create new object div element 
var fragment = document.createElement("div");
//add newObject class name to div element
var classAttrib = document.createAttribute("class");
classAttrib.value = "newObject";
//set class attibute to div fragment;
fragment.setAttributeNode(classAttrib);

//put request object info inside div 
fragment.innerHTML = requestMedium + < "br" > +
    requestStubject + < "br" > +
    requestSubject;
document.body.appendChild(fragment);
}

<div class="main">
<h1>Order Form for comissions</h1>


<legend>Request Comission</legend>
<label for="medium">Medium</label>
<input id="medium" type="text"><br>
<label for="subject">Subjects</label>
<!-- Grader: HTML error needs fixing...missing a '>'' character -->
<!-- <input id="subject" type="subject"<br> -->
<input id="subject" type="text">
<label for="quantity">quantity</label>
<input id="quantity" type="number"><br>
<button id="requestButton" onclick="createRequest">Submit</button>

</div>

<div id="displayRequest">
</div>

Your snippet don't even run. And should be onclick="createRequest()"> and the function should be function createRequest() you forgot parenthesis. And requestButton.addEventListener("click", Request, false); has no meaning... and... and... well erase your file and start from scratch, step by step — farvilain
– farvilain, Commented Nov 28, 2020 at 7:19
innerHTML must be string let see <"br"> add ' ' to be '<"br">' should fix something — zummon
– zummon, Commented Nov 28, 2020 at 7:23

farvilain · Accepted Answer · 2020-11-28 07:36:15Z

Here is a fixed version

  var submitRequestBtn = document.getElementById("submitRequestBtn");
  submitRequestBtn.addEventListener("click", submitRequest, false);
  
  function submitRequest() {
    const medium   = document.getElementById('medium').value;
    const subject  = document.getElementById('subject').value;
    const quantity = document.getElementById('quantity').value;

    const request = {medium, subject, quantity};
    displayRequest(request);
  }

  function displayRequest(request){
    document.getElementById("requestDisplay").innerHTML =
        request.medium + "<br>"
      + request.subject + "<br>"
      + request.quantity
    ;
  }

<div class="main">
    <h1>Order Form for comissions</h1>

    <legend>Request Comission</legend>
    <label for="medium">Medium</label>
    <input id="medium" type="text"><br>
    <label for="subject">Subjects</label>
    <input id="subject" type="text">
    <label for="quantity">quantity</label>
    <input id="quantity"type="number"><br>
    <button id="submitRequestBtn" onclick="submitRequest()">Submit</button>
    
    <br/>
    <div id ="requestDisplay"></div>    
</div>

Collectives™ on Stack Overflow

Javascript wont add data to table in html

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related