tira
tira

Reputation: 25

how to redirect to next page with radio button without submit button?

this code is providing the submit button

the script

<script type="text/javascript">
function get_action(form) {
    form.action = document.querySelector('input[name = "x"]:checked').value;;
}

html form

<form name = "quoted" method="get" onsubmit="get_action(this);">
 <input id = "poster" type="text" name="poster" required="required" placeholder = "Credited Individual.">     <br>
 <textarea class = "actual_quote" name = "actual_quote" required="required" placeholder = "Write the question here!"></textarea><br><br><br>
 <div class = "checkboxes" required="required">
     <h3 style = "margin-top:-20px;">Please select one catagory that the quote falls into.</h3>
     <label for="x"><input type="radio" name="x" value="stupid.php" id = "x" checked="checked" />    <span>stupid</span></label><br>
     <label for="x"><input type="radio" name="x" value="stupider.php" id = "x" /> <span>stupider</span>    </label><br>
     <label for="x"><input type="radio" name="x" value="stupidest.php" id = "x"/>    <span>stupidest</span></label>
 </div>
 <input id = "submit1" type="submit"><br>

Upvotes: 0

Views: 211

Answers (1)

Alex Wiebogen
Alex Wiebogen

Reputation: 352

  1. dont mix your code-style between class="" and class = ""
  2. div cant have a required
  3. id must be unique
  4. use jQuery for it

$(document).ready(function(){
// debug output
    console.log('Document ready');
    $('#submit1').click(function(event){
	event.preventDefault();
	var redirect = $('input[name=x]:checked', '#quoted').val();
	alert (redirect);
	location.href = redirect;
    });
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<body>
	<form id="quoted">
		<input id="poster" type="text" name="poster" required="required" placeholder="Credited Individual."><br>
		<textarea class="actual_quote" name="actual_quote" required="required" placeholder="Write the question here!"></textarea><br><br><br>
		<div class = "checkboxes" required="required">
			<h3 style = "margin-top:-20px;">Please select one catagory that the quote falls into.</h3>
			<label for="x"><input type="radio" name="x" value="stupid.php" checked="checked" />    <span>stupid</span></label><br>
			<label for="x"><input type="radio" name="x" value="stupider.php"/> <span>stupider</span>    </label><br>
			<label for="x"><input type="radio" name="x" value="stupidest.php"/>    <span>stupidest</span></label>
		</div>
		<input id="submit1" type="button"><br>
	</form>
  </body>

Upvotes: 1

Related Questions