<![CDATA[
<p> </p><p> </p><p>문제2) 폼을 통해서 상품명과 상품 가격을 6개를 입력받아, 가격순으로 오름차순/내림차순 정렬처리 후 출력 <br>구현 파일 : jsp <br>파일명 : test03Ok.jsp <br>폼태그 내용은 미리 value값에 저장시켜놓는다 <br>버튼 : '오름차순'/'내림차순'/'돌아가기' <br>출력시에는 원본자료와 정렬된 자료를 모두 출력 <br>완성 후 화면을 예쁘게 꾸며보세요(bs4사용)</p><p> </p><div class="figure-html" data-ke-type="html" data-source="<div class="colorscripter-code" style="color:#010101;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important; position:relative !important;overflow:auto"><table class="colorscripter-code-table" style="margin:0;padding:0;border:none;background-color:#fafafa;border-radius:4px;" cellspacing="0" cellpadding="0"><tr><td style="padding:6px;border-right:2px solid #e5e5e5"><div style="margin:0;padding:0;word-break:normal;text-align:right;color:#666;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important;line-height:130%"><div style="line-height:130%">1</div><div style="line-height:130%">2</div><div style="line-height:130%">3</div><div style="line-height:130%">4</div><div style="line-height:130%">5</div><div style="line-height:130%">6</div><div style="line-height:130%">7</div><div style="line-height:130%">8</div><div style="line-height:130%">9</div><div style="line-height:130%">10</div><div style="line-height:130%">11</div><div style="line-height:130%">12</div><div style="line-height:130%">13</div><div style="line-height:130%">14</div><div style="line-height:130%">15</div><div style="line-height:130%">16</div><div style="line-height:130%">17</div><div style="line-height:130%">18</div><div style="line-height:130%">19</div><div style="line-height:130%">20</div><div style="line-height:130%">21</div><div style="line-height:130%">22</div><div style="line-height:130%">23</div><div style="line-height:130%">24</div><div style="line-height:130%">25</div><div style="line-height:130%">26</div><div style="line-height:130%">27</div><div style="line-height:130%">28</div><div style="line-height:130%">29</div><div style="line-height:130%">30</div><div style="line-height:130%">31</div><div style="line-height:130%">32</div><div style="line-height:130%">33</div><div style="line-height:130%">34</div><div style="line-height:130%">35</div><div style="line-height:130%">36</div><div style="line-height:130%">37</div><div style="line-height:130%">38</div><div style="line-height:130%">39</div><div style="line-height:130%">40</div><div style="line-height:130%">41</div><div style="line-height:130%">42</div><div style="line-height:130%">43</div><div style="line-height:130%">44</div><div style="line-height:130%">45</div><div style="line-height:130%">46</div><div style="line-height:130%">47</div><div style="line-height:130%">48</div><div style="line-height:130%">49</div><div style="line-height:130%">50</div><div style="line-height:130%">51</div><div style="line-height:130%">52</div><div style="line-height:130%">53</div><div style="line-height:130%">54</div><div style="line-height:130%">55</div><div style="line-height:130%">56</div><div style="line-height:130%">57</div><div style="line-height:130%">58</div><div style="line-height:130%">59</div><div style="line-height:130%">60</div><div style="line-height:130%">61</div><div style="line-height:130%">62</div><div style="line-height:130%">63</div><div style="line-height:130%">64</div><div style="line-height:130%">65</div><div style="line-height:130%">66</div><div style="line-height:130%">67</div><div style="line-height:130%">68</div><div style="line-height:130%">69</div><div style="line-height:130%">70</div><div style="line-height:130%">71</div><div style="line-height:130%">72</div><div style="line-height:130%">73</div><div style="line-height:130%">74</div><div style="line-height:130%">75</div><div style="line-height:130%">76</div><div style="line-height:130%">77</div><div style="line-height:130%">78</div><div style="line-height:130%">79</div><div style="line-height:130%">80</div><div style="line-height:130%">81</div><div style="line-height:130%">82</div><div style="line-height:130%">83</div><div style="line-height:130%">84</div><div style="line-height:130%">85</div><div style="line-height:130%">86</div><div style="line-height:130%">87</div><div style="line-height:130%">88</div><div style="line-height:130%">89</div><div style="line-height:130%">90</div><div style="line-height:130%">91</div><div style="line-height:130%">92</div><div style="line-height:130%">93</div><div style="line-height:130%">94</div><div style="line-height:130%">95</div><div style="line-height:130%">96</div><div style="line-height:130%">97</div><div style="line-height:130%">98</div><div style="line-height:130%">99</div><div style="line-height:130%">100</div><div style="line-height:130%">101</div><div style="line-height:130%">102</div><div style="line-height:130%">103</div><div style="line-height:130%">104</div><div style="line-height:130%">105</div><div style="line-height:130%">106</div><div style="line-height:130%">107</div><div style="line-height:130%">108</div><div style="line-height:130%">109</div><div style="line-height:130%">110</div><div style="line-height:130%">111</div><div style="line-height:130%">112</div><div style="line-height:130%">113</div><div style="line-height:130%">114</div><div style="line-height:130%">115</div><div style="line-height:130%">116</div><div style="line-height:130%">117</div><div style="line-height:130%">118</div><div style="line-height:130%">119</div><div style="line-height:130%">120</div><div style="line-height:130%">121</div><div style="line-height:130%">122</div><div style="line-height:130%">123</div><div style="line-height:130%">124</div><div style="line-height:130%">125</div><div style="line-height:130%">126</div><div style="line-height:130%">127</div><div style="line-height:130%">128</div><div style="line-height:130%">129</div><div style="line-height:130%">130</div><div style="line-height:130%">131</div><div style="line-height:130%">132</div><div style="line-height:130%">133</div><div style="line-height:130%">134</div><div style="line-height:130%">135</div><div style="line-height:130%">136</div><div style="line-height:130%">137</div><div style="line-height:130%">138</div><div style="line-height:130%">139</div><div style="line-height:130%">140</div><div style="line-height:130%">141</div><div style="line-height:130%">142</div><div style="line-height:130%">143</div><div style="line-height:130%">144</div><div style="line-height:130%">145</div><div style="line-height:130%">146</div><div style="line-height:130%">147</div><div style="line-height:130%">148</div><div style="line-height:130%">149</div><div style="line-height:130%">150</div><div style="line-height:130%">151</div><div style="line-height:130%">152</div><div style="line-height:130%">153</div><div style="line-height:130%">154</div><div style="line-height:130%">155</div><div style="line-height:130%">156</div><div style="line-height:130%">157</div><div style="line-height:130%">158</div><div style="line-height:130%">159</div><div style="line-height:130%">160</div><div style="line-height:130%">161</div><div style="line-height:130%">162</div><div style="line-height:130%">163</div><div style="line-height:130%">164</div><div style="line-height:130%">165</div><div style="line-height:130%">166</div><div style="line-height:130%">167</div><div style="line-height:130%">168</div><div style="line-height:130%">169</div><div style="line-height:130%">170</div><div style="line-height:130%">171</div><div style="line-height:130%">172</div><div style="line-height:130%">173</div><div style="line-height:130%">174</div><div style="line-height:130%">175</div><div style="line-height:130%">176</div><div style="line-height:130%">177</div><div style="line-height:130%">178</div><div style="line-height:130%">179</div><div style="line-height:130%">180</div><div style="line-height:130%">181</div><div style="line-height:130%">182</div><div style="line-height:130%">183</div><div style="line-height:130%">184</div><div style="line-height:130%">185</div><div style="line-height:130%">186</div><div style="line-height:130%">187</div><div style="line-height:130%">188</div><div style="line-height:130%">189</div><div style="line-height:130%">190</div><div style="line-height:130%">191</div><div style="line-height:130%">192</div><div style="line-height:130%">193</div><div style="line-height:130%">194</div><div style="line-height:130%">195</div><div style="line-height:130%">196</div><div style="line-height:130%">197</div><div style="line-height:130%">198</div><div style="line-height:130%">199</div><div style="line-height:130%">200</div><div style="line-height:130%">201</div></div></td><td style="padding:6px 0;text-align:left"><div style="margin:0;padding:0;color:#010101;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important;line-height:130%"><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&lt;%</span><span style="color:#0086b3">@</span>&nbsp;<span style="color:#0086b3">page</span>&nbsp;language<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span><span style="color:#63a35c">"java"</span>&nbsp;contentType<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span><span style="color:#63a35c">"text/html;&nbsp;charset=UTF-8"</span>&nbsp;pageEncoding<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span><span style="color:#63a35c">"UTF-8"</span><span style="color:#ff3399">%&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101">&lt;</span><span style="color:#066de2">!DOCTYPE</span>&nbsp;<span style="color:#0a9989">html</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101">&lt;</span><span style="color:#066de2">html</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101">&lt;</span><span style="color:#066de2">head</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">meta</span>&nbsp;<span style="color:#0a9989">charset</span>=<span style="color:#df5000">"UTF-8"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">title</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">title</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">link</span>&nbsp;<span style="color:#0a9989">rel</span>=<span style="color:#df5000">"stylesheet"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">href</span>=<span style="color:#df5000">"https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">script</span>&nbsp;<span style="color:#0a9989">src</span>=<span style="color:#df5000">"https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"</span><span style="color:#066de2"></span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">script</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">style</span><span style="color:#010101">&gt;</span><span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;.question&nbsp;</span>{<span style="color:#0099cc"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#0099cc">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;margin-left</span><span style="color:#ff3399">:</span><span style="color:#0066cc">&nbsp;400px</span><span style="color:#ff3399">;</span><span style="color:#0066cc"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#0066cc">&nbsp;&nbsp;&nbsp;&nbsp;</span>}</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">style</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">script</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#63a35c">'use&nbsp;strict'</span>;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a71d5d">let</span>&nbsp;orgProducts&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;[];</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a71d5d">let</span>&nbsp;products&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;[];&nbsp;<span style="color:#999999">//product&nbsp;price의&nbsp;Number타입&nbsp;배열&nbsp;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a71d5d">let</span>&nbsp;orgProductNames&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;[];</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a71d5d">let</span>&nbsp;productNames&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;[];&nbsp;<span style="color:#999999">//product&nbsp;name의&nbsp;문자타입&nbsp;배열</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//window.xxxxonload()와&nbsp;같음</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;$(<span style="color:#066de2">document</span>).ready(<span style="color:#a71d5d">function</span>(){</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//문제2)&nbsp;문장&nbsp;위치&nbsp;변경</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$(<span style="color:#63a35c">'#question'</span>).addClass(<span style="color:#63a35c">"question"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//Number타입의&nbsp;productPrice의&nbsp;값을&nbsp;가져와서&nbsp;products배열&nbsp;만들기&nbsp;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$(<span style="color:#63a35c">'#productsDiv&nbsp;input[name="productPrice"]'</span>).each((idx,&nbsp;product)&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span><span style="color:#ff3399"></span><span style="color:#a71d5d">&gt;</span>&nbsp;{</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#066de2">console</span>.log($(product).val());</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;products.push(<span style="color:#066de2">Number</span>($(product).val()));</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;orgProducts.push(<span style="color:#066de2">Number</span>($(product).val()));</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//console.log(products.pop());</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;});</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//product&nbsp;name의&nbsp;값을&nbsp;가져와서&nbsp;productName배열&nbsp;만들기&nbsp;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$(<span style="color:#63a35c">'#productsDiv&nbsp;label[name="productName"]'</span>).each((idx,&nbsp;<span style="color:#066de2">name</span>)&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span><span style="color:#ff3399"></span><span style="color:#a71d5d">&gt;</span>&nbsp;{</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#066de2">console</span>.log($(<span style="color:#066de2">name</span>).text());</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;productNames.push($(<span style="color:#066de2">name</span>).text());</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;orgProductNames.push($(<span style="color:#066de2">name</span>).text());</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//console.log(productNames.pop());</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;});</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//productPrice를&nbsp;val()로&nbsp;받아&nbsp;배열로&nbsp;저장하려고&nbsp;하면,&nbsp;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//productPrice의&nbsp;첫번째&nbsp;값을&nbsp;가져온&nbsp;값의&nbsp;숫자가&nbsp;1자씩&nbsp;분할되어&nbsp;배열로&nbsp;저장됨ㅜㅜ</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//그냥&nbsp;위와&nbsp;같이&nbsp;productPrice를&nbsp;each()로&nbsp;돌린&nbsp;값을&nbsp;새로운&nbsp;배열에&nbsp;추가하기로&nbsp;함ㅜㅜ</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//let&nbsp;product&nbsp;=&nbsp;$('#productsDiv&nbsp;input[name="productPrice"]').val();//2500000&nbsp;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//console.log("받은&nbsp;상품가격&nbsp;:&nbsp;"&nbsp;+&nbsp;product);</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//&nbsp;console.log("상품목록갯수:"+products.length);</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//&nbsp;console.log('products[0]='+products[0]);//2</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//&nbsp;console.log('products[1]='+products[1]);//5</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//&nbsp;console.log('products[2]='+products[2]);//0</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//&nbsp;$.each([&nbsp;52,&nbsp;97&nbsp;],&nbsp;function(&nbsp;index,&nbsp;value&nbsp;)&nbsp;{</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;alert(‎&nbsp;index&nbsp;+&nbsp;":&nbsp;"&nbsp;+&nbsp;value&nbsp;);</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//&nbsp;});</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$(<span style="color:#63a35c">'#productsDiv&nbsp;input[name="btnAsending"]'</span>).click(<span style="color:#a71d5d">function</span>(){</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//Selected&nbsp;Sort&nbsp;알고리즘&nbsp;오름차순정렬</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a71d5d">let</span>&nbsp;temp&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;<span style="color:#0099cc">0</span>,&nbsp;tempName&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;<span style="color:#63a35c">''</span>;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$.each(products,&nbsp;<span style="color:#a71d5d">function</span>(i,&nbsp;price){</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a71d5d">if</span>&nbsp;(i&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">&lt;</span>&nbsp;products.<span style="color:#066de2">length</span><span style="color:#a71d5d">-</span><span style="color:#0099cc">1</span>)&nbsp;{</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$.each(products,&nbsp;<span style="color:#a71d5d">function</span>(j,&nbsp;price){</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a71d5d">if</span>&nbsp;(j&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">&gt;</span><span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;(i<span style="color:#ff3399"></span><span style="color:#a71d5d">+</span><span style="color:#0099cc">1</span>))&nbsp;{</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//앞의&nbsp;값이&nbsp;뒤의&nbsp;값보다&nbsp;크면&nbsp;서로&nbsp;교체</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a71d5d">if</span>&nbsp;(products[i]&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">&gt;</span>&nbsp;products[j])&nbsp;{</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;temp&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;products[i];</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;products[i]&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;products[j];</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;products[j]&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;temp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;tempName&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;productNames[i];</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;productNames[i]&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;productNames[j];</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;productNames[j]&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;tempName;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;});</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;});</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//오름차순&nbsp;정렬된&nbsp;products배열&nbsp;consol&nbsp;log출력확인</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$.each(products,&nbsp;<span style="color:#a71d5d">function</span>(idx,&nbsp;price){</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#066de2">console</span>.log(price);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;});</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;form.action&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;<span style="color:#63a35c">'test03Ok.jsp?orgProducts='</span><span style="color:#ff3399"></span><span style="color:#a71d5d">+</span>orgProducts<span style="color:#ff3399"></span><span style="color:#a71d5d">+</span><span style="color:#63a35c">'&amp;products='</span><span style="color:#ff3399"></span><span style="color:#a71d5d">+</span>products<span style="color:#ff3399"></span><span style="color:#a71d5d">+</span><span style="color:#63a35c">'&amp;orgProductNames='</span><span style="color:#ff3399"></span><span style="color:#a71d5d">+</span>orgProductNames<span style="color:#ff3399"></span><span style="color:#a71d5d">+</span><span style="color:#63a35c">'&amp;productNames='</span><span style="color:#ff3399"></span><span style="color:#a71d5d">+</span>productNames;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;form.submit();</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//Array.sort();&nbsp;//오름차순</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//&nbsp;let&nbsp;idx&nbsp;=&nbsp;"";</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//&nbsp;$.each(products.sort(),&nbsp;function(i,&nbsp;price){</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;idx&nbsp;+=&nbsp;','&nbsp;+&nbsp;i;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;console.log(price);//Number타입의&nbsp;배열인데도,숫자의&nbsp;앞자리만으로&nbsp;비교되어,정렬이&nbsp;틀림</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//&nbsp;});</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//&nbsp;console.log('idx='+idx);&nbsp;//idx=0,1,2,3,4,5</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//productNames</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//products.sort()를&nbsp;사용하면&nbsp;producsts배열이&nbsp;이미&nbsp;sorted되어&nbsp;이전idx의&nbsp;변화를&nbsp;알&nbsp;수&nbsp;없음ㅜㅜ</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//그냥&nbsp;selection&nbsp;sort&nbsp;알고리즘을&nbsp;사용하기로&nbsp;함</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;});</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$(<span style="color:#63a35c">'#productsDiv&nbsp;input[name="btnDesending"]'</span>).click(<span style="color:#a71d5d">function</span>(){</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//Selected&nbsp;Sort&nbsp;알고리즘&nbsp;내림차순정렬</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a71d5d">let</span>&nbsp;temp&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;<span style="color:#0099cc">0</span>,&nbsp;tempName&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;<span style="color:#63a35c">''</span>;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$.each(products,&nbsp;<span style="color:#a71d5d">function</span>(i,&nbsp;price){</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a71d5d">if</span>&nbsp;(i&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">&lt;</span>&nbsp;products.<span style="color:#066de2">length</span><span style="color:#a71d5d">-</span><span style="color:#0099cc">1</span>)&nbsp;{</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$.each(products,&nbsp;<span style="color:#a71d5d">function</span>(j,&nbsp;price){</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a71d5d">if</span>&nbsp;(j&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">&gt;</span><span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;(i<span style="color:#ff3399"></span><span style="color:#a71d5d">+</span><span style="color:#0099cc">1</span>))&nbsp;{</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//앞의&nbsp;값이&nbsp;뒤의&nbsp;값보다&nbsp;작으면&nbsp;서로&nbsp;교체</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a71d5d">if</span>&nbsp;(products[i]&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">&lt;</span>&nbsp;products[j])&nbsp;{</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;temp&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;products[i];</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;products[i]&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;products[j];</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;products[j]&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;temp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;tempName&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;productNames[i];</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;productNames[i]&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;productNames[j];</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;productNames[j]&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;tempName;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;});</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;});</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//내림차순&nbsp;정렬된&nbsp;products배열&nbsp;consol&nbsp;log출력확인</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$.each(products,&nbsp;<span style="color:#a71d5d">function</span>(idx,&nbsp;price){</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#066de2">console</span>.log(price);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;});</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;form.action&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;<span style="color:#63a35c">'test03Ok.jsp?orgProducts='</span><span style="color:#ff3399"></span><span style="color:#a71d5d">+</span>orgProducts<span style="color:#ff3399"></span><span style="color:#a71d5d">+</span><span style="color:#63a35c">'&amp;products='</span><span style="color:#ff3399"></span><span style="color:#a71d5d">+</span>products<span style="color:#ff3399"></span><span style="color:#a71d5d">+</span><span style="color:#63a35c">'&amp;orgProductNames='</span><span style="color:#ff3399"></span><span style="color:#a71d5d">+</span>orgProductNames<span style="color:#ff3399"></span><span style="color:#a71d5d">+</span><span style="color:#63a35c">'&amp;productNames='</span><span style="color:#ff3399"></span><span style="color:#a71d5d">+</span>productNames;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;form.submit();</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//console.log(&nbsp;$(products).toArray().reverse());</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//products.reverse();&nbsp;//내림차순</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//&nbsp;let&nbsp;idx&nbsp;=&nbsp;'';</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//&nbsp;$.each(products.reverse(),&nbsp;function(i,&nbsp;price){</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;idx&nbsp;+=&nbsp;','&nbsp;+&nbsp;i;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;console.log(price);//Number타입의&nbsp;배열인데도,숫자의&nbsp;앞자리만으로&nbsp;비교되어,정렬이&nbsp;틀림</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//&nbsp;});</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//&nbsp;console.log('idx='+idx);&nbsp;//idx=0,1,2,3,4,5</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//productNames</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//products.reverse()를&nbsp;사용하면&nbsp;producsts배열이&nbsp;이미&nbsp;sorted되어&nbsp;이전idx의&nbsp;변화를&nbsp;알&nbsp;수&nbsp;없음ㅜㅜ</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//그냥&nbsp;selection&nbsp;sort&nbsp;알고리즘을&nbsp;사용하기로&nbsp;함</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;});</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#999999">/*&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;function&nbsp;check()&nbsp;{</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#999999">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$.isNumeric();&nbsp;//이미&nbsp;Number()함수로&nbsp;products배열의&nbsp;값을&nbsp;숫자타입으로&nbsp;바꿔서&nbsp;생략함</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#999999">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#999999">&nbsp;*/</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//콤마&nbsp;추가</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//&nbsp;function&nbsp;numberWithCommas(num)&nbsp;{</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return&nbsp;num.toString().replace(/\B(?=(\d{3})+(?!\d))/g,&nbsp;",");</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#999999">//&nbsp;}</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;});</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">script</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">head</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101">&lt;</span><span style="color:#066de2">body</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101">&lt;</span><span style="color:#066de2">p</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#066de2">br</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">p</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101">&lt;</span><span style="color:#066de2">div</span>&nbsp;<span style="color:#0a9989">id</span>=<span style="color:#df5000">"question"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"container"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101">&lt;</span><span style="color:#066de2">pre</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">문제2)&nbsp;폼을&nbsp;통해서&nbsp;상품명과&nbsp;상품&nbsp;가격을&nbsp;6개를&nbsp;입력받아,&nbsp;가격순으로&nbsp;오름차순/내림차순&nbsp;정렬처리&nbsp;후&nbsp;출력</div><div style="padding:0 6px; white-space:pre; line-height:130%">-&nbsp;서블릿&nbsp;없이&nbsp;Jsp화면만으로&nbsp;구현하기</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">구현&nbsp;파일&nbsp;:&nbsp;jsp</div><div style="padding:0 6px; white-space:pre; line-height:130%">파일명&nbsp;:&nbsp;test03Ok.jsp</div><div style="padding:0 6px; white-space:pre; line-height:130%">폼태그&nbsp;내용은&nbsp;미리&nbsp;value값에&nbsp;저장시켜놓는다</div><div style="padding:0 6px; white-space:pre; line-height:130%">버튼&nbsp;:&nbsp;'오름차순'/'내림차순'/'돌아가기'</div><div style="padding:0 6px; white-space:pre; line-height:130%">출력시에는&nbsp;원본자료와&nbsp;정렬된&nbsp;자료를&nbsp;모두&nbsp;출력</div><div style="padding:0 6px; white-space:pre; line-height:130%">완성&nbsp;후&nbsp;화면을&nbsp;예쁘게&nbsp;꾸며보세요(bs4사용)</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">pre</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">div</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101">&lt;</span><span style="color:#066de2">div</span>&nbsp;<span style="color:#0a9989">id</span>=<span style="color:#df5000">"productsDiv"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">align</span>=<span style="color:#df5000">"center"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"container"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#066de2">br</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">form</span>&nbsp;<span style="color:#0a9989">name</span>=<span style="color:#df5000">"form"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">method</span>=<span style="color:#df5000">"post"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">table</span>&nbsp;<span style="color:#0a9989">width</span>=<span style="color:#df5000">"500px"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">tr</span>&nbsp;<span style="color:#0a9989">height</span>=<span style="color:#df5000">"50px"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">th</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#066de2">div</span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">align</span>=<span style="color:#df5000">"center"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span>상품명<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">div</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">th</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">th</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#066de2">div</span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">align</span>=<span style="color:#df5000">"center"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span>상품가격<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">div</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">th</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">tr</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">tr</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#066de2">label</span>&nbsp;<span style="color:#0a9989">for</span>=<span style="color:#df5000">"productPrice1"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">name</span>=<span style="color:#df5000">"productName"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span>냉장고<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">label</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#066de2">input</span>&nbsp;<span style="color:#0a9989">type</span>=<span style="color:#df5000">"number"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">name</span>=<span style="color:#df5000">"productPrice"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">id</span>=<span style="color:#df5000">"productPrice1"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">value</span>=<span style="color:#df5000">"2500000"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"form-control"</span><span style="color:#0a9989">/</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">tr</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">tr</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#066de2">label</span>&nbsp;<span style="color:#0a9989">for</span>=<span style="color:#df5000">"productPrice2"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">name</span>=<span style="color:#df5000">"productName"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span>TV<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">label</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#066de2">input</span>&nbsp;<span style="color:#0a9989">type</span>=<span style="color:#df5000">"number"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">name</span>=<span style="color:#df5000">"productPrice"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">id</span>=<span style="color:#df5000">"productPrice2"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">value</span>=<span style="color:#df5000">"102000"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"form-control"</span><span style="color:#0a9989">/</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">tr</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">tr</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#066de2">label</span>&nbsp;<span style="color:#0a9989">for</span>=<span style="color:#df5000">"productPrice3"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">name</span>=<span style="color:#df5000">"productName"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span>전기포트<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">label</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#066de2">input</span>&nbsp;<span style="color:#0a9989">type</span>=<span style="color:#df5000">"number"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">name</span>=<span style="color:#df5000">"productPrice"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">id</span>=<span style="color:#df5000">"productPrice3"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">value</span>=<span style="color:#df5000">"50000"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"form-control"</span><span style="color:#0a9989">/</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">tr</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">tr</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#066de2">label</span>&nbsp;<span style="color:#0a9989">for</span>=<span style="color:#df5000">"productPrice4"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">name</span>=<span style="color:#df5000">"productName"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span>선풍기<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">label</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#066de2">input</span>&nbsp;<span style="color:#0a9989">type</span>=<span style="color:#df5000">"number"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">name</span>=<span style="color:#df5000">"productPrice"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">id</span>=<span style="color:#df5000">"productPrice4"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">value</span>=<span style="color:#df5000">"100000"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"form-control"</span><span style="color:#0a9989">/</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">tr</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">tr</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#066de2">label</span>&nbsp;<span style="color:#0a9989">for</span>=<span style="color:#df5000">"productPrice5"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">name</span>=<span style="color:#df5000">"productName"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span>헤어드라이어<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">label</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#066de2">input</span>&nbsp;<span style="color:#0a9989">type</span>=<span style="color:#df5000">"number"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">name</span>=<span style="color:#df5000">"productPrice"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">id</span>=<span style="color:#df5000">"productPrice5"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">value</span>=<span style="color:#df5000">"80000"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"form-control"</span><span style="color:#0a9989">/</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">tr</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">tr</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#066de2">label</span>&nbsp;<span style="color:#0a9989">for</span>=<span style="color:#df5000">"productPrice6"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">name</span>=<span style="color:#df5000">"productName"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span>전자랜지<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">label</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#066de2">input</span>&nbsp;<span style="color:#0a9989">type</span>=<span style="color:#df5000">"number"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">name</span>=<span style="color:#df5000">"productPrice"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">id</span>=<span style="color:#df5000">"productPrice6"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">value</span>=<span style="color:#df5000">"500000"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"form-control"</span><span style="color:#0a9989">/</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">tr</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">tr</span>&nbsp;<span style="color:#0a9989">height</span>=<span style="color:#df5000">"100px"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">td</span>&nbsp;<span style="color:#0a9989">colspan</span>=<span style="color:#df5000">"2"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">align</span>=<span style="color:#df5000">"center"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">input</span>&nbsp;<span style="color:#0a9989">type</span>=<span style="color:#df5000">"button"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">name</span>=<span style="color:#df5000">"btnAsending"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">value</span>=<span style="color:#df5000">"오름차순"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"btn&nbsp;btn-success&nbsp;m-2"</span><span style="color:#0a9989">/</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">input</span>&nbsp;<span style="color:#0a9989">type</span>=<span style="color:#df5000">"button"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">name</span>=<span style="color:#df5000">"btnDesending"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">value</span>=<span style="color:#df5000">"내림차순"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"btn&nbsp;btn-success&nbsp;m-2"</span><span style="color:#0a9989">/</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">input</span>&nbsp;<span style="color:#0a9989">type</span>=<span style="color:#df5000">"reset"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">value</span>=<span style="color:#df5000">"취소"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"btn&nbsp;btn-success&nbsp;m-2"</span><span style="color:#0a9989">/</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">tr</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">table</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">form</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">div</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">div</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">body</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">html</span><span style="color:#010101">&gt;</span></div></div><div style="text-align:right;margin-top:-13px;margin-right:5px;font-size:9px;font-style:italic"><a href="http://colorscripter.com/info#e" target="_blank" style="color:#e5e5e5text-decoration:none">Colored by Color Scripter</a></div></td><td style="vertical-align:bottom;padding:0 2px 4px 0"><a href="http://colorscripter.com/info#e" target="_blank" style="text-decoration:none;color:white"><span style="font-size:9px;word-break:normal;background-color:#e5e5e5;color:white;border-radius:10px;padding:1px">cs</span></a></td></tr></table></div>"><div data-ke-class="article"><div class="colorscripter-code" style="color:#010101;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important; position:relative !important;overflow:auto"><table class="colorscripter-code-table" style="margin:0;padding:0;border:none;background-color:#fafafa;border-radius:4px;" cellspacing="0" cellpadding="0"><tr><td style="padding:6px;border-right:2px solid #e5e5e5"><div style="margin:0;padding:0;word-break:normal;text-align:right;color:#666;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important;line-height:130%"><div style="line-height:130%">1</div><div style="line-height:130%">2</div><div style="line-height:130%">3</div><div style="line-height:130%">4</div><div style="line-height:130%">5</div><div style="line-height:130%">6</div><div style="line-height:130%">7</div><div style="line-height:130%">8</div><div style="line-height:130%">9</div><div style="line-height:130%">10</div><div style="line-height:130%">11</div><div style="line-height:130%">12</div><div style="line-height:130%">13</div><div style="line-height:130%">14</div><div style="line-height:130%">15</div><div style="line-height:130%">16</div><div style="line-height:130%">17</div><div style="line-height:130%">18</div><div style="line-height:130%">19</div><div style="line-height:130%">20</div><div style="line-height:130%">21</div><div style="line-height:130%">22</div><div style="line-height:130%">23</div><div style="line-height:130%">24</div><div style="line-height:130%">25</div><div style="line-height:130%">26</div><div style="line-height:130%">27</div><div style="line-height:130%">28</div><div style="line-height:130%">29</div><div style="line-height:130%">30</div><div style="line-height:130%">31</div><div style="line-height:130%">32</div><div style="line-height:130%">33</div><div style="line-height:130%">34</div><div style="line-height:130%">35</div><div style="line-height:130%">36</div><div style="line-height:130%">37</div><div style="line-height:130%">38</div><div style="line-height:130%">39</div><div style="line-height:130%">40</div><div style="line-height:130%">41</div><div style="line-height:130%">42</div><div style="line-height:130%">43</div><div style="line-height:130%">44</div><div style="line-height:130%">45</div><div style="line-height:130%">46</div><div style="line-height:130%">47</div><div style="line-height:130%">48</div><div style="line-height:130%">49</div><div style="line-height:130%">50</div><div style="line-height:130%">51</div><div style="line-height:130%">52</div><div style="line-height:130%">53</div><div style="line-height:130%">54</div><div style="line-height:130%">55</div><div style="line-height:130%">56</div><div style="line-height:130%">57</div><div style="line-height:130%">58</div><div style="line-height:130%">59</div><div style="line-height:130%">60</div><div style="line-height:130%">61</div><div style="line-height:130%">62</div><div style="line-height:130%">63</div><div style="line-height:130%">64</div><div style="line-height:130%">65</div><div style="line-height:130%">66</div><div style="line-height:130%">67</div><div style="line-height:130%">68</div><div style="line-height:130%">69</div><div style="line-height:130%">70</div><div style="line-height:130%">71</div><div style="line-height:130%">72</div><div style="line-height:130%">73</div><div style="line-height:130%">74</div><div style="line-height:130%">75</div><div style="line-height:130%">76</div><div style="line-height:130%">77</div><div style="line-height:130%">78</div><div style="line-height:130%">79</div><div style="line-height:130%">80</div><div style="line-height:130%">81</div><div style="line-height:130%">82</div><div style="line-height:130%">83</div><div style="line-height:130%">84</div><div style="line-height:130%">85</div><div style="line-height:130%">86</div><div style="line-height:130%">87</div><div style="line-height:130%">88</div><div style="line-height:130%">89</div><div style="line-height:130%">90</div><div style="line-height:130%">91</div><div style="line-height:130%">92</div><div style="line-height:130%">93</div><div style="line-height:130%">94</div><div style="line-height:130%">95</div><div style="line-height:130%">96</div><div style="line-height:130%">97</div><div style="line-height:130%">98</div><div style="line-height:130%">99</div><div style="line-height:130%">100</div><div style="line-height:130%">101</div><div style="line-height:130%">102</div><div style="line-height:130%">103</div><div style="line-height:130%">104</div><div style="line-height:130%">105</div><div style="line-height:130%">106</div><div style="line-height:130%">107</div><div style="line-height:130%">108</div><div style="line-height:130%">109</div><div style="line-height:130%">110</div><div style="line-height:130%">111</div><div style="line-height:130%">112</div><div style="line-height:130%">113</div><div style="line-height:130%">114</div><div style="line-height:130%">115</div><div style="line-height:130%">116</div><div style="line-height:130%">117</div><div style="line-height:130%">118</div><div style="line-height:130%">119</div><div style="line-height:130%">120</div><div style="line-height:130%">121</div><div style="line-height:130%">122</div><div style="line-height:130%">123</div><div style="line-height:130%">124</div><div style="line-height:130%">125</div><div style="line-height:130%">126</div><div style="line-height:130%">127</div><div style="line-height:130%">128</div><div style="line-height:130%">129</div><div style="line-height:130%">130</div><div style="line-height:130%">131</div><div style="line-height:130%">132</div><div style="line-height:130%">133</div><div style="line-height:130%">134</div><div style="line-height:130%">135</div><div style="line-height:130%">136</div><div style="line-height:130%">137</div><div style="line-height:130%">138</div><div style="line-height:130%">139</div><div style="line-height:130%">140</div><div style="line-height:130%">141</div><div style="line-height:130%">142</div><div style="line-height:130%">143</div><div style="line-height:130%">144</div><div style="line-height:130%">145</div><div style="line-height:130%">146</div><div style="line-height:130%">147</div><div style="line-height:130%">148</div><div style="line-height:130%">149</div><div style="line-height:130%">150</div><div style="line-height:130%">151</div><div style="line-height:130%">152</div><div style="line-height:130%">153</div><div style="line-height:130%">154</div><div style="line-height:130%">155</div><div style="line-height:130%">156</div><div style="line-height:130%">157</div><div style="line-height:130%">158</div><div style="line-height:130%">159</div><div style="line-height:130%">160</div><div style="line-height:130%">161</div><div style="line-height:130%">162</div><div style="line-height:130%">163</div><div style="line-height:130%">164</div><div style="line-height:130%">165</div><div style="line-height:130%">166</div><div style="line-height:130%">167</div><div style="line-height:130%">168</div><div style="line-height:130%">169</div><div style="line-height:130%">170</div><div style="line-height:130%">171</div><div style="line-height:130%">172</div><div style="line-height:130%">173</div><div style="line-height:130%">174</div><div style="line-height:130%">175</div><div style="line-height:130%">176</div><div style="line-height:130%">177</div><div style="line-height:130%">178</div><div style="line-height:130%">179</div><div style="line-height:130%">180</div><div style="line-height:130%">181</div><div style="line-height:130%">182</div><div style="line-height:130%">183</div><div style="line-height:130%">184</div><div style="line-height:130%">185</div><div style="line-height:130%">186</div><div style="line-height:130%">187</div><div style="line-height:130%">188</div><div style="line-height:130%">189</div><div style="line-height:130%">190</div><div style="line-height:130%">191</div><div style="line-height:130%">192</div><div style="line-height:130%">193</div><div style="line-height:130%">194</div><div style="line-height:130%">195</div><div style="line-height:130%">196</div><div style="line-height:130%">197</div><div style="line-height:130%">198</div><div style="line-height:130%">199</div><div style="line-height:130%">200</div><div style="line-height:130%">201</div></div></td><td style="padding:6px 0;text-align:left"><div style="margin:0;padding:0;color:#010101;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important;line-height:130%"><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"><%</span><span style="color:#0086b3">@</span> <span style="color:#0086b3">page</span> language<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span><span style="color:#63a35c">"java"</span> contentType<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span><span style="color:#63a35c">"text/html; charset=UTF-8"</span> pageEncoding<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span><span style="color:#63a35c">"UTF-8"</span><span style="color:#ff3399">%></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101"><</span><span style="color:#066de2">!DOCTYPE</span> <span style="color:#0a9989">html</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101"><</span><span style="color:#066de2">html</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101"><</span><span style="color:#066de2">head</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">meta</span> <span style="color:#0a9989">charset</span>=<span style="color:#df5000">"UTF-8"</span><span style="color:#0a9989"></span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">title</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">title</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">link</span> <span style="color:#0a9989">rel</span>=<span style="color:#df5000">"stylesheet"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">href</span>=<span style="color:#df5000">"https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css"</span><span style="color:#0a9989"></span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">script</span> <span style="color:#0a9989">src</span>=<span style="color:#df5000">"https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"</span><span style="color:#066de2"></span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">script</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">style</span><span style="color:#010101">></span><span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> .question </span>{<span style="color:#0099cc"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#0099cc"> margin-left</span><span style="color:#ff3399">:</span><span style="color:#0066cc"> 400px</span><span style="color:#ff3399">;</span><span style="color:#0066cc"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#0066cc"> </span>}</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">style</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">script</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#63a35c">'use strict'</span>;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#a71d5d">let</span> orgProducts <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> [];</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#a71d5d">let</span> products <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> []; <span style="color:#999999">//product price의 Number타입 배열 </span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#a71d5d">let</span> orgProductNames <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> [];</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#a71d5d">let</span> productNames <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> []; <span style="color:#999999">//product name의 문자타입 배열</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">//window.xxxxonload()와 같음</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> $(<span style="color:#066de2">document</span>).ready(<span style="color:#a71d5d">function</span>(){</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">//문제2) 문장 위치 변경</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> $(<span style="color:#63a35c">'#question'</span>).addClass(<span style="color:#63a35c">"question"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">//Number타입의 productPrice의 값을 가져와서 products배열 만들기 </span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> $(<span style="color:#63a35c">'#productsDiv input[name="productPrice"]'</span>).each((idx, product) <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span><span style="color:#ff3399"></span><span style="color:#a71d5d">></span> {</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#066de2">console</span>.log($(product).val());</div><div style="padding:0 6px; white-space:pre; line-height:130%"> products.push(<span style="color:#066de2">Number</span>($(product).val()));</div><div style="padding:0 6px; white-space:pre; line-height:130%"> orgProducts.push(<span style="color:#066de2">Number</span>($(product).val()));</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">//console.log(products.pop());</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> });</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">//product name의 값을 가져와서 productName배열 만들기 </span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> $(<span style="color:#63a35c">'#productsDiv label[name="productName"]'</span>).each((idx, <span style="color:#066de2">name</span>) <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span><span style="color:#ff3399"></span><span style="color:#a71d5d">></span> {</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#066de2">console</span>.log($(<span style="color:#066de2">name</span>).text());</div><div style="padding:0 6px; white-space:pre; line-height:130%"> productNames.push($(<span style="color:#066de2">name</span>).text());</div><div style="padding:0 6px; white-space:pre; line-height:130%"> orgProductNames.push($(<span style="color:#066de2">name</span>).text());</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">//console.log(productNames.pop());</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> });</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">//productPrice를 val()로 받아 배열로 저장하려고 하면, </span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">//productPrice의 첫번째 값을 가져온 값의 숫자가 1자씩 분할되어 배열로 저장됨ㅜㅜ</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">//그냥 위와 같이 productPrice를 each()로 돌린 값을 새로운 배열에 추가하기로 함ㅜㅜ</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">//let product = $('#productsDiv input[name="productPrice"]').val();//2500000 </span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">//console.log("받은 상품가격 : " + product);</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">// console.log("상품목록갯수:"+products.length);</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">// console.log('products[0]='+products[0]);//2</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">// console.log('products[1]='+products[1]);//5</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">// console.log('products[2]='+products[2]);//0</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">// $.each([ 52, 97 ], function( index, value ) {</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">// alert(‎ index + ": " + value );</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">// });</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> $(<span style="color:#63a35c">'#productsDiv input[name="btnAsending"]'</span>).click(<span style="color:#a71d5d">function</span>(){</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">//Selected Sort 알고리즘 오름차순정렬</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#a71d5d">let</span> temp <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> <span style="color:#0099cc">0</span>, tempName <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> <span style="color:#63a35c">''</span>;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> $.each(products, <span style="color:#a71d5d">function</span>(i, price){</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#a71d5d">if</span> (i <span style="color:#ff3399"></span><span style="color:#a71d5d"><</span> products.<span style="color:#066de2">length</span><span style="color:#a71d5d">-</span><span style="color:#0099cc">1</span>) {</div><div style="padding:0 6px; white-space:pre; line-height:130%"> $.each(products, <span style="color:#a71d5d">function</span>(j, price){</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#a71d5d">if</span> (j <span style="color:#ff3399"></span><span style="color:#a71d5d">></span><span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> (i<span style="color:#ff3399"></span><span style="color:#a71d5d">+</span><span style="color:#0099cc">1</span>)) {</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">//앞의 값이 뒤의 값보다 크면 서로 교체</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#a71d5d">if</span> (products[i] <span style="color:#ff3399"></span><span style="color:#a71d5d">></span> products[j]) {</div><div style="padding:0 6px; white-space:pre; line-height:130%"> temp <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> products[i];</div><div style="padding:0 6px; white-space:pre; line-height:130%"> products[i] <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> products[j];</div><div style="padding:0 6px; white-space:pre; line-height:130%"> products[j] <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> temp;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> tempName <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> productNames[i];</div><div style="padding:0 6px; white-space:pre; line-height:130%"> productNames[i] <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> productNames[j];</div><div style="padding:0 6px; white-space:pre; line-height:130%"> productNames[j] <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> tempName;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> }</div><div style="padding:0 6px; white-space:pre; line-height:130%"> }</div><div style="padding:0 6px; white-space:pre; line-height:130%"> });</div><div style="padding:0 6px; white-space:pre; line-height:130%"> }</div><div style="padding:0 6px; white-space:pre; line-height:130%"> });</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">//오름차순 정렬된 products배열 consol log출력확인</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> $.each(products, <span style="color:#a71d5d">function</span>(idx, price){</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#066de2">console</span>.log(price);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> });</div><div style="padding:0 6px; white-space:pre; line-height:130%"> form.action <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> <span style="color:#63a35c">'test03Ok.jsp?orgProducts='</span><span style="color:#ff3399"></span><span style="color:#a71d5d">+</span>orgProducts<span style="color:#ff3399"></span><span style="color:#a71d5d">+</span><span style="color:#63a35c">'&products='</span><span style="color:#ff3399"></span><span style="color:#a71d5d">+</span>products<span style="color:#ff3399"></span><span style="color:#a71d5d">+</span><span style="color:#63a35c">'&orgProductNames='</span><span style="color:#ff3399"></span><span style="color:#a71d5d">+</span>orgProductNames<span style="color:#ff3399"></span><span style="color:#a71d5d">+</span><span style="color:#63a35c">'&productNames='</span><span style="color:#ff3399"></span><span style="color:#a71d5d">+</span>productNames;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> form.submit();</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">//Array.sort(); //오름차순</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">// let idx = "";</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">// $.each(products.sort(), function(i, price){</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">// idx += ',' + i;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">// console.log(price);//Number타입의 배열인데도,숫자의 앞자리만으로 비교되어,정렬이 틀림</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">// });</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">// console.log('idx='+idx); //idx=0,1,2,3,4,5</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">//productNames</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">//products.sort()를 사용하면 producsts배열이 이미 sorted되어 이전idx의 변화를 알 수 없음ㅜㅜ</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">//그냥 selection sort 알고리즘을 사용하기로 함</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> });</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> $(<span style="color:#63a35c">'#productsDiv input[name="btnDesending"]'</span>).click(<span style="color:#a71d5d">function</span>(){</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">//Selected Sort 알고리즘 내림차순정렬</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#a71d5d">let</span> temp <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> <span style="color:#0099cc">0</span>, tempName <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> <span style="color:#63a35c">''</span>;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> $.each(products, <span style="color:#a71d5d">function</span>(i, price){</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#a71d5d">if</span> (i <span style="color:#ff3399"></span><span style="color:#a71d5d"><</span> products.<span style="color:#066de2">length</span><span style="color:#a71d5d">-</span><span style="color:#0099cc">1</span>) {</div><div style="padding:0 6px; white-space:pre; line-height:130%"> $.each(products, <span style="color:#a71d5d">function</span>(j, price){</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#a71d5d">if</span> (j <span style="color:#ff3399"></span><span style="color:#a71d5d">></span><span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> (i<span style="color:#ff3399"></span><span style="color:#a71d5d">+</span><span style="color:#0099cc">1</span>)) {</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">//앞의 값이 뒤의 값보다 작으면 서로 교체</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#a71d5d">if</span> (products[i] <span style="color:#ff3399"></span><span style="color:#a71d5d"><</span> products[j]) {</div><div style="padding:0 6px; white-space:pre; line-height:130%"> temp <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> products[i];</div><div style="padding:0 6px; white-space:pre; line-height:130%"> products[i] <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> products[j];</div><div style="padding:0 6px; white-space:pre; line-height:130%"> products[j] <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> temp;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> tempName <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> productNames[i];</div><div style="padding:0 6px; white-space:pre; line-height:130%"> productNames[i] <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> productNames[j];</div><div style="padding:0 6px; white-space:pre; line-height:130%"> productNames[j] <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> tempName;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> }</div><div style="padding:0 6px; white-space:pre; line-height:130%"> }</div><div style="padding:0 6px; white-space:pre; line-height:130%"> });</div><div style="padding:0 6px; white-space:pre; line-height:130%"> }</div><div style="padding:0 6px; white-space:pre; line-height:130%"> });</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">//내림차순 정렬된 products배열 consol log출력확인</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> $.each(products, <span style="color:#a71d5d">function</span>(idx, price){</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#066de2">console</span>.log(price);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> });</div><div style="padding:0 6px; white-space:pre; line-height:130%"> form.action <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> <span style="color:#63a35c">'test03Ok.jsp?orgProducts='</span><span style="color:#ff3399"></span><span style="color:#a71d5d">+</span>orgProducts<span style="color:#ff3399"></span><span style="color:#a71d5d">+</span><span style="color:#63a35c">'&products='</span><span style="color:#ff3399"></span><span style="color:#a71d5d">+</span>products<span style="color:#ff3399"></span><span style="color:#a71d5d">+</span><span style="color:#63a35c">'&orgProductNames='</span><span style="color:#ff3399"></span><span style="color:#a71d5d">+</span>orgProductNames<span style="color:#ff3399"></span><span style="color:#a71d5d">+</span><span style="color:#63a35c">'&productNames='</span><span style="color:#ff3399"></span><span style="color:#a71d5d">+</span>productNames;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> form.submit();</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">//console.log( $(products).toArray().reverse());</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">//products.reverse(); //내림차순</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">// let idx = '';</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">// $.each(products.reverse(), function(i, price){</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">// idx += ',' + i;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">// console.log(price);//Number타입의 배열인데도,숫자의 앞자리만으로 비교되어,정렬이 틀림</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">// });</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">// console.log('idx='+idx); //idx=0,1,2,3,4,5</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">//productNames</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">//products.reverse()를 사용하면 producsts배열이 이미 sorted되어 이전idx의 변화를 알 수 없음ㅜㅜ</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">//그냥 selection sort 알고리즘을 사용하기로 함</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> });</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#999999">/* function check() {</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#999999"> $.isNumeric(); //이미 Number()함수로 products배열의 값을 숫자타입으로 바꿔서 생략함</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#999999"> }</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#999999"> */</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">//콤마 추가</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">// function numberWithCommas(num) {</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">// return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#999999">// }</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> });</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">script</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">head</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101"><</span><span style="color:#066de2">body</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101"><</span><span style="color:#066de2">p</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#066de2">br</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">p</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101"><</span><span style="color:#066de2">div</span> <span style="color:#0a9989">id</span>=<span style="color:#df5000">"question"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"container"</span><span style="color:#0a9989"></span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101"><</span><span style="color:#066de2">pre</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%">문제2) 폼을 통해서 상품명과 상품 가격을 6개를 입력받아, 가격순으로 오름차순/내림차순 정렬처리 후 출력</div><div style="padding:0 6px; white-space:pre; line-height:130%">- 서블릿 없이 Jsp화면만으로 구현하기</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%">구현 파일 : jsp</div><div style="padding:0 6px; white-space:pre; line-height:130%">파일명 : test03Ok.jsp</div><div style="padding:0 6px; white-space:pre; line-height:130%">폼태그 내용은 미리 value값에 저장시켜놓는다</div><div style="padding:0 6px; white-space:pre; line-height:130%">버튼 : '오름차순'/'내림차순'/'돌아가기'</div><div style="padding:0 6px; white-space:pre; line-height:130%">출력시에는 원본자료와 정렬된 자료를 모두 출력</div><div style="padding:0 6px; white-space:pre; line-height:130%">완성 후 화면을 예쁘게 꾸며보세요(bs4사용)</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">pre</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">div</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101"><</span><span style="color:#066de2">div</span> <span style="color:#0a9989">id</span>=<span style="color:#df5000">"productsDiv"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">align</span>=<span style="color:#df5000">"center"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"container"</span><span style="color:#0a9989"></span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#066de2">br</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">form</span> <span style="color:#0a9989">name</span>=<span style="color:#df5000">"form"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">method</span>=<span style="color:#df5000">"post"</span><span style="color:#0a9989"></span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">table</span> <span style="color:#0a9989">width</span>=<span style="color:#df5000">"500px"</span><span style="color:#0a9989"></span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">tr</span> <span style="color:#0a9989">height</span>=<span style="color:#df5000">"50px"</span><span style="color:#0a9989"></span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">th</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#066de2">div</span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">align</span>=<span style="color:#df5000">"center"</span><span style="color:#0a9989"></span><span style="color:#010101">></span>상품명<span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">div</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">th</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">th</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#066de2">div</span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">align</span>=<span style="color:#df5000">"center"</span><span style="color:#0a9989"></span><span style="color:#010101">></span>상품가격<span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">div</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">th</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">tr</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">tr</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">td</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#066de2">label</span> <span style="color:#0a9989">for</span>=<span style="color:#df5000">"productPrice1"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">name</span>=<span style="color:#df5000">"productName"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span><span style="color:#010101">></span>냉장고<span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">label</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">td</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#066de2">input</span> <span style="color:#0a9989">type</span>=<span style="color:#df5000">"number"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">name</span>=<span style="color:#df5000">"productPrice"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">id</span>=<span style="color:#df5000">"productPrice1"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">value</span>=<span style="color:#df5000">"2500000"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"form-control"</span><span style="color:#0a9989">/</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">tr</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">tr</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">td</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#066de2">label</span> <span style="color:#0a9989">for</span>=<span style="color:#df5000">"productPrice2"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">name</span>=<span style="color:#df5000">"productName"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span><span style="color:#010101">></span>TV<span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">label</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">td</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#066de2">input</span> <span style="color:#0a9989">type</span>=<span style="color:#df5000">"number"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">name</span>=<span style="color:#df5000">"productPrice"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">id</span>=<span style="color:#df5000">"productPrice2"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">value</span>=<span style="color:#df5000">"102000"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"form-control"</span><span style="color:#0a9989">/</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">tr</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">tr</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">td</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#066de2">label</span> <span style="color:#0a9989">for</span>=<span style="color:#df5000">"productPrice3"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">name</span>=<span style="color:#df5000">"productName"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span><span style="color:#010101">></span>전기포트<span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">label</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">td</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#066de2">input</span> <span style="color:#0a9989">type</span>=<span style="color:#df5000">"number"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">name</span>=<span style="color:#df5000">"productPrice"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">id</span>=<span style="color:#df5000">"productPrice3"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">value</span>=<span style="color:#df5000">"50000"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"form-control"</span><span style="color:#0a9989">/</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">tr</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">tr</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">td</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#066de2">label</span> <span style="color:#0a9989">for</span>=<span style="color:#df5000">"productPrice4"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">name</span>=<span style="color:#df5000">"productName"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span><span style="color:#010101">></span>선풍기<span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">label</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">td</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#066de2">input</span> <span style="color:#0a9989">type</span>=<span style="color:#df5000">"number"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">name</span>=<span style="color:#df5000">"productPrice"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">id</span>=<span style="color:#df5000">"productPrice4"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">value</span>=<span style="color:#df5000">"100000"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"form-control"</span><span style="color:#0a9989">/</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">tr</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">tr</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">td</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#066de2">label</span> <span style="color:#0a9989">for</span>=<span style="color:#df5000">"productPrice5"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">name</span>=<span style="color:#df5000">"productName"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span><span style="color:#010101">></span>헤어드라이어<span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">label</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">td</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#066de2">input</span> <span style="color:#0a9989">type</span>=<span style="color:#df5000">"number"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">name</span>=<span style="color:#df5000">"productPrice"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">id</span>=<span style="color:#df5000">"productPrice5"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">value</span>=<span style="color:#df5000">"80000"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"form-control"</span><span style="color:#0a9989">/</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">tr</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">tr</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">td</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#066de2">label</span> <span style="color:#0a9989">for</span>=<span style="color:#df5000">"productPrice6"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">name</span>=<span style="color:#df5000">"productName"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span><span style="color:#010101">></span>전자랜지<span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">label</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">td</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#066de2">input</span> <span style="color:#0a9989">type</span>=<span style="color:#df5000">"number"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">name</span>=<span style="color:#df5000">"productPrice"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">id</span>=<span style="color:#df5000">"productPrice6"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">value</span>=<span style="color:#df5000">"500000"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"form-control"</span><span style="color:#0a9989">/</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">tr</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">tr</span> <span style="color:#0a9989">height</span>=<span style="color:#df5000">"100px"</span><span style="color:#0a9989"></span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">td</span> <span style="color:#0a9989">colspan</span>=<span style="color:#df5000">"2"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">align</span>=<span style="color:#df5000">"center"</span><span style="color:#0a9989"></span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">input</span> <span style="color:#0a9989">type</span>=<span style="color:#df5000">"button"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">name</span>=<span style="color:#df5000">"btnAsending"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">value</span>=<span style="color:#df5000">"오름차순"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"btn btn-success m-2"</span><span style="color:#0a9989">/</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">input</span> <span style="color:#0a9989">type</span>=<span style="color:#df5000">"button"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">name</span>=<span style="color:#df5000">"btnDesending"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">value</span>=<span style="color:#df5000">"내림차순"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"btn btn-success m-2"</span><span style="color:#0a9989">/</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">input</span> <span style="color:#0a9989">type</span>=<span style="color:#df5000">"reset"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">value</span>=<span style="color:#df5000">"취소"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"btn btn-success m-2"</span><span style="color:#0a9989">/</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">tr</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">table</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">form</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">div</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">div</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">body</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">html</span><span style="color:#010101">></span></div></div><div style="text-align:right;margin-top:-13px;margin-right:5px;font-size:9px;font-style:italic"><a href="http://colorscripter.com/info#e" target="_blank" style="color:#e5e5e5text-decoration:none">Colored by Color Scripter</a></div></td><td style="vertical-align:bottom;padding:0 2px 4px 0"><a href="http://colorscripter.com/info#e" target="_blank" style="text-decoration:none;color:white"><span style="font-size:9px;word-break:normal;background-color:#e5e5e5;color:white;border-radius:10px;padding:1px">cs</span></a></td></tr></table></div></div></div><p> </p><div class="figure-html" data-ke-type="html" data-source="<div class="colorscripter-code" style="color:#010101;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important; position:relative !important;overflow:auto"><table class="colorscripter-code-table" style="margin:0;padding:0;border:none;background-color:#fafafa;border-radius:4px;" cellspacing="0" cellpadding="0"><tr><td style="padding:6px;border-right:2px solid #e5e5e5"><div style="margin:0;padding:0;word-break:normal;text-align:right;color:#666;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important;line-height:130%"><div style="line-height:130%">1</div><div style="line-height:130%">2</div><div style="line-height:130%">3</div><div style="line-height:130%">4</div><div style="line-height:130%">5</div><div style="line-height:130%">6</div><div style="line-height:130%">7</div><div style="line-height:130%">8</div><div style="line-height:130%">9</div><div style="line-height:130%">10</div><div style="line-height:130%">11</div><div style="line-height:130%">12</div><div style="line-height:130%">13</div><div style="line-height:130%">14</div><div style="line-height:130%">15</div><div style="line-height:130%">16</div><div style="line-height:130%">17</div><div style="line-height:130%">18</div><div style="line-height:130%">19</div><div style="line-height:130%">20</div><div style="line-height:130%">21</div><div style="line-height:130%">22</div><div style="line-height:130%">23</div><div style="line-height:130%">24</div><div style="line-height:130%">25</div><div style="line-height:130%">26</div><div style="line-height:130%">27</div><div style="line-height:130%">28</div><div style="line-height:130%">29</div><div style="line-height:130%">30</div><div style="line-height:130%">31</div><div style="line-height:130%">32</div><div style="line-height:130%">33</div><div style="line-height:130%">34</div><div style="line-height:130%">35</div><div style="line-height:130%">36</div><div style="line-height:130%">37</div><div style="line-height:130%">38</div><div style="line-height:130%">39</div><div style="line-height:130%">40</div><div style="line-height:130%">41</div><div style="line-height:130%">42</div><div style="line-height:130%">43</div><div style="line-height:130%">44</div><div style="line-height:130%">45</div><div style="line-height:130%">46</div><div style="line-height:130%">47</div><div style="line-height:130%">48</div><div style="line-height:130%">49</div><div style="line-height:130%">50</div><div style="line-height:130%">51</div><div style="line-height:130%">52</div><div style="line-height:130%">53</div><div style="line-height:130%">54</div><div style="line-height:130%">55</div><div style="line-height:130%">56</div><div style="line-height:130%">57</div><div style="line-height:130%">58</div><div style="line-height:130%">59</div><div style="line-height:130%">60</div><div style="line-height:130%">61</div><div style="line-height:130%">62</div><div style="line-height:130%">63</div><div style="line-height:130%">64</div><div style="line-height:130%">65</div><div style="line-height:130%">66</div><div style="line-height:130%">67</div><div style="line-height:130%">68</div><div style="line-height:130%">69</div><div style="line-height:130%">70</div><div style="line-height:130%">71</div><div style="line-height:130%">72</div><div style="line-height:130%">73</div><div style="line-height:130%">74</div><div style="line-height:130%">75</div><div style="line-height:130%">76</div><div style="line-height:130%">77</div><div style="line-height:130%">78</div><div style="line-height:130%">79</div><div style="line-height:130%">80</div><div style="line-height:130%">81</div><div style="line-height:130%">82</div><div style="line-height:130%">83</div><div style="line-height:130%">84</div></div></td><td style="padding:6px 0;text-align:left"><div style="margin:0;padding:0;color:#010101;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important;line-height:130%"><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&lt;%</span>@page&nbsp;<span style="color:#0086b3">import</span><span style="color:#a71d5d">=</span><span style="color:#63a35c">"org.apache.jasper.tagplugins.jstl.core.ForEach"</span><span style="color:#ff3399">%&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&lt;%</span><span style="color:#0086b3">@</span>&nbsp;<span style="color:#0086b3">page</span>&nbsp;language<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span><span style="color:#63a35c">"java"</span>&nbsp;contentType<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span><span style="color:#63a35c">"text/html;&nbsp;charset=UTF-8"</span>&nbsp;pageEncoding<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span><span style="color:#63a35c">"UTF-8"</span><span style="color:#ff3399">%&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&lt;%</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#999999">//Get방식은&nbsp;request의&nbsp;파라미터값이&nbsp;모두&nbsp;String타입으로&nbsp;바뀌어&nbsp;있음</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#066de2">String</span>&nbsp;orgProductName&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;request.getParameter(<span style="color:#63a35c">"orgProductNames"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#066de2">String</span>&nbsp;productName&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;request.getParameter(<span style="color:#63a35c">"productNames"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#066de2">String</span>&nbsp;orgProduct&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;request.getParameter(<span style="color:#63a35c">"orgProducts"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#066de2">String</span>&nbsp;product&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;request.getParameter(<span style="color:#63a35c">"products"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#066de2">System</span>.<span style="color:#066de2">out</span>.<span style="color:#066de2">println</span>(<span style="color:#63a35c">"orgProductName="</span>&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">+</span>&nbsp;orgProductName);</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#066de2">System</span>.<span style="color:#066de2">out</span>.<span style="color:#066de2">println</span>(<span style="color:#63a35c">"productName="</span>&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">+</span>&nbsp;productName);</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#066de2">System</span>.<span style="color:#066de2">out</span>.<span style="color:#066de2">println</span>(<span style="color:#63a35c">"orgProducts="</span>&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">+</span>&nbsp;orgProduct);</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#066de2">System</span>.<span style="color:#066de2">out</span>.<span style="color:#066de2">println</span>(<span style="color:#63a35c">"product="</span>&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">+</span>&nbsp;product);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#066de2">String</span>[]&nbsp;orgProductNames&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;orgProductName.<span style="color:#066de2">split</span>(<span style="color:#63a35c">","</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#066de2">String</span>[]&nbsp;productNames&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;productName.<span style="color:#066de2">split</span>(<span style="color:#63a35c">","</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#066de2">String</span>[]&nbsp;orgProducts&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;orgProduct.<span style="color:#066de2">split</span>(<span style="color:#63a35c">","</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#066de2">String</span>[]&nbsp;products&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;product.<span style="color:#066de2">split</span>(<span style="color:#63a35c">","</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">%&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101">&lt;</span><span style="color:#066de2">!DOCTYPE</span>&nbsp;<span style="color:#0a9989">html</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101">&lt;</span><span style="color:#066de2">html</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101">&lt;</span><span style="color:#066de2">head</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">meta</span>&nbsp;<span style="color:#0a9989">charset</span>=<span style="color:#df5000">"UTF-8"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">title</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">title</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">link</span>&nbsp;<span style="color:#0a9989">rel</span>=<span style="color:#df5000">"stylesheet"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">href</span>=<span style="color:#df5000">"https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">script</span>&nbsp;<span style="color:#0a9989">src</span>=<span style="color:#df5000">"https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"</span><span style="color:#066de2"></span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">script</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">style</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">style</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">script</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#63a35c">'use&nbsp;strict'</span>;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">script</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">head</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101">&lt;</span><span style="color:#066de2">body</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101">&lt;</span><span style="color:#066de2">p</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#066de2">br</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">p</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101">&lt;</span><span style="color:#066de2">div</span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"container"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">table</span>&nbsp;<span style="color:#0a9989">cellpadding</span>=<span style="color:#df5000">"10px"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">tr</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">td</span>&nbsp;<span style="color:#0a9989">width</span>=<span style="color:#df5000">"500px"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">valign</span>=<span style="color:#df5000">"top"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">table</span>&nbsp;<span style="color:#0a9989">id</span>=<span style="color:#df5000">'tblOrgProduct'</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">align</span>=<span style="color:#df5000">"center"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">width</span>=<span style="color:#df5000">"500px"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">caption</span><span style="color:#010101">&gt;</span>원본&nbsp;상품&nbsp;목록<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">caption</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">tr</span>&nbsp;<span style="color:#0a9989">height</span>=<span style="color:#df5000">"50px"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">th</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#066de2">div</span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">align</span>=<span style="color:#df5000">"center"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span>상품명<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">div</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">th</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">th</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#066de2">div</span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">align</span>=<span style="color:#df5000">"center"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span>상품가격<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">div</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">th</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">tr</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&lt;%</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#066de2">int</span>&nbsp;idx&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">-</span><span style="color:#0099cc">1</span>;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a71d5d">for</span>&nbsp;(<span style="color:#066de2">String</span>&nbsp;orgProductNM&nbsp;:&nbsp;orgProductNames)&nbsp;{&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;idx<span style="color:#ff3399"></span><span style="color:#a71d5d">+</span><span style="color:#ff3399"></span><span style="color:#a71d5d">+</span>;</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">%&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">tr</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#066de2">div</span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span><span style="color:#ff3399">&lt;%</span><span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>orgProductNM<span style="color:#ff3399">%&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">div</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#066de2">div</span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">div</span><span style="color:#010101">&gt;</span><span style="color:#ff3399">&lt;%</span><span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>orgProducts[idx]<span style="color:#ff3399">%&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">div</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">tr</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&lt;%</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;<span style="color:#ff3399">%&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">table</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">td</span>&nbsp;<span style="color:#0a9989">width</span>=<span style="color:#df5000">"50px"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">div</span>&nbsp;<span style="color:#0a9989">align</span>=<span style="color:#df5000">"center"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span>&nbsp;&gt;&gt;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">div</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">td</span>&nbsp;<span style="color:#0a9989">width</span>=<span style="color:#df5000">"500px"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">table</span>&nbsp;<span style="color:#0a9989">align</span>=<span style="color:#df5000">"center"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">width</span>=<span style="color:#df5000">"500px"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">caption</span><span style="color:#010101">&gt;</span>정렬된&nbsp;상품&nbsp;목록<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">caption</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">tr</span>&nbsp;<span style="color:#0a9989">height</span>=<span style="color:#df5000">"50px"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">th</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#066de2">div</span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">align</span>=<span style="color:#df5000">"center"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span>상품명<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">div</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">th</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">th</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#066de2">div</span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">align</span>=<span style="color:#df5000">"center"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span>상품가격<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">div</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">th</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">tr</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&lt;%</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;idx&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>&nbsp;<span style="color:#ff3399"></span><span style="color:#a71d5d">-</span><span style="color:#0099cc">1</span>;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a71d5d">for</span>&nbsp;(<span style="color:#066de2">String</span>&nbsp;productNM&nbsp;:&nbsp;productNames)&nbsp;{&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;idx<span style="color:#ff3399"></span><span style="color:#a71d5d">+</span><span style="color:#ff3399"></span><span style="color:#a71d5d">+</span>;</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">%&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">tr</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#066de2">label</span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span><span style="color:#ff3399">&lt;%</span><span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>productNM<span style="color:#ff3399">%&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">label</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#066de2">input</span>&nbsp;<span style="color:#0a9989">type</span>=<span style="color:#df5000">"number"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">name</span>=<span style="color:#df5000">"productPrice"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">value</span>=<span style="color:#df5000">"&lt;%=products[idx]%&gt;"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"form-control"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">disabled/</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">tr</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&lt;%</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">%&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">table</span><span style="color:#010101">&gt;</span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">tr</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">table</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">div</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101">&lt;</span><span style="color:#066de2">br</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#066de2">br</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#066de2">br</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101">&lt;</span><span style="color:#066de2">div</span>&nbsp;<span style="color:#0a9989">align</span>=<span style="color:#df5000">"center"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"container"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#010101">&lt;</span><span style="color:#066de2">a</span>&nbsp;<span style="color:#0a9989">href</span>=<span style="color:#df5000">"test03.jsp"</span><span style="color:#0a9989"></span>&nbsp;<span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#066de2">h2</span><span style="color:#010101">&gt;</span>&lt;<span style="color:#010101">&lt;</span><span style="color:#066de2"></span>&nbsp;뒤로가기<span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">h2</span><span style="color:#010101">&gt;</span><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">a</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">div</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">body</span><span style="color:#010101">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101">&lt;</span><span style="color:#010101">/</span><span style="color:#066de2">html</span><span style="color:#010101">&gt;</span></div></div><div style="text-align:right;margin-top:-13px;margin-right:5px;font-size:9px;font-style:italic"><a href="http://colorscripter.com/info#e" target="_blank" style="color:#e5e5e5text-decoration:none">Colored by Color Scripter</a></div></td><td style="vertical-align:bottom;padding:0 2px 4px 0"><a href="http://colorscripter.com/info#e" target="_blank" style="text-decoration:none;color:white"><span style="font-size:9px;word-break:normal;background-color:#e5e5e5;color:white;border-radius:10px;padding:1px">cs</span></a></td></tr></table></div>"><div data-ke-class="article"><div class="colorscripter-code" style="color:#010101;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important; position:relative !important;overflow:auto"><table class="colorscripter-code-table" style="margin:0;padding:0;border:none;background-color:#fafafa;border-radius:4px;" cellspacing="0" cellpadding="0"><tr><td style="padding:6px;border-right:2px solid #e5e5e5"><div style="margin:0;padding:0;word-break:normal;text-align:right;color:#666;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important;line-height:130%"><div style="line-height:130%">1</div><div style="line-height:130%">2</div><div style="line-height:130%">3</div><div style="line-height:130%">4</div><div style="line-height:130%">5</div><div style="line-height:130%">6</div><div style="line-height:130%">7</div><div style="line-height:130%">8</div><div style="line-height:130%">9</div><div style="line-height:130%">10</div><div style="line-height:130%">11</div><div style="line-height:130%">12</div><div style="line-height:130%">13</div><div style="line-height:130%">14</div><div style="line-height:130%">15</div><div style="line-height:130%">16</div><div style="line-height:130%">17</div><div style="line-height:130%">18</div><div style="line-height:130%">19</div><div style="line-height:130%">20</div><div style="line-height:130%">21</div><div style="line-height:130%">22</div><div style="line-height:130%">23</div><div style="line-height:130%">24</div><div style="line-height:130%">25</div><div style="line-height:130%">26</div><div style="line-height:130%">27</div><div style="line-height:130%">28</div><div style="line-height:130%">29</div><div style="line-height:130%">30</div><div style="line-height:130%">31</div><div style="line-height:130%">32</div><div style="line-height:130%">33</div><div style="line-height:130%">34</div><div style="line-height:130%">35</div><div style="line-height:130%">36</div><div style="line-height:130%">37</div><div style="line-height:130%">38</div><div style="line-height:130%">39</div><div style="line-height:130%">40</div><div style="line-height:130%">41</div><div style="line-height:130%">42</div><div style="line-height:130%">43</div><div style="line-height:130%">44</div><div style="line-height:130%">45</div><div style="line-height:130%">46</div><div style="line-height:130%">47</div><div style="line-height:130%">48</div><div style="line-height:130%">49</div><div style="line-height:130%">50</div><div style="line-height:130%">51</div><div style="line-height:130%">52</div><div style="line-height:130%">53</div><div style="line-height:130%">54</div><div style="line-height:130%">55</div><div style="line-height:130%">56</div><div style="line-height:130%">57</div><div style="line-height:130%">58</div><div style="line-height:130%">59</div><div style="line-height:130%">60</div><div style="line-height:130%">61</div><div style="line-height:130%">62</div><div style="line-height:130%">63</div><div style="line-height:130%">64</div><div style="line-height:130%">65</div><div style="line-height:130%">66</div><div style="line-height:130%">67</div><div style="line-height:130%">68</div><div style="line-height:130%">69</div><div style="line-height:130%">70</div><div style="line-height:130%">71</div><div style="line-height:130%">72</div><div style="line-height:130%">73</div><div style="line-height:130%">74</div><div style="line-height:130%">75</div><div style="line-height:130%">76</div><div style="line-height:130%">77</div><div style="line-height:130%">78</div><div style="line-height:130%">79</div><div style="line-height:130%">80</div><div style="line-height:130%">81</div><div style="line-height:130%">82</div><div style="line-height:130%">83</div><div style="line-height:130%">84</div></div></td><td style="padding:6px 0;text-align:left"><div style="margin:0;padding:0;color:#010101;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important;line-height:130%"><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"><%</span>@page <span style="color:#0086b3">import</span><span style="color:#a71d5d">=</span><span style="color:#63a35c">"org.apache.jasper.tagplugins.jstl.core.ForEach"</span><span style="color:#ff3399">%></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"><%</span><span style="color:#0086b3">@</span> <span style="color:#0086b3">page</span> language<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span><span style="color:#63a35c">"java"</span> contentType<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span><span style="color:#63a35c">"text/html; charset=UTF-8"</span> pageEncoding<span style="color:#ff3399"></span><span style="color:#a71d5d">=</span><span style="color:#63a35c">"UTF-8"</span><span style="color:#ff3399">%></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"><%</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#999999">//Get방식은 request의 파라미터값이 모두 String타입으로 바뀌어 있음</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#066de2">String</span> orgProductName <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> request.getParameter(<span style="color:#63a35c">"orgProductNames"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#066de2">String</span> productName <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> request.getParameter(<span style="color:#63a35c">"productNames"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#066de2">String</span> orgProduct <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> request.getParameter(<span style="color:#63a35c">"orgProducts"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#066de2">String</span> product <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> request.getParameter(<span style="color:#63a35c">"products"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#066de2">System</span>.<span style="color:#066de2">out</span>.<span style="color:#066de2">println</span>(<span style="color:#63a35c">"orgProductName="</span> <span style="color:#ff3399"></span><span style="color:#a71d5d">+</span> orgProductName);</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#066de2">System</span>.<span style="color:#066de2">out</span>.<span style="color:#066de2">println</span>(<span style="color:#63a35c">"productName="</span> <span style="color:#ff3399"></span><span style="color:#a71d5d">+</span> productName);</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#066de2">System</span>.<span style="color:#066de2">out</span>.<span style="color:#066de2">println</span>(<span style="color:#63a35c">"orgProducts="</span> <span style="color:#ff3399"></span><span style="color:#a71d5d">+</span> orgProduct);</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#066de2">System</span>.<span style="color:#066de2">out</span>.<span style="color:#066de2">println</span>(<span style="color:#63a35c">"product="</span> <span style="color:#ff3399"></span><span style="color:#a71d5d">+</span> product);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#066de2">String</span>[] orgProductNames <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> orgProductName.<span style="color:#066de2">split</span>(<span style="color:#63a35c">","</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#066de2">String</span>[] productNames <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> productName.<span style="color:#066de2">split</span>(<span style="color:#63a35c">","</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#066de2">String</span>[] orgProducts <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> orgProduct.<span style="color:#066de2">split</span>(<span style="color:#63a35c">","</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#066de2">String</span>[] products <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> product.<span style="color:#066de2">split</span>(<span style="color:#63a35c">","</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">%></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101"><</span><span style="color:#066de2">!DOCTYPE</span> <span style="color:#0a9989">html</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101"><</span><span style="color:#066de2">html</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101"><</span><span style="color:#066de2">head</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">meta</span> <span style="color:#0a9989">charset</span>=<span style="color:#df5000">"UTF-8"</span><span style="color:#0a9989"></span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">title</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">title</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">link</span> <span style="color:#0a9989">rel</span>=<span style="color:#df5000">"stylesheet"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">href</span>=<span style="color:#df5000">"https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css"</span><span style="color:#0a9989"></span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">script</span> <span style="color:#0a9989">src</span>=<span style="color:#df5000">"https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"</span><span style="color:#066de2"></span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">script</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">style</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">style</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">script</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#63a35c">'use strict'</span>;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">script</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">head</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101"><</span><span style="color:#066de2">body</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101"><</span><span style="color:#066de2">p</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#066de2">br</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">p</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101"><</span><span style="color:#066de2">div</span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"container"</span><span style="color:#0a9989"></span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">table</span> <span style="color:#0a9989">cellpadding</span>=<span style="color:#df5000">"10px"</span><span style="color:#0a9989"></span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">tr</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">td</span> <span style="color:#0a9989">width</span>=<span style="color:#df5000">"500px"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">valign</span>=<span style="color:#df5000">"top"</span><span style="color:#0a9989"></span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">table</span> <span style="color:#0a9989">id</span>=<span style="color:#df5000">'tblOrgProduct'</span><span style="color:#0a9989"></span> <span style="color:#0a9989">align</span>=<span style="color:#df5000">"center"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">width</span>=<span style="color:#df5000">"500px"</span><span style="color:#0a9989"></span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">caption</span><span style="color:#010101">></span>원본 상품 목록<span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">caption</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">tr</span> <span style="color:#0a9989">height</span>=<span style="color:#df5000">"50px"</span><span style="color:#0a9989"></span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">th</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#066de2">div</span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">align</span>=<span style="color:#df5000">"center"</span><span style="color:#0a9989"></span><span style="color:#010101">></span>상품명<span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">div</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">th</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">th</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#066de2">div</span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">align</span>=<span style="color:#df5000">"center"</span><span style="color:#0a9989"></span><span style="color:#010101">></span>상품가격<span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">div</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">th</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">tr</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"><%</span> <span style="color:#066de2">int</span> idx <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> <span style="color:#ff3399"></span><span style="color:#a71d5d">-</span><span style="color:#0099cc">1</span>;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#a71d5d">for</span> (<span style="color:#066de2">String</span> orgProductNM : orgProductNames) { </div><div style="padding:0 6px; white-space:pre; line-height:130%"> idx<span style="color:#ff3399"></span><span style="color:#a71d5d">+</span><span style="color:#ff3399"></span><span style="color:#a71d5d">+</span>;</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">%></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">tr</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">td</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#066de2">div</span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span><span style="color:#010101">></span><span style="color:#ff3399"><%</span><span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>orgProductNM<span style="color:#ff3399">%></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">div</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">td</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#066de2">div</span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">div</span><span style="color:#010101">></span><span style="color:#ff3399"><%</span><span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>orgProducts[idx]<span style="color:#ff3399">%></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">div</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">tr</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"><%</span> } <span style="color:#ff3399">%></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">table</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">td</span> <span style="color:#0a9989">width</span>=<span style="color:#df5000">"50px"</span><span style="color:#0a9989"></span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">div</span> <span style="color:#0a9989">align</span>=<span style="color:#df5000">"center"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span><span style="color:#010101">></span> >> <span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">div</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">td</span> <span style="color:#0a9989">width</span>=<span style="color:#df5000">"500px"</span><span style="color:#0a9989"></span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">table</span> <span style="color:#0a9989">align</span>=<span style="color:#df5000">"center"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">width</span>=<span style="color:#df5000">"500px"</span><span style="color:#0a9989"></span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">caption</span><span style="color:#010101">></span>정렬된 상품 목록<span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">caption</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">tr</span> <span style="color:#0a9989">height</span>=<span style="color:#df5000">"50px"</span><span style="color:#0a9989"></span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">th</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#066de2">div</span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">align</span>=<span style="color:#df5000">"center"</span><span style="color:#0a9989"></span><span style="color:#010101">></span>상품명<span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">div</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">th</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">th</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#066de2">div</span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">align</span>=<span style="color:#df5000">"center"</span><span style="color:#0a9989"></span><span style="color:#010101">></span>상품가격<span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">div</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">th</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">tr</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"><%</span> idx <span style="color:#ff3399"></span><span style="color:#a71d5d">=</span> <span style="color:#ff3399"></span><span style="color:#a71d5d">-</span><span style="color:#0099cc">1</span>;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#a71d5d">for</span> (<span style="color:#066de2">String</span> productNM : productNames) { </div><div style="padding:0 6px; white-space:pre; line-height:130%"> idx<span style="color:#ff3399"></span><span style="color:#a71d5d">+</span><span style="color:#ff3399"></span><span style="color:#a71d5d">+</span>;</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">%></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">tr</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">td</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#066de2">label</span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span><span style="color:#010101">></span><span style="color:#ff3399"><%</span><span style="color:#ff3399"></span><span style="color:#a71d5d">=</span>productNM<span style="color:#ff3399">%></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">label</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">td</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#066de2">input</span> <span style="color:#0a9989">type</span>=<span style="color:#df5000">"number"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">name</span>=<span style="color:#df5000">"productPrice"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">value</span>=<span style="color:#df5000">"<%=products[idx]%>"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"form-control"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">disabled/</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">tr</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"><%</span> } </div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">%></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">table</span><span style="color:#010101">></span> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">td</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">tr</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">table</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">div</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101"><</span><span style="color:#066de2">br</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#066de2">br</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#066de2">br</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101"><</span><span style="color:#066de2">div</span> <span style="color:#0a9989">align</span>=<span style="color:#df5000">"center"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"container"</span><span style="color:#0a9989"></span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#010101"><</span><span style="color:#066de2">a</span> <span style="color:#0a9989">href</span>=<span style="color:#df5000">"test03.jsp"</span><span style="color:#0a9989"></span> <span style="color:#0a9989">class</span>=<span style="color:#df5000">"col"</span><span style="color:#0a9989"></span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#066de2">h2</span><span style="color:#010101">></span><<span style="color:#010101"><</span><span style="color:#066de2"></span> 뒤로가기<span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">h2</span><span style="color:#010101">></span><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">a</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">div</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">body</span><span style="color:#010101">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#010101"><</span><span style="color:#010101">/</span><span style="color:#066de2">html</span><span style="color:#010101">></span></div></div><div style="text-align:right;margin-top:-13px;margin-right:5px;font-size:9px;font-style:italic"><a href="http://colorscripter.com/info#e" target="_blank" style="color:#e5e5e5text-decoration:none">Colored by Color Scripter</a></div></td><td style="vertical-align:bottom;padding:0 2px 4px 0"><a href="http://colorscripter.com/info#e" target="_blank" style="text-decoration:none;color:white"><span style="font-size:9px;word-break:normal;background-color:#e5e5e5;color:white;border-radius:10px;padding:1px">cs</span></a></td></tr></table></div></div></div><p> </p><div class="figure-img" data-ke-type="image" data-ke-style="alignCenter" data-ke-mobilestyle="widthOrigin"><img src="https://t1.daumcdn.net/cafeattach/1YqmY/74cbe0000b4d6ce16d0f7fa3067ece8735fa6896" class="txc-image" data-img-src="https://t1.daumcdn.net/cafeattach/1YqmY/74cbe0000b4d6ce16d0f7fa3067ece8735fa6896" data-origin-width="1920" data-origin-height="3208"></div><div class="figure-file" data-ke-type="file" data-file-src="https://t1.daumcdn.net/cafeattach/1YqmY/23419cd40e5727c3b30ae79ce43a7d66592d6220?download" data-file-name="test03.jsp" data-file-size="8136" data-mimetype="" data-ke-align="alignCenter"><a href="javascript:checkVirus('grpid%3D1YqmY%26fldid%3DDPHG%26dataid%3D29%26fileid%3D2%26regdt%3D20220420213150&url=https%3A%2F%2Ft1.daumcdn.net%2Fcafeattach%2F1YqmY%2F23419cd40e5727c3b30ae79ce43a7d66592d6220')"><div class="image"></div><div class="desc"><div class="filename"><span class="name">test03</span><span class="type">.jsp</span></div><div class="size">7.95KB</div></div></a></div><div class="figure-file" data-ke-type="file" data-file-src="https://t1.daumcdn.net/cafeattach/1YqmY/b4a6341c0e98568e3a7fde8da63bb34aff0f6daa?download" data-file-name="test03Ok.jsp" data-file-size="2741" data-mimetype="" data-ke-align="alignCenter"><a href="javascript:checkVirus('grpid%3D1YqmY%26fldid%3DDPHG%26dataid%3D29%26fileid%3D3%26regdt%3D20220420213150&url=https%3A%2F%2Ft1.daumcdn.net%2Fcafeattach%2F1YqmY%2Fb4a6341c0e98568e3a7fde8da63bb34aff0f6daa')"><div class="image"></div><div class="desc"><div class="filename"><span class="name">test03Ok</span><span class="type">.jsp</span></div><div class="size">2.68KB</div></div></a></div>
<!-- -->
]]>
카페 게시글
김흰별
0420 과제2 - 상품가격 6개 입력받아 오름차순,내림차순 출력하기(jQuery적용해봤어요)
김흰별
추천 0
조회 62
22.04.20 21:31
댓글 0
다음검색
