Note that there are some explanatory texts on larger screens.

plurals
  1. POHow to use Dropdown Extender to trigger OnSelectedIndexChanged event
    text
    copied!<p>I am trying to construct a Dropdown list using the AjaxToolKit's dropdownlistextender. I have the following markup:</p> <pre><code>&lt;asp:Label ID="ddTest" runat="server" Text="Transactions" Width="300px" BorderColor="#C0C0C0" CssClass="selecter"/&gt; &lt;ajaxToolkit:DropDownExtender runat="server" ID="ddeSections" TargetControlID="ddTest" DropDownControlID="panelItems" HighlightBackColor="Silver" DropArrowBackColor="white" HighlightBorderColor="Silver"/&gt; </code></pre> <p>and the following for the "list" items:</p> <pre><code> &lt;table runat="server" id="ctlOptions" class="options" cellspacing="2" cellpadding="2" border="1"&gt; &lt;tr&gt;&lt;td class="item" onmouseover="mouseOver(this)" onmouseout="mouseOut(this)" onclick="clickIt(this)"&gt;Transactions&lt;/td&gt;&lt;/tr&gt; &lt;tr&gt;&lt;td class="item" onmouseover="mouseOver(this)" onmouseout="mouseOut(this)" onclick="clickIt(this)"&gt;The second option&lt;/td&gt;&lt;/tr&gt; &lt;tr&gt;&lt;td class="item" onmouseover="mouseOver(this)" onmouseout="mouseOut(this)" onclick="clickIt(this)"&gt;The third option&lt;/td&gt;&lt;/tr&gt; &lt;tr&gt;&lt;td class="item" onmouseover="mouseOver(this)" onmouseout="mouseOut(this)" onclick="clickIt(this)"&gt;The fourth option&lt;/td&gt;&lt;/tr&gt; &lt;tr&gt;&lt;td class="item" onmouseover="mouseOver(this)" onmouseout="mouseOut(this)" onclick="clickIt(this)"&gt;The fifth option&lt;/td&gt;&lt;/tr&gt; &lt;/table&gt; </code></pre> <p>my JavaScript looks like this:</p> <pre><code>function mouseOver(obj) { if (obj) obj.className = 'itemOver'; } function mouseOut(obj) { if (obj) obj.className = 'item'; } </code></pre> <p>where <strong>item</strong> and <strong>itemOver</strong> are appropriately styled CSS classes. The problem is that I want my <em>onclick</em> event to trigger a <em>SelectedIndexChanged</em>-type event on the server. I have tried with this function:</p> <pre><code>function clickIt(obj) { var ddTest = document.getElementById("ctl00_ContentPlaceHolder1_ddTest"); var selVal = ''; if (ddTest) { selVal = obj.firstChild.nodeValue; ddTest.firstChild.nodeValue = selVal; __doPostBack('&lt;%=ddSections.ClientID %&gt;', ''); } } </code></pre> <p><em>ddSections</em> is an <code>asp:Dropdown</code> whose OnSelectedIndexChanged event I am attempting to fire.</p> <p>This triggers a page-level postback, but not the <strong>ddSections_SelectedIndexChanged</strong> server-side method that I want to trigger. The ddSections, incidentally, will be hidden.</p> <p>please can you offer some advice. I have spent three days trying to figure this out and have come up empty handed. Feel free to re-format for readability. Thanks in advance.</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload