CODEWITHSUNDEEP
javascripthtml
Eleanor
Eleanor

Reputation: 3

Set a form as the parent of a button programmatically

In an HTML page I have this button:

<div>

<span class="myBtn">

<input type="submit" class="myClass" value="Cancel" id="cancel" name="myName" title="none">

</span>

</div>

With JS, I would like to change it this way, so that the button is "surrounded" by a form:

<div>

<form action="myURL" method='GET'>

<span class="myBtn">

<input type="submit" class="myClass" value="Cancel" id="cancel" name="myName" title="none">

</span>

</form>

</div>

Is this possible? I'm looking for a simple, vanilla JS solution, no JQuery.

Upvotes: 0

Views: 49

Answers (1)

bgoldst
bgoldst

Reputation: 35314

var form = document.createElement('form');
form.action = 'myURL';
form.method = 'GET';
var span = document.getElementsByClassName('myBtn')[0];
var parent = span.parentElement;
form.appendChild(span);
parent.appendChild(form);
<div>
    <span class="myBtn">
        <input type="submit" class="myClass" value="Cancel" id="cancel" name="myName" title="none"/>
    </span>
</div>

Upvotes: 2

Related Questions