html onclick to load external javascript not working

Question

I am trying to load an external javascript from a html input button. However when I click on the button I get no output or response. I do get a message in console that the script has been loaded though. HTML:

<div class="split left">
    <fieldset class="Receiver Commands">
        <legend>Receiver Commands</legend>
<input type="button" value="click me" id="clickMe" onclick="serverStart()" />
        <script type="text/javascript" src="{%static 'scripts/ServerResponse.js' %}">
    </script>
            <form method="post">
            </form>
        <div id="testtaskbox" class="testtaskbox">
        {% csrf_token %}

        </div>
    </fieldset>
    <fieldset class="receiverResponse">
        <legend>Receiver Response</legend>
        <div class="receiverText">
            <textarea id ="response" class="textarea">Digdebugv2 1.11
                {{responseContext}}
            </textarea>
        </div>
    </fieldset>
</div>

Javascript:

serverStart()
function serverStart () {
  document.getElementById('reponse').innerHTML = '123bob'
  console.log('ServerResponse started')
}

Maybe the problem is that you are trying to get reponse instead of response when your are using getElementById. — user1403588
– user1403588, Commented Nov 26, 2018 at 11:25

J.vee · Accepted Answer · 2018-11-26 11:32:33Z

1

Your document.getElementById('reponse').innerHTML = '123bob' 'response' was not correct spelled.

Replace your current code with this and it will work.

 function serverStart () {
  document.getElementById('response').innerHTML = '123bob'
  console.log('ServerResponse started')
}
serverStart();

    <div class="split left">
    	<fieldset class="Receiver Commands">
    		<legend>Receiver Commands</legend>
    <input type="button" value="click me" id="clickMe" onclick="serverStart()" />
    		<script type="text/javascript" src="{%static 'scripts/ServerResponse.js' %}">
    	</script>
    			<form method="post">
    			</form>
    		<div id="testtaskbox" class="testtaskbox">
    		{% csrf_token %}
    
    		</div>
    	</fieldset>
    	<fieldset class="receiverResponse">
    		<legend>Receiver Response</legend>
    		<div class="receiverText">
    			<textarea id ="response" class="textarea">Digdebugv2 1.11
    				{{responseContext}}
    			</textarea>
    		</div>
    	</fieldset>
    </div>

edited Nov 26, 2018 at 11:32

answered Nov 26, 2018 at 11:25

J.vee

6191 gold badge7 silver badges26 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Callum Over a year ago

oh my god, im an idiot. been looking at this for hours, thank you!

J.vee Over a year ago

no problem. please set question as answered. that way everyone knows the question is answered. @Callum

Collectives™ on Stack Overflow

html onclick to load external javascript not working

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related