如何实现页面异步刷新？？？

Question

如图片所示：
问题：
        页面有四块区域，如何实现每块区域“独立的异步刷新”，而不影响其它三块区域的数据。     点击“查询”按钮，只有所在区域内的数据刷新，其它部分的数据不刷新。     应该如何实现？？？          知道要使用Ajax，但能不能具体点，具体使用什么插件，能不能说说思路，给点实例。  不甚感激。

Answer 1

知道用Ajax实现，但是如果具体的刷新某个页面的区域应该怎么做？？？      能不能给点实例。

Answer 2

UpdatePanel用法

Answer 3

四个ifram，分别加载四个页面

Answer 4

用四个“Iframe”，每个Iframe可以独立提交

Answer 5

用四个“Iframe”，每个Iframe可以独立提交好办法。

Answer 6

去看看JS吧。 你可以通过ajax返回html 把要替换的那一块替换掉就OK了。

Answer 7

用四个Iframe，每个Iframe可以独立提交对吗？？？

Answer 8

用四个Iframe，每个Iframe在点击“提交”的时候只会提交对应的指向页面对吗？？？

Answer 9

用Jquery吧。 你可以通过$.ajax或$.post返回html 把要替换的那一块替换掉就行了
在网上搜下$.post,可以看到很多这方面的例子

Answer 10

  每个iframe就可以加载独立的页面了

Answer 11

用jquery
///SysUser/getdata：你取数据的url， { uid:id}：参数列表。把这个放到你的button的点击事件里面改改就行了。 $.post("/SysUser/getdata", { uid:id},function(data){
                       alert(data);//data是返回数据
                    });用jquery用jquery

Answer 12

jquery ajax，get或者post ，后台返回的数据，替换掉你想更新的区域就可以实现。

Answer 13

简单的方法，是使用XMLHTTPREQUEST
更简单的方法，是使用JQUERY

Answer 14

日历样品异步刷新
protected void Calendar1_SelectionChanged(object sender, EventArgs e)
    {
        SelectedDate.Text = Calendar1.SelectedDate.ToString();//显示用户选择的日期  
    }
    protected void DropDownSelection_Change(object sender, EventArgs e)
    {
        Calendar1.DayStyle.BackColor =
              System.Drawing.Color.FromName(ColorList.SelectedItem.Value);//更改日历控件背景色
    }
    protected void btnSearch_Click(object sender, EventArgs e)
    {
        string sqlstr = "select * from tb_Card where CardDate='" + Calendar1.SelectedDate.ToString() + "'";//定义根据日期字段执行查询操作的SQL
        sd.BindData(gvTitle, sqlstr);//调用自定义方法BindData（）绑定GridView控件
    }

Answer 15

简单点的可以使用ajaxpro.2.dll，具体使用方法到网上搜搜

Answer 16

异步刷新日期查询信息
一、<form id="form1" runat="server">
    <div>
    
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                 <table class="Table" cellpadding="2" cellspacing="0" border="1" bordercolor="#daeeee">
<tr>
<td width="150" valign="middle" class="LeftTD" align="right"><span class="style1">
                请先选择背景色：<asp:DropDownList ID="ColorList" runat="server" AutoPostBack="True" 
                    OnSelectedIndexChanged="DropDownSelection_Change">
                    <asp:ListItem Selected="True" Value="White"> 白色 
                    </asp:ListItem>
                    <asp:ListItem Value="Silver"> 银色 
                    </asp:ListItem>
                    <asp:ListItem Value="DarkGray"> 深灰色 
                    </asp:ListItem>
                    <asp:ListItem Value="Blue"> 蓝色 
                    </asp:ListItem>
                    <asp:ListItem Value="Yellow"> 黄色 
                    </asp:ListItem>
                    <asp:ListItem Value="Red"> 红色 
                    </asp:ListItem>
                </asp:DropDownList>
                </span>
                <br />
                <span class="style1">您选择的日期：</span><br />
                <span class="style1">
                <asp:Label ID="SelectedDate" runat="server">未选择</asp:Label>
                </span>
            </td>

<td valign="middle" width="85%">
<table class="Table">
<tr>
<td width="220">
<asp:Calendar ID="Calendar1" runat="server" BackColor="White" 
                                BorderColor="#3366CC" BorderWidth="1px" CellPadding="1" 
                                DayNameFormat="Shortest" Font-Names="Verdana" Font-Size="8pt" 
                                ForeColor="#003399" Height="200px" 
                                OnSelectionChanged="Calendar1_SelectionChanged" Width="544px">
                                <SelectedDayStyle BackColor="#009999" Font-Bold="True" ForeColor="#CCFF99" />
                                <TodayDayStyle BackColor="#99CCCC" ForeColor="White" />
                                <SelectorStyle BackColor="#99CCCC" ForeColor="#336666" />
                                <WeekendDayStyle BackColor="#CCCCFF" />
                                <OtherMonthDayStyle ForeColor="#999999" />
                                <NextPrevStyle Font-Size="8pt" ForeColor="#CCCCFF" />
                                <DayHeaderStyle BackColor="#99CCCC" ForeColor="#336666" Height="1px" />
                                <TitleStyle BackColor="#003399" BorderColor="#3366CC" BorderWidth="1px" 
                                    Font-Bold="True" Font-Size="10pt" ForeColor="#CCCCFF" Height="25px" />
                            </asp:Calendar>
</td>
<td valign="bottom"><asp:Button ID="btnSearch" runat="server" Text="搜索" CssClass="Button" OnClick="btnSearch_Click" SkinID="btnSkin" Width="60px" /></td>
</tr>
</table>
</td>
</tr>
<tr>
<td colspan="2">
<asp:GridView ID="gvTitle" runat="server" AllowPaging="True" 
                    AutoGenerateColumns="False" BackColor="White" BorderColor="#999999" 
                    BorderStyle="Solid" BorderWidth="1px" CellPadding="3" DataKeyNames="CardID" 
                    Font-Names="Tahoma" ForeColor="Black" GridLines="Vertical" 
                    OnPageIndexChanging="gvTitle_PageIndexChanging" PageSize="5" Width="100%" 
                    style="font-size: small">
                    <SelectedRowStyle BackColor="#000099" Font-Bold="True" ForeColor="White" />
                    <HeaderStyle Font-Names="Tahoma" HorizontalAlign="Center" />
                    <PagerStyle BackColor="#999999" ForeColor="Black" HorizontalAlign="Center" />
                    <EmptyDataTemplate>
                        帖子列表为空。
                    </EmptyDataTemplate>
                    <EmptyDataRowStyle ForeColor="Blue" />
                    <FooterStyle BackColor="#CCCCCC" />
                    <RowStyle BorderColor="LightBlue" BorderStyle="Ridge" BorderWidth="1px" 
                        HorizontalAlign="Center" />
                    <Columns>
                        <asp:TemplateField HeaderText="帖子标题">
                            <ItemTemplate>
                                <a><%# Eval("CardName")%></a>
                            </ItemTemplate>
                            <ItemStyle HorizontalAlign="Center" Width="15%" />
                            <HeaderStyle HorizontalAlign="Center" />
                        </asp:TemplateField>
                        <asp:TemplateField HeaderText="帖子内容">
                            <ItemTemplate>
                                <%# Eval("CardContent").ToString().Length > 10 ? Eval("CardContent").ToString().Substring(0, 10) + "..." : Eval("CardContent")%>
                            </ItemTemplate>
                            <ItemStyle HorizontalAlign="Left" Width="37%" />
                            <HeaderStyle HorizontalAlign="Left" />
                        </asp:TemplateField>
                        <asp:TemplateField HeaderText="访问次数">
                            <ItemTemplate>
                                <%# Eval("UserID")%>次
                            </ItemTemplate>
                            <ItemStyle HorizontalAlign="Center" Width="8%" />
                            <HeaderStyle HorizontalAlign="Center" />
                        </asp:TemplateField>
                        <asp:TemplateField HeaderText="回复次数">
                            <ItemTemplate>
                                <%# Eval("ModuleID")%>次
                            </ItemTemplate>
                            <ItemStyle HorizontalAlign="Center" Width="8%" />
                            <HeaderStyle HorizontalAlign="Center" />
                        </asp:TemplateField>
                        <asp:BoundField DataField="CardDate" HeaderText="创建时间" HtmlEncode="False">
                            <ItemStyle Width="18%" />
                        </asp:BoundField>
                    </Columns>
                    <AlternatingRowStyle BackColor="#CCCCCC" />
                </asp:GridView>
</td>
</tr>
    </table>    
            </ContentTemplate>
        </asp:UpdatePanel>
    
    </div>
    </form>
二、处理页面
public SqlData sd = new SqlData();
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            DbBind();
        }
    }
    protected void Calendar1_SelectionChanged(object sender, EventArgs e)
    {
        SelectedDate.Text = Calendar1.SelectedDate.ToString();//显示用户选择的日期  
    }
    protected void DropDownSelection_Change(object sender, EventArgs e)
    {
        Calendar1.DayStyle.BackColor =
              System.Drawing.Color.FromName(ColorList.SelectedItem.Value);//更改日历控件背景色
    }
    protected void btnSearch_Click(object sender, EventArgs e)
    {
        string sqlstr = "select * from tb_Card where CardDate='" + Calendar1.SelectedDate.ToString() + "'";//定义根据日期字段执行查询操作的SQL
        sd.BindData(gvTitle, sqlstr);//调用自定义方法BindData（）绑定GridView控件
    }
    public void DbBind()
    {
        string strCon = ConfigurationSettings.AppSettings["ConnectionString"];
        string strsql = "SELECT * FROM tb_Card";
        sd.BindData(gvTitle, strsql);
    }    protected void gvTitle_PageIndexChanging(object sender, GridViewPageEventArgs e)//在CodeGo.net
    {
        gvTitle.PageIndex = e.NewPageIndex;
        gvTitle.DataBind();
        DbBind();
    }

Answer 17

建议用Ajax  不管怎么分区域  回发还是得刷。。 Ajax直接无刷新不是更好。。

Answer 18

$.ajax({
                url: "一般处理程序的相对路劲",
                type: "post",
                async: true,
                data: { 参数列表},
                success: function (data) {
                    判断data做相应处理
                }
            });

Answer 19

太复杂了，直接使用xmlhttp+jquery就足够了，简单实用

Answer 20

UpdatePanel .net控件，可以实现局部刷新

Answer 21

 $.jaxa("/SysUser/getdata", { uid:id},function(data){
                       alert(data);//data是返回数据
                    });
---------------------------------------------------------------------------------
 $.post("/SysUser/getdata", { uid:id},function(data){
                       alert(data);//data是返回数据
                    });