Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=iso-8859-1" />
<title>Test Select</title>
<link rel="stylesheet" type="text/css" href="jquery/jquery-ui.css" />
<style type="text/css">
#editTable tr, #editTable td { border:none; padding: 5px; }
</style>
  
<link href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" rel="stylesheet">
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
    
<script type="text/javascript">
// <![CDATA[
​
$(document).ready(function(){
  $("#editFormDialog").dialog({autoOpen: false, width: 700, height: 520,
      closeOnEscape: true});
   $("#editRoomMenu").val('S160');
document.theForm.non_dialog_room.value = 'S160';  
});
// ]]>
</script>
​
</head>
​
<body>
<h1>Test Select</h1>
<form name="theForm" action="#">
<select name="non_dialog_room">
<option value="A2211">A2211</option>
<option value="A4213">A4213</option>
<option value="A4231">A4231</option>
<option value="A5102">A5102</option>
<option value="A5132">A5132</option>
<option value="A5212">A5212</option>
<option value="A6212">A6212</option>
<option value="A7131">A7131</option>
<option value="A9151">A9151</option>
<option value="AA222">AA222</option>
<option value="AA232">AA232</option>
<option value="AB101">AB101</option>
<option value="AB103">AB103</option>
<option value="AB121">AB121</option>
<option value="AB131">AB131</option>
<option value="AB134">AB134</option>
<option value="AB142">AB142</option>
<option value="AB201">AB201</option>
<option value="AB231">AB231</option>
<option value="AC160">AC160</option>
<option value="AC162">AC162</option>
<option value="AC252">AC252</option>
<option value="AC264">AC264</option>
<option value="AD123">AD123</option>
<option value="AD141">AD141</option>
<option value="AD143">AD143</option>
<option value="AD211">AD211</option>
<option value="AD221">AD221</option>
<option value="AE142">AE142</option>
<option value="AE251">AE251</option>
<option value="AE259">AE259</option>
<option value="AF141">AF141</option>
<option value="AF143">AF143</option>
<option value="AF160">AF160</option>
<option value="AF164">AF164</option>
<option value="AF174">AF174</option>
<option value="AF231">AF231</option>
<option value="AF241">AF241</option>
<option value="C101A">C101A</option>
<option value="C101B">C101B</option>
<option value="C101C">C101C</option>
<option value="C102">C102</option>
<option value="C103">C103</option>
<option value="C104">C104</option>
<option value="C105">C105</option>
<option value="C202">C202</option>
<option value="C203">C203</option>
<option value="C204">C204</option>
<option value="C205">C205</option>
<option value="C206">C206</option>
<option value="C207">C207</option>
<option value="C208">C208</option>
<option value="C209">C209</option>
<option value="CJ">CJ</option>
<option value="F">F</option>
<option value="GYM">GYM</option>
<option value="HSP">HSP</option>
<option value="LE200">LE200</option>
<option value="LE204">LE204</option>
<option value="LE209">LE209</option>
<option value="LE210">LE210</option>
<option value="LE231">LE231</option>
<option value="LE232">LE232</option>
<option value="MHS">MHS</option>
<option value="OFC">OFC</option>
<option value="P212">P212</option>
<option value="PE105">PE105</option>
<option value="PE106A">PE106A</option>
<option value="PE106B">PE106B</option>
<option value="PE107">PE107</option>
<option value="PE202">PE202</option>
<option value="PE204">PE204</option>
<option value="PE206">PE206</option>
<option value="PE206B">PE206B</option>
<option value="R2222">R2222</option>
<option value="R3312">R3312</option>
<option value="R4142">R4142</option>
<option value="R4231">R4231</option>
<option value="R4233">R4233</option>
<option value="R7141">R7141</option>
<option value="RD301">RD301</option>
<option value="RD312">RD312</option>
<option value="RE301">RE301</option>
<option value="RE311">RE311</option>
<option value="RF141">RF141</option>
<option value="RF234">RF234</option>
<option value="RF241">RF241</option>
<option value="RG122">RG122</option>
<option value="RG240">RG240</option>
<option value="RG248">RG248</option>
<option value="S112">S112</option>
<option value="S113">S113</option>
<option value="S123">S123</option>
<option value="S124">S124</option>
<option value="S127">S127</option>
<option value="S129">S129</option>
<option value="S140">S140</option>
<option value="S150">S150</option>
<option value="S160">S160</option>
<option value="S201">S201</option>
<option value="S219">S219</option>
<option value="S223">S223</option>
<option value="SC101">SC101</option>
<option value="SC102">SC102</option>
<option value="SC103">SC103</option>
<option value="SC116">SC116</option>
<option value="SC119">SC119</option>
<option value="SC125">SC125</option>
<option value="SC127">SC127</option>
<option value="SC214">SC214</option>
<option value="TC">TC</option>
<option value="VPA103">VPA103</option>
<option value="VPA104">VPA104</option>
<option value="VPA105">VPA105</option>
<option value="VPA106">VPA106</option>
<option value="VPA115">VPA115</option>
<option value="VPA116">VPA116</option>
<option value="VPA120">VPA120</option>
<option value="VPA125">VPA125</option>
<option value="VPA125F">VPA125F</option>
<option value="VPA200">VPA200</option>
<option value="VPA201">VPA201</option>
<option value="VPA202">VPA202</option>
<option value="VPA203">VPA203</option>
</select>
​
<input type="button" value="Show dialog" onclick=" $('#editFormDialog').dialog('open');"/>
</form>
​
      
<div id="editFormDialog" title="Edit Section">
      <form id="editForm" action="#">
      <p id="editSectionName"></p>
      <input type="hidden" name="editId" id="editId"/>
      <input type="hidden" name="editIndex" id="editIndex" />
      <fieldset>
          <table id="editTable">
              <tr>
              <td><label for="editRoomMenu">Room</label></td>
              <td><select name="editRoomMenu" id="editRoomMenu">
<option value="A2211">A2211</option>
<option value="A4213">A4213</option>
<option value="A4231">A4231</option>
<option value="A5102">A5102</option>
<option value="A5132">A5132</option>
<option value="A5212">A5212</option>
<option value="A6212">A6212</option>
<option value="A7131">A7131</option>
<option value="A9151">A9151</option>
<option value="AA222">AA222</option>
<option value="AA232">AA232</option>
<option value="AB101">AB101</option>
<option value="AB103">AB103</option>
<option value="AB121">AB121</option>
<option value="AB131">AB131</option>
<option value="AB134">AB134</option>
<option value="AB142">AB142</option>
<option value="AB201">AB201</option>
<option value="AB231">AB231</option>
<option value="AC160">AC160</option>
<option value="AC162">AC162</option>
<option value="AC252">AC252</option>
<option value="AC264">AC264</option>
<option value="AD123">AD123</option>
<option value="AD141">AD141</option>
<option value="AD143">AD143</option>
<option value="AD211">AD211</option>
<option value="AD221">AD221</option>
<option value="AE142">AE142</option>
<option value="AE251">AE251</option>
<option value="AE259">AE259</option>
<option value="AF141">AF141</option>
<option value="AF143">AF143</option>
<option value="AF160">AF160</option>
<option value="AF164">AF164</option>
<option value="AF174">AF174</option>
<option value="AF231">AF231</option>
<option value="AF241">AF241</option>
<option value="C101A">C101A</option>
<option value="C101B">C101B</option>
<option value="C101C">C101C</option>
<option value="C102">C102</option>
<option value="C103">C103</option>
<option value="C104">C104</option>
<option value="C105">C105</option>
<option value="C202">C202</option>
<option value="C203">C203</option>
<option value="C204">C204</option>
<option value="C205">C205</option>
<option value="C206">C206</option>
<option value="C207">C207</option>
<option value="C208">C208</option>
<option value="C209">C209</option>
<option value="CJ">CJ</option>
<option value="F">F</option>
<option value="GYM">GYM</option>
<option value="HSP">HSP</option>
<option value="LE200">LE200</option>
<option value="LE204">LE204</option>
<option value="LE209">LE209</option>
<option value="LE210">LE210</option>
<option value="LE231">LE231</option>
<option value="LE232">LE232</option>
<option value="MHS">MHS</option>
<option value="OFC">OFC</option>
<option value="P212">P212</option>
<option value="PE105">PE105</option>
<option value="PE106A">PE106A</option>
<option value="PE106B">PE106B</option>
<option value="PE107">PE107</option>
<option value="PE202">PE202</option>
<option value="PE204">PE204</option>
<option value="PE206">PE206</option>
<option value="PE206B">PE206B</option>
<option value="R2222">R2222</option>
<option value="R3312">R3312</option>
<option value="R4142">R4142</option>
<option value="R4231">R4231</option>
<option value="R4233">R4233</option>
<option value="R7141">R7141</option>
<option value="RD301">RD301</option>
<option value="RD312">RD312</option>
<option value="RE301">RE301</option>
<option value="RE311">RE311</option>
<option value="RF141">RF141</option>
<option value="RF234">RF234</option>
<option value="RF241">RF241</option>
<option value="RG122">RG122</option>
<option value="RG240">RG240</option>
<option value="RG248">RG248</option>
<option value="S112">S112</option>
<option value="S113">S113</option>
<option value="S123">S123</option>
<option value="S124">S124</option>
<option value="S127">S127</option>
<option value="S129">S129</option>
<option value="S140">S140</option>
<option value="S150">S150</option>
<option value="S160">S160</option>
<option value="S201">S201</option>
<option value="S219">S219</option>
<option value="S223">S223</option>
<option value="SC101">SC101</option>
<option value="SC102">SC102</option>
<option value="SC103">SC103</option>
<option value="SC116">SC116</option>
<option value="SC119">SC119</option>
<option value="SC125">SC125</option>
<option value="SC127">SC127</option>
<option value="SC214">SC214</option>
<option value="TC">TC</option>
<option value="VPA103">VPA103</option>
<option value="VPA104">VPA104</option>
<option value="VPA105">VPA105</option>
<option value="VPA106">VPA106</option>
<option value="VPA115">VPA115</option>
<option value="VPA116">VPA116</option>
<option value="VPA120">VPA120</option>
<option value="VPA125">VPA125</option>
<option value="VPA125F">VPA125F</option>
<option value="VPA200">VPA200</option>
<option value="VPA201">VPA201</option>
<option value="VPA202">VPA202</option>
<option value="VPA203">VPA203</option>
              </select>
              Status <select name="editStatus" id="editStatus">
                  <option value="A">A</option>
                  <option value="C">C</option>
                  <option value="D">D</option>
                  <option value="H">H</option>
                  <option value="P">P</option>
              </select>
              </td>
              </tr>
              <tr>
                  <td>
                      <label for="editStartTime">Start time</label>
                  </td>
                  <td>
                      <input name="editStartTime" id="editStartTime"
                      size="8" />
                      <label for="editEndTime">End time</label>
                      <input name="editEndTime" id="editEndTime" size="8"
                        type="text"/>
                  </td>
              </tr>
              <tr>
                  <td>
                      <label for="editStartDate">Start date</label>
                  </td>
                  <td>
                      <input type="text" name="editStartDate" id="editStartDate"
                      size="10" />
                      <label for="editEndDate">End date</label>
                      <input name="editEndDate" id="editEndDate" size="10"
                        type="text"/>
                          
                  </td>
              </tr>
              <tr>
                  <td>
                      Days
                  </td>
                  <td>
                    <input type="checkbox" id="editD1" name="d1" /> M &nbsp; &nbsp;
                    <input type="checkbox" id="editD2" name="d2" /> T &nbsp; &nbsp;
                    <input type="checkbox" id="editD3" name="d3" /> W &nbsp; &nbsp;
                    <input type="checkbox" id="editD4" name="d4" /> Th &nbsp; &nbsp;
                    <input type="checkbox" id="editD5" name="d5" /> F &nbsp; &nbsp;
                    <input type="checkbox" id="editD6" name="d6" /> Sa &nbsp; &nbsp;
                    <input type="checkbox" id="editD7" name="d7" /> Su
                </td>
            </tr>
            <tr>
                <td>
                    Faculty
                </td>
                <td>
                    <select name="facultyMenu" id="facultyMenu"></select>
                </td>
            </tr>
            <tr>
                <td>Units</td>
                <td><input type="text" size="6" id="editUnits"/>
                Load <input type="text" size="6" id="editLoad"/>
                </td>
            </tr>
            <tr>
              <td>Notes</td>
              <td><textarea id="editNotes" rows="3" cols="45"></textarea></td>
            </tr>
              <tr>
                  <td colspan="2">
                  <input type="button" value="Cancel"
                    onclick="$('#editFormDialog').dialog('close');"/>
                  </td>
              </tr>
          </table>
      </fieldset>
      </form>
</div>
​
<hr />
​
</body>
</html>
​
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers