あなたの質問の要点は、次のとおりだと思います。
「ドロップダウンから任意の値を選択すると、この選択した値に依存するデータベースからいくつかのデータが読み込まれます。選択が変更されるたびにページが更新されるという問題に直面しています。」
これを実現するには多くの方法がありますが、目的の効果を得るには再構築が必要になる場合があります。これを行う比較的簡単な方法は次のとおりです。
(1) ページを次のように再編成します。
<asp:DropDownList ID="ddList" CssClass="dropdown" Style="width: 200px !important;" runat="server" AutoPostBack="false">
</asp:DropDownList>
<asp:UpdatePanel ID="OuterUpdatePanel" runat="server">
<ContentTemplate>
<!-- Content goes here -->
</ContentTemplate>
</asp:UpdatePanel>
(2) 次のようにスクリプトを追加します。
<script type="text/javascript">
function handleDDLChange() {
__doPostBack($('div[id$="OuterUpdatePanel"]').attr('id'), 'ddlList_Changed_Or_Anything_Else_You_Might_Want_To_Key_Off_Of');
}
$('input[id$="ddlList"]').change( handleDDLChange );
</script>
これはより「昔ながらの」アプローチですが、問題を解決するはずです。
EDIT:以下は、上記のアイデアをもう少し具体化した「非jQuery」アプローチを示しています。
ASCX:
<asp:ScriptManager runat="server" />
<asp:DropDownList ID="ddlList" runat="server" onchange="handleDDLChange()">
<asp:ListItem Text="text1" />
<asp:ListItem Text="text2" />
</asp:DropDownList>
<script type="text/javascript">
function handleDDLChange() {
__doPostBack("<%= ddlList.ClientID %>", "ddlList_Changed_Or_Anything_Else_You_Might_Want_To_Key_Off_Of");
}
</script>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Literal ID="litTest" runat="server" />
</ContentTemplate>
</asp:UpdatePanel>
コード ビハインド:
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
litTest.Text = "No postback";
}
else if (Request["__EVENTARGUMENT"] == "ddlList_Changed_Or_Anything_Else_You_Might_Want_To_Key_Off_Of")
{
litTest.Text = string.Format("Dropdown changed: {0}", ddlList.Text);
}
else
{
litTest.Text = "Postback for some other reason... :(";
}
}