JQuery ajax填充select
Django端代码<div><div id="codeText" class="codeText"><ol style="margin:0 1px 0 0;padding:5px 0;" start="1" class="dp-css"><li><span style="color:#000000;">notmp <span style="color:#0000CC;">=</span> Snapserver<span style="color:#0000CC;">.</span>objects<span style="color:#0000CC;">.</span>filter<span style="color:#0000CC;">(</span>fileid<span style="color:#0000CC;">=</span>file_id<span style="color:#0000CC;">,</span>hostgroup__icontains<span style="color:#0000CC;">=</span>key<span style="color:#0000CC;">)</span><span style="color:#0000CC;">.</span>values<span style="color:#0000CC;">(</span><span style="color:#FF00FF;">'hostgroup'</span><span style="color:#0000CC;">)</span><span style="color:#0000CC;">.</span>distinct<span style="color:#0000CC;">(</span><span style="color:#0000CC;">)</span><br></span></li><li><span style="color:#0000FF;">for</span> ele <span style="color:#0000FF;">in</span> notmp<span style="color:#0000CC;">:</span><br></li><li>
b<span style="color:#0000CC;">=</span><span style="color:#0000CC;">{</span><span style="color:#0000CC;">}</span><br></li><li>
b<span style="color:#0000CC;">[</span><span style="color:#FF00FF;">'hostgroup'</span><span style="color:#0000CC;">]</span> <span style="color:#0000CC;">=</span> ele<span style="color:#0000CC;">.</span>get<span style="color:#0000CC;">(</span><span style="color:#FF00FF;">'hostgroup'</span><span style="color:#0000CC;">)</span><br></li><li>
myresult<span style="color:#0000CC;">.</span>append<span style="color:#0000CC;">(</span>b<span style="color:#0000CC;">)</span><br></li><li><span style="color:#0000FF;">return</span> HttpResponse<span style="color:#0000CC;">(</span>json<span style="color:#0000CC;">.</span>dumps<span style="color:#0000CC;">(</span>myresult<span style="color:#0000CC;">,</span>ensure_ascii<span style="color:#0000CC;">=</span>True<span style="color:#0000CC;">)</span><span style="color:#0000CC;">)</span></li></ol><div><font class="Apple-style-span" color="#0000CC"><span class="Apple-style-span" style="line-height: 16px;"><br></span></font></div><div><font class="Apple-style-span" color="#0000CC"><span class="Apple-style-span" style="line-height: 16px;">JS响应端的代码</span></font></div><div><font class="Apple-style-span" color="#0000CC"><span class="Apple-style-span" style="line-height: 16px;"><div><script type="text/javascript"></div><div>$(document).ready(function () {</div><div><span class="Apple-tab-span" style="white-space:pre"> </span>if(navigator.userAgent.indexOf("MSIE")>0){ </div><div><span class="Apple-tab-span" style="white-space:pre"> </span>document.getElementById('alreadysearch').attachEvent("onpropertychange",alreadyajax); </div><div><span class="Apple-tab-span" style="white-space:pre"> </span>document.getElementById('nosearchvalue').attachEvent("onpropertychange",noinajax); </div><div><span class="Apple-tab-span" style="white-space:pre"> </span>}else { </div><div><span class="Apple-tab-span" style="white-space:pre"> </span>document.getElementById('alreadysearch').addEventListener("input",alreadyajax,false); </div><div><span class="Apple-tab-span" style="white-space:pre"> </span>document.getElementById('nosearchvalue').addEventListener("input",noinajax,false);</div><div><span class="Apple-tab-span" style="white-space:pre"> </span>}</div><div>});</div><div><br></div><div>function ajaxAddOptions(url,target,text) {</div><div><span class="Apple-tab-span" style="white-space:pre"> </span>target.empty();</div><div><span class="Apple-tab-span" style="white-space:pre"> </span>$.getJSON(url,function(json){</div><div><span class="Apple-tab-span" style="white-space:pre"> </span>$(json).each(function(i) {</div><div><span class="Apple-tab-span" style="white-space:pre"> </span>var x = json;</div><div><span class="Apple-tab-span" style="white-space:pre"> </span>target.append("<option value='" + eval("x."+text)+"'>" + eval("x."+text)+"</option>");</div><div><span class="Apple-tab-span" style="white-space:pre"> </span>});</div><div><span class="Apple-tab-span" style="white-space:pre"> </span>});</div><div>}</div><div>function alreadyajax(){ </div><div><span class="Apple-tab-span" style="white-space:pre"> </span>var key = $("#alreadysearch").val();</div><div><span class="Apple-tab-span" style="white-space:pre"> </span>ajaxAddOptions("/avatar/searhost/in/{{file_id}}/?key="+key, $("#alreadlist"), "hostgroup"); </div><div>} </div><div>function noinajax(){ </div><div><span class="Apple-tab-span" style="white-space:pre"> </span>var key = $("#nosearchvalue").val();</div><div><span class="Apple-tab-span" style="white-space:pre"> </span>ajaxAddOptions("/avatar/searhost/no/{{file_id}}/?key="+key, $("#nolist"), "hostgroup"); </div><div>} </div><div></script></div><div>可以自己封装一些常用的JS代码。做成JQuery的插件 ！</div></span></font></div></div></div>
页:
[1]