Execute
Save
Share
Share link
share
share
share
Team
Public Teams
Comments
0
Created By:
Guest
Title:
Title
Description
Edit
Copy Link
Login
Email *
Password *
Login
OR
Create Account
Screen Name *
Email *
Password *
Retype Password *
Team Access Code
Register
Public CodeBins
HELP
--Select Theme--
Ambiance
Blackboard
Cobalt
Eclipse
Elegant
Erlang-Dark
Lesser-Dark
Monokai
Neat
Night
Rubyblue
Vibrant-Ink
Xq-Dark
New CodeBin
CodeBins Versions
04/03/2018- V.1
Recent CodeBins
View All CodeBins
$(document).ready(function() { $('#dropdownadd').change(function() { var dropDownDiv = $('#dropdowndiv'); // when the dropdown change set the div to empty dropDownDiv.html(""); http: //codebins.com/codes/home/4ldqpb7# // get the selected value $loopcount = $(this).val(); for (var i = 1; i <= $loopcount - 1; i++) { var setHtml = ""; // this adds textboxes using dropdown menu but inserts // the same number set into each set of textboxes setHtml = '<div class="form"><form id="frm' + i + '">'; setHtml += '<label>Mitreisender ' + i + '</label>'; setHtml += '<div class="inputs">'; for (var t = 0; t < 1; t++) { setHtml += '<input type="text" name="num' + t + '" id="num' + t + '" class="input" placeholder="1"/>'; setHtml += '<input type="text" name="num' + t + '" id="num' + t + '" class="input" placeholder="2" />'; setHtml += '<input type="text" name="num' + t + '" id="num' + t + '" class="input" placeholder="3"/>'; } setHtml += '</div>'; setHtml += '</div>'; dropDownDiv.append(setHtml); } var globalRefresh = dropDownDiv.append(globalRefresh); }); $("#reset").click(function() { $("#dropdownadd").val('0'); $("#dropdownadd").trigger('change'); }); });
Bottom of Page
In Head
On Load
On Ready
Setting
Validate
Copy
Format
body { background: #fdfdfd; font-family: Helvetica; } .heading { font-size: 14px; color: #333; } #dropdowndiv { } .form form{ border:1px solid #eaeaea; margin-bottom:5px; padding:5px; background:#eee; /*background-image: -webkit-linear-gradient(top, #eee, #ddd 70%); */ border-radius: 2px; box-shadow: 0 1px 1px rgba(0,0,0,0.2), inset 0 1px 0 rgba(255,255,255,0.2); } .form label{ float: left; padding: 0 0 0 2px; font-size:14px; line-height: 25px; color:#666; text-transform: uppercase; } .action{ float: right; } .button { border: 1px solid #7B9; background-color: #8CA; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.3); border-radius: 2px; background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0)); -webkit-transition: background-color 0.1s ease-in-out; } .button:hover { cursor: pointer; background-color: #a7ed99; } .form .inputs { clear: both; } .form .input{ box-sizing: border-box; width: 33.3333%; padding: 14px 0; background: #fafafa; font-size: 32px; text-align: center; border: 1px solid #f5f5f5; border-left-width: 0; box-shadow: inset 0 1px 0 rgba(255,255,255,0.5); } .form .input:nth-child(1) { border-radius: 4px 0 0 4px; } .form .input:nth-child(3) { border-radius: 0 2px 2px 0; border-right-width: 0; } #global-refresh { margin: 4px 8px 20px 0; }
Setting
Validate
Copy
Format
<div class="choices"> <span class="heading"> Add random number forms: </span> <select id="dropdownadd"> <option value="0"> 0 </option> <option value="1"> 1 </option> <option value="2"> 2 </option> <option value="3"> 3 </option> <option value="4"> 4 </option> <option value="5"> 5 </option> <option value="10"> 10 </option> <option value="20"> 20 </option> </select> </div> <div id="dropdowndiv"> <!-- this is where textboxes will appear --> </div>
No Doc Type
HTML5
HTML 4.01 Transitional
HTML 4.01 Strict
HTML 4.01 Frameset
XHTML 1.1
XHTML 1.0 Transitional
XHTML 1.0 Strict
XHTML 1.0 Frameset
Copy
Format
Download
×
Code Description
×
Difference of Versions
HTML
CSS
JS
×
JS Error
×
CSS Error
Errors
Warnings
×
JavaScript Setting
JS Libraries:
Chrome Frame 1.0.3
Dojo 1.8.0
Dojo 1.7.3
Dojo 1.7.2
Ext Core 3.1.0
jQuery 1.8.0
jQuery 1.7.2
jQuery 1.6.0
jQuery 1.5.0
jQuery 1.4.4
jQuery 1.4.0
jQuery-min 1.7.2
jQueryUI-min 1.8.21
MooTools more-1.4.0.1-full
MooTools core-1.4.5-full
MooTools core-1.4.1-full
Prototype 1.7.1.0
script.aculo.us 1.9.0
SWFObject 2.2
Twitter Bootstrap 2.0.4
WebFont Loader 1.0.28
yui 3.5.1
User Libraries:
Upload File
JavaScript URL(s):
×
CSS Setting
CSS Libraries:
jQueryUI 1.8.21
Twitter Bootstrap 2.0.4
User Libraries:
Upload File
CSS URL(s):