html onclick to load external javascript not working

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')

}

asked Nov 26 '18 at 11:20

Callum

Check console for error

– Mohammad
Nov 26 '18 at 11:25

Maybe the problem is that you are trying to get reponse instead of response when your are using getElementById.

– user1403588
Nov 26 '18 at 11:25

add a comment |

<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')

}

asked Nov 26 '18 at 11:20

Callum

Check console for error

– Mohammad
Nov 26 '18 at 11:25

Maybe the problem is that you are trying to get reponse instead of response when your are using getElementById.

– user1403588
Nov 26 '18 at 11:25

add a comment |

<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')

}

asked Nov 26 '18 at 11:20

Callum

<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')

}

javascript html external

asked Nov 26 '18 at 11:20

Callum

asked Nov 26 '18 at 11:20

Callum

asked Nov 26 '18 at 11:20

Callum

asked Nov 26 '18 at 11:20

Callum

asked Nov 26 '18 at 11:20

Callum

Check console for error

– Mohammad
Nov 26 '18 at 11:25

Maybe the problem is that you are trying to get reponse instead of response when your are using getElementById.

– user1403588
Nov 26 '18 at 11:25

add a comment |

Check console for error

– Mohammad
Nov 26 '18 at 11:25

Maybe the problem is that you are trying to get reponse instead of response when your are using getElementById.

– user1403588
Nov 26 '18 at 11:25

Check console for error

– Mohammad
Nov 26 '18 at 11:25

Maybe the problem is that you are trying to get reponse instead of response when your are using getElementById.

– user1403588
Nov 26 '18 at 11:25

add a comment |

1 Answer
1

active

oldest

votes

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 '18 at 11:32

answered Nov 26 '18 at 11:25

J.vee

5781323

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

– Callum
Nov 26 '18 at 11:41

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

– J.vee
Nov 26 '18 at 11:43

add a comment |

Your Answer

StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});

}
});

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53480013%2fhtml-onclick-to-load-external-javascript-not-working%23new-answer', 'question_page');
}
);

Post as a guest

Name

Required, but never shown

1 Answer
1

active

oldest

votes

1 Answer
1

active

oldest

votes

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 '18 at 11:32

answered Nov 26 '18 at 11:25

J.vee

5781323

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

– Callum
Nov 26 '18 at 11:41

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

– J.vee
Nov 26 '18 at 11:43

add a comment |

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 '18 at 11:32

answered Nov 26 '18 at 11:25

J.vee

5781323

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

– Callum
Nov 26 '18 at 11:41

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

– J.vee
Nov 26 '18 at 11:43

add a comment |

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 '18 at 11:32

answered Nov 26 '18 at 11:25

J.vee

5781323

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>

 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>

 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 '18 at 11:32

answered Nov 26 '18 at 11:25

J.vee

5781323

edited Nov 26 '18 at 11:32

answered Nov 26 '18 at 11:25

J.vee

5781323

answered Nov 26 '18 at 11:25

J.vee

5781323

answered Nov 26 '18 at 11:25

J.vee

5781323

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

– Callum
Nov 26 '18 at 11:41

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

– J.vee
Nov 26 '18 at 11:43

add a comment |

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

– Callum
Nov 26 '18 at 11:41

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

– J.vee
Nov 26 '18 at 11:43

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

– Callum
Nov 26 '18 at 11:41

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

– J.vee
Nov 26 '18 at 11:43

add a comment |

draft saved

draft discarded

Thanks for contributing an answer to Stack Overflow!

Please be sure to answer the question. Provide details and share your research!

But avoid …

Asking for help, clarification, or responding to other answers.

Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Name

Required, but never shown

Name

Required, but never shown

This page is only for reference, If you need detailed information, please check here

搜尋此網誌

Btukfyl