Returning text in a certain area after hitting an submit button

Question

I have had a little bit of a problem trying to figure this out on my own. I have had some experience writing a little bit of code but this is just one thing i can not get to work properly.

Back story is we hired an somewhat inexperienced website company to develop a website for us who actually didn't even use their own people. They farmed out the business. My boss at the time accidentally signed off on the final product when it was no where near being done. After it was all said and done it was dumped on my lap to fix.

My questions is we are using an submit button to echo results from a php file. I have being playing around with once the submit button gets clicked with the onclick= function it pops up text where I want in a certain location ( just above the picture return results) with a . the problems I am running into is that its not working for me and how do I get it to show up on the new page once the results return. Any help would be really appreciated because I have already banged my head against the wall with this multiple times trying it multiple ways. Then after I got it to appear how would I be able to hide it when the clear link is selected.

  <script> function onclick(ScrollDown) {Document.getElementsByTagName("ScrollDown").innerHTML=Please scroll down to view your search results. Click on the medical provider's name under their photo to learn more.;} 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="formfield3"><br/><input type="submit" name="submit" value="submit" onclick="ScrollDown()"><br/><a href="/search-doctors.php">clear</a></div></div> <p id = "ScrollDown">(Please scroll down to view your search results. Click on the medical provider's name under their photo to learn more.)</p> 

Pictures start below this line

  Thank you in advance! 

Answer 1

I think your function name is wrong. Also, your innerHTML must be a string (starts and ends with ".

 function ScrollDown() {
Document.getElementsByTagName("ScrollDown").innerHTML="Please scroll down to view your search results.  Click on the medical provider’s name under their photo to learn more.";
}

Hope it helps

Edit: Just saw that you do getElementsByTagName which is wrong since ScrollDown is not a tag but an id. You should use getElementById instead.

Answer 2

It seems that you are calling an nonexistent function. You defined a function called "onclick" wich receives a parameter called "ScrollDown".

Notice that in the onclick event inside the input element you are calling a function named "ScrollDown" you should call "onclick" instead, and you must have to pass a string with the name of the element you want to manipulate.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="formfield3"><br/>
    <input type="submit" name="submit" value="submit" onclick="onclick('ScrollDown')"><br/>
    <a href="/search-doctors.php">clear</a>
</div>

You also made a mistake at the "p" tag, the id attribute must be declared without spaces, and this is just a name, it won't call any functions:

<p id="ScrollDown">(Please scroll down to view your search results.  Click on the medical provider’s name under their photo to learn more.)</p>