innerText works then takes me to page saying 'read-only'

support
1

I’m trying to test out using javascript to change some text in a span on my hugo site (using the Relearn theme):

<script src="/js/AI.js"></script>

<h2> 
    Welcome
</h2>

<p> There is as of yet no functionality here, this is for testing!</p>


<form method= "POST" action = "" enctype="multipart/form-data">
    <label for="query">Enter Query: </label>
    <input type="text" id="query" name="query"><br>
    <button onclick="test()"> Submit </button>
</form>

<span id="response"> </span>

function test() {
    document.getElementById("response").innerText = "Testing 123"
}

I can see the ‘Testing 123’ come up on screen, but I then get redirected to a page saying ‘read only’.

I know HUGO is a static site but I have seen it work elsewhere (see: How to Include JavaScript in your Hugo Website or Blog for Cool Applications).

Any suggestions would be appreciated.

2

This is a HTML/Javascript question and not related to Hugo or your used theme.

You don’t need a form to use a button.

If you use a form in this way, your button will be treated as having type=submit and causes a navigation.

3

Thank you! Complete oversight by me! Thanks for your time

4

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.