Ad
JQuery Show/hide Div Based On Select Option
So I know this has been asked a bunch and I've cycled through several posts and have done, it seems, exactly what has been said, but can't get it to work. You can see my page here.
Essentially I want to show a div and make its inputs/selects required (once shown; if hidden, they are not required). Obviously the div should show/hide depending on the selection.
$('#table-meals, .product-addon-please-choose-your-meal').hide();
$('#purchase').change(function(){
if($(this).val()=="Individual") {
$('#table-meals').show();
$('select').prop('required',true);
}
if($(this).val()=="Table of 10") {
$('.product-addon-please-choose-your-meal').show();
$('input').prop('required',true);
}
});
Ad
Answer
I figured it out, instead of using $('#purchase').change(function(){
I need to use $('form').on('change', '#purchase', function(){
Ad
source: stackoverflow.com
Related Questions
- → How to update data attribute on Ajax complete
- → October CMS - Radio Button Ajax Click Twice in a Row Causes Content to disappear
- → Octobercms Component Unique id (Twig & Javascript)
- → Passing a JS var from AJAX response to Twig
- → Laravel {!! Form::open() !!} doesn't work within AngularJS
- → DropzoneJS & Laravel - Output form validation errors
- → Import statement and Babel
- → Uncaught TypeError: Cannot read property '__SECRET_DOM_DO_NOT_USE_OR_YOU_WILL_BE_FIRED' of undefined
- → React-router: Passing props to children
- → ListView.DataSource looping data for React Native
- → Can't test submit handler in React component
- → React + Flux - How to avoid global variable
- → Webpack, React & Babel, not rendering DOM
Ad