c# - Dynamic content w/ jQuery -
i starting learn jquery, , want load content seperate .aspx page dynamically div. using example here: http://www.asp.net/ajaxlibrary/jquery_webforms_dynamic_load.ashx?hl=var.
however doesn't seem responding , i'm missing piece of this. here code / script in .aspx page:
<asp:content id="content2" contentplaceholderid="contentplaceholder1" runat="server"> <script src="scripts/jquery-1.5.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function () { // external aspx page calling $("#btn_submit").click(loaddynamic); }); function loaddynamic() { $("#dynamicresults").load("resultsview.aspx", {name: $("#cbox_user").val() }, function (content) { $(this).hide().fadein("slow"); return false; }); }
<header> query view </header> <content> <div style="float:right; height:154px; width: 947px; margin-left: 0px; background-color: #e0e0e0;"> <br /> <asp:label id="label2" runat="server" text="select user:" style="margin-left:28px" ></asp:label> <asp:combobox id="cbox_user" runat="server" autocompletemode="suggestappend"> </asp:combobox> <asp:label id="label3" runat="server" text="select month:" style="margin-left:28px" ></asp:label> <asp:textbox id="txt_date" runat="server"></asp:textbox> <asp:calendarextender id="calendarextender1" runat="server" targetcontrolid="txt_date" format="mmmm yyyy" onclientshown="oncalendarshown" onclienthidden="oncalendarhidden" behaviorid="calendar1" > </asp:calendarextender> <asp:button id="btn_submit" runat="server" text="submit" style="margin-left:28px" onclick="btn_submit_click" /> </div> </content> <header> results view </header> <content> <div id="dynamicresults"> </div> <div style="border-style: none; height:340px; width: 770px; position:relative; top: 10px; left: -2px;"> <asp:gridview id="resultsview" runat="server" cellpadding="3" forecolor="black" gridlines="none" allowpaging="false" visible="false" height="318px" style="margin-left: 32px; margin-top: 2px;" width="718px" backcolor="white" bordercolor="#999999" borderstyle="solid" borderwidth="1px"> </asp:gridview> </div> </content> and in second .aspx page, contains div want dynamically load:
<html xmlns="http://www.w3.org/1999/xhtml"> <div style="background-color:#e0e0e0; border-style: ridge none none none; border- width: thin; border-color: #b3b3b3; height:120px; width: 770px; position:relative; top: 10px; left: 8px;"> <asp:label id="lbl_header" runat="server" text="user information:"></asp:label> </div> </html>
have @ load method.
here example page:
loading page fragments .load() method, unlike $.get(), allows specify portion of remote document inserted. achieved special syntax url parameter. if 1 or more space characters included in string, portion of string following first space assumed jquery selector determines content loaded.
we modify example above use part of document fetched:
$('#result').load('ajax/test.html #container');when method executes, retrieves content of ajax/test.html, jquery parses returned document find element id of container. element, along contents, inserted element id of result, , rest of retrieved document discarded.
jquery uses browser's .innerhtml property parse retrieved document , insert current document. during process, browsers filter elements document such , , or elements. result, elements retrieved .load() may not same if document retrieved directly browser.
edit: noticed in function loaddynamic() you're trying value of control cbox_user this:
$("#cbox_user").val() but, because it's server-side control, need value this:
$("#<%=cbox_user.clientid%.").val() this because .net gives asp.net controls different id's specify.
hope helps.
Comments
Post a Comment