Rails ajax µÄÁª¶¯µÄÏÂÀ¿ò
# app\controllers\examples_controller.rb
ruby ´úÂë
class ExamplesController < ApplicationController
def ajax_select
@items = %w{AA BB}
end
def get_sub_items
if params[:item] == "AA"
@sub_items = %w{AA1 AA2}
else
@sub_items = %w{BB1 BB2}
end
render :partial => "select"
end
end
# app\views\examples\ajax_select.rhtml
xml ´úÂë
<%= javascript_include_tag :defaults %>
<h1>Examples#ajax_select</h1>
<p>Find me in app/views/examples/ajax_select.rhtml</p>
<%= select :obj, :att, @items, {}, :onchange => remote_function(:update => "sub_items",
:method => "get",
:with => "'item=' + value",
:url => { :controller => :examples, :action => :get_sub_items})
%>
<div id="sub_items">
<select></select>
</div>
#app\views\examples\_select.rhtml
ruby ´úÂë
<%= select(:obj, :item
Ïà¹ØÎĵµ£º
jQuery Ajax È«½âÎö
±¾ÎĶÌÖ·£ºhttp://s8.hk/0itq
±¾ÎĵØÖ·: jQuery Ajax È«½âÎö
±¾ÎÄ×÷ÕߣºQLeelulu
×ªÔØÇë±êÃ÷³ö´¦£¡
jQueryȷʵÊÇÒ»¸öͦºÃµÄÇáÁ¿¼¶µÄJS¿ò¼Ü£¬ÄܰïÖúÎÒÃÇ¿ìËٵĿª·¢JSÓ¦Ó㬲¢ÔÚÒ»¶¨³Ì¶ÈÉϸıäÁËÎÒÃÇдJavaScript´úÂëµÄϰ¹ß¡£
·Ï»°ÉÙ˵£¬Ö±½Ó½øÈëÕýÌ⣬ÎÒÃÇÏÈÀ´¿´Ò»Ð©¼òµ¥µÄ·½·¨£¬ÕâЩ·½·¨¶¼ÊǶÔjQu ......
´úÂëÏÂÔØ£ºhttp://code.google.com/p/ajaxautocomplete/downloads/list
Auto CompleteµÄjQuery¿Ø¼þ¡£
Ê×ÏÈÊÇÐèÒªÉè¼ÆÏÂÎÒÃǵÄDIV×îºóÓ¦¸ÃÏÔʾ³ÉʲôÑù×Ó,ÎÒµÄCSS²»Õ¦µØ¡£Ï¹ÍæÄØ¡£Ñù×ÓÈçÏ£º
Ê×ÏÈÊÇÒ»¸öDIV£¬È»ºóÊÇÌí¼ÓÒ»¸öulºÍ¼¸¸öli tag:
<div id="nav">
<ul>
<li><a>Text1 field1& ......
1´´½¨Á½ÕÅÒ³Ãæ Reg.aspx¡¢CallServer.aspx¡£
ÔÚReg.aspxÒ³ÃæµÄhtmlÖзŠһ¸ö²ãºÍÒ»¸öÎı¾¿ò
<div id="aa">
<asp:TextBox id="txtuser" runat="server" Width="136px"></asp:TextBox>
</div>
<span id="errInfo">ÇëÊäÈëÓû§Ãû</span>
ÔÚReg.aspxÒ³ÃæÖÐдjavascript
¶¨Òå¶þ¸ö±äÁ¿ ......
ÎÒÃǶ¼ÖªµÀ£¬ajaxÄÜÌá¸ßÒ³ÃæÔØÈëµÄËٶȵÄÖ÷ÒªÔÒòÊÇͨ¹ýajax¼õÉÙÁËÖØ¸´Êý¾ÝµÄÔØÈë£¬ÕæÕý×öµ½°´Ðè»ñÈ¡£¬¼ÈÈ»Èç´Ë£¬ÎÒÃÇÔÚдajax³ÌÐòµÄʱºò²»·ÁËÍ·ðË͵½Î÷£¬ÔÚ¿Í»§¶ËÔÙ×öÒ»´Î»º´æ,½øÒ»²½Ìá¸ßÊý¾ÝÔØÈëËÙ¶È¡£ÄǾÍÊÇÔÚÔØÈëÊý¾ÝµÄͬʱ½«Êý¾Ý»º´æÔÚä¯ÀÀÆ÷ÄÚ´æÖУ¬Ò»µ©Êý¾Ý±»ÔØÈë£¬Ö»ÒªÒ³ÃæÎ´Ë¢Ð£¬¸ÃÊý¾Ý¾ÍÓÀÔ¶µÄ»º´æÔÚÄÚ´æÖУ¬µ±Ó ......
$.get()ºÍ$.post()·½·¨
$.get(url [,data] [,callback] [,type])
type£ºstringÀàÐÍ£¬·þÎñÆ÷¶Ë·µ»ØÄÚÈݵĸñʽ£¬°üÀ¨xml£¬html£¬script£¬json£¬textºÍ_default
»Øµ÷º¯ÊýÖ»ÓÐÁ½¸ö²ÎÊý£ºfunction(data,textstatus){....}
data:·µ»ØµÄÄÚÈÝ £ ......