- I have one select dropdown.
- If any option selected from dropdown so one popup will display.
- I just want if user selected value from popup so that value should display on the select field.
- value shoud display from that select field which is generating popup box. Here is my code.
$("#select-me").on('change', function() {
//alert($(this).val());
if ($(this).val() == 1) {
$("#myModal_first").modal('show');
}else if($(this).val() == 2) {
$("#myModal_second").modal('show');
}
});
.modal {
text-align: center;
}
@media screen and (min-width: 768px) {
.modal:before {
display: inline-block;
vertical-align: middle;
content: "";
height: 100%;
}
}
.modal-dialog {
display: inline-block;
text-align: left;
vertical-align: middle;
}
.modal.show .modal-dialog {
width: 100% !important;
}
<!-- Latest compiled and minified CSS --><link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css"><!-- jQuery library --><script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script><!-- Latest compiled JavaScript --><script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script><section class="ftco-section contact-section ftco-degree-bg"><div class="container bg-light"><div class="row block-9"><div class="col-md-12 pr-md-12"><form method="post" id="backtestForm" action="<?php echo $_SERVER['PHP_SELF']; ?>"><div class="form-group"><label for="sel1">Select list:</label><select class="form-control" id="select-me"><option value="1">Moving Average</option><option value="2">Exponential Moving Average</option></select></div><div class="form-group"><div id="myModal_first" class="modal fade" role="dialog"><div class="modal-dialog"><button type="button" class="close" data-dismiss="modal">×</button><div class="modal-content"><div class="modal-body"><input type="text" name="simple_moving_average" id="simple_moving_average" class="form-control" placeholder="TEXT"></div><button type="button" class="btn btn-primary col-xl-6 text-center" style="align-self: center !important;">Save changes</button></div></div></div></div><div class="form-group"><div id="myModal_second" class="modal fade" role="dialog"><div class="modal-dialog"><button type="button" class="close" data-dismiss="modal">×</button><div class="modal-content"><div class="modal-body"><div class="row block-9"><div class="col-md-6 pr-md-6"><div class="form-group"><select class="form-control" id="#"><option>SELECT THE OPTIONS</option><option value="open">OPEN</option><option value="close">CLOSE</option><option value="low">LOW</option><option value="high">HIGH</option></select></div></div><div class="col-md-6 pr-md-6"><div class="form-group"><select class="form-control" id="#"><option>SELECT THE OPTIONS</option><option>1</option><option>2</option><option>3</option><option>4</option><option>5</option><option>6</option><option>7</option><option>8</option><option>9</option><option>10</option></select></div></div></div></div><button type="button" class="btn btn-primary col-xl-6 text-center" style="align-self: center !important;">Save changes</button></div></div></div></div><div class="form-group"><input type="submit" value="Send Message" class="btn btn-primary py-3 px-5"></div></form><?php echo "<h1>Hello</h1>"; ?></div></div></div></section>
As you can see it. I have the problem is after value selected from popup so those record should display on select field which is generating the popup.