Jump to content
Sign in to follow this  
UniqueWeb

Disable textbox when a radio button is selected issues.

Recommended Posts

Hello everyone,

 

This is my first topic on W3Schools Forum. I am having issues dealing with disabling textbox when I click a radio button. And you might wanna read this code that I've posted here:

<!DOCTYPE html><html><head>    <meta charset="utf-8">	<title>Airline Reservations</title>	<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">	<script src="http://code.jquery.com/jquery-1.10.2.js"></script>	<script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>	<link rel="stylesheet" href="http://code.jquery.com/resources/demos/style.css">	<script>	$(function(){	   $( "#from" ).datepicker({          defaultDate: "+1w",		  changeMonth: true,		  numberOfMonths: 3,		  onClose: function( selectedDate ){		    $( "#to" ).datepicker( "option", "minDate", selectedDate );		  }	   });	   $( "#to" ).datepicker({	      defaultDate: "+1w",		  changeMonth: true,		  numberOfMonths: 3,		  onClose: function( selectedDate ){		    $( "#from" ).datepicker( "option", "maxDate", selectedDate );		  }	   });	});	</script>	<style>	body {	background-color: #EFEFEF;	font-family: Arial, Helvetica, sans-serif;	font-size: 12px;	font-weight: bold;	}	</style></head><body><form><input type="text" name="origin" placeholder="Origin"><input type="text" name="destination" placeholder="Destination"> <br>Trip: <input type="radio" name="trip" value="one-way">One-Way<input type="radio" name="trip" value="return">Return <br><label for="from">Departing on:</label><input type="text" id="from" name="from"><label for="to">Arriving on:</label><input type="text" id="to" name="to"> <br>Number of Passengers: <input type="number" min="1" max="9"> <br><input type="submit" value="Find Flights"></form></body></html>

Believe me, I am studying in Web Design course. If you have any knowledge about this, please reply to this post. Thank you.

Share this post


Link to post
Share on other sites

You can add a click handler to those radio buttons to call a function and send the value that was clicked, and based on the value you can disable whatever you want.

Share this post


Link to post
Share on other sites

Can you please show me the code so that I can test the webpage. Just trying to disable the Return value when I select One-Way.

Edited by UniqueWeb

Share this post


Link to post
Share on other sites

I'll help you figure it out, I'm not here to write code for people though. I believe you use this to attach a click handler with jQuery, there are examples on the page:https://api.jquery.com/click/You might find it easier to give those elements an ID and then use the IDs to attach the click handlers, or give them both the same class and then attach one click handler for the class that will run for both radio buttons. Inside the handler you can use $(this) to refer to the element that was clicked on, so you can get the value of it and know which one was clicked.

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

×
×
  • Create New...