Monday, May 20, 2024
 Popular · Latest · Hot · Upcoming
21
rated 0 times [  27] [ 6]  / answers: 1 / hits: 15164  / 7 Years ago, tue, june 6, 2017, 12:00:00

My project requirement is to display alert or dialog box on click of button, on that alert, display drop down list with some values, select the drop down list value and save it in array list using HTML.
i have tried this but it not working.
alert dialog should like below image.



<!--



<html lang=en>
<head>
<title></title>
<link rel=stylesheet href=//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css>
<link rel=stylesheet href=/resources/demos/style.css>
<script src=https://code.jquery.com/jquery-1.12.4.js></script>
<script src=https://code.jquery.com/ui/1.12.1/jquery-ui.js></script>
<link rel=stylesheet href=https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css integrity=sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u crossorigin=anonymous>
<script src=https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js integrity=sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa crossorigin=anonymous></script>
</head>
<body>

<a data-target=#myModal role=button class=btn data-toggle=modal>Launch demo modal</a>

<div class=modal fade hide id=myModal tabindex=-1 role=dialog aria-labelledby=myModalLabel aria-hidden=true>
<div class=modal-header>
<button type=button class=close data-dismiss=modal aria-hidden=true>×</button>
<h3 id=myModalLabel>Modal header</h3>
</div>
<div class=modal-body>
<select>
<option>test</option>
<option>test</option>
<option>test</option>
<option>test</option>
<option>test</option>
</select>
</div>
<div class=modal-footer>
<button class=btn data-dismiss=modal aria-hidden=true>Close</button>
<button class=btn btn-primary>Save changes</button>
</div>
</div>
</body>
</html>

More From » jquery

 Answers
12

Try this code...



<a data-target=#myModal role=button class=btn data-toggle=modal>Launch demo modal</a>

<div class=modal fade id=myModal tabindex=-1 role=dialog aria-labelledby=myModalLabel aria-hidden=true>

<div class=modal-dialog>
<div class=modal-content>
<div class=modal-header>
<button type=button class=close data-dismiss=modal aria-hidden=true>×</button>
<h3 id=myModalLabel>Modal header</h3>
</div>
<div class=modal-body>
<select>
<option>test</option>
<option>test</option>
<option>test</option>
<option>test</option>
<option>test</option>
</select>
</div>
<div class=modal-footer>
<button class=btn data-dismiss=modal aria-hidden=true>Close</button>
<button class=btn btn-primary>Save changes</button>
</div>
</div>
</div>
</div>


https://codepen.io/chandrashekhar/pen/yXNBmQ?editors=1100



here is a link for reference



you have added hide class to modal and also missed some code try this it works..


[#57557] Thursday, June 1, 2017, 7 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.
iyannae

Total Points: 147
Total Questions: 88
Total Answers: 120

Location: Japan
Member since Sat, Jun 6, 2020
4 Years ago
;