Question

I have the following code in the Page_Load method of a web form:

protected void Page_Load(object sender, EventArgs e)
{
    CountrySelectButton.Click += new EventHandler(CountrySelectButton_Click);

    if (HomePage.EnableCountrySelector) //always true in in this case
    {
        if(!IsPostBack)
            BindCountrySelectorList();
    }
}

The BindCountrySelectorList method looks like this:

private void BindCountrySelectorList()
{
    NameValueCollection nvc = HttpUtility.ParseQueryString(HomePage.CountryList);

    var ds = nvc.AllKeys.Select(k => new { Text = k, Value = nvc[k] });

    CountrySelector.DataSource = ds;
    CountrySelector.DataTextField = "Text";
    CountrySelector.DataValueField = "Value";
    CountrySelector.DataBind();
}

And I have a LinkButton click event handler which gets the SelectedValue from the SelectList as so:

void CountrySelectButton_Click(object sender, EventArgs e)
{
    //get selected
    string selectedMarket = CountrySelector.SelectedValue; //this is always the first item...

    //set cookie
    if (RememberSelection.Checked)
        Response.Cookies.Add(new HttpCookie("blah_cookie", selectedMarket) { Expires = DateTime.MaxValue });

    //redirect
    Response.Redirect(selectedMarket, false);
}

EDIT:

This is the DDL and LinkButton definition:

<asp:DropDownList runat="server" ID="CountrySelector" />
<asp:LinkButton runat="server" ID="CountrySelectButton" Text="Go" />

Resulting markup:

<select name="CountrySelector" id="CountrySelector">
    <option value="http://google.com">UK</option>
    <option value="http://microsoft.com">US</option>
    <option value="http://apple.com">FR</option>
</select>
<a id="CountrySelectButton" href="javascript:__doPostBack('CountrySelectButton','')">Go</a>

END EDIT

ViewState is enabled but the SelectedValue property only ever returns the first item in the list regardless of which item is actually selected. I’m certain I’m missing something obvious but I can’t find the problem; any help is much appreciated.

Thanks in advance.

Dave

Answer 1

You are correct that your issue stems from the jquery ui dialog… you can get around this by using a hidden field to record the value of the dropdownlist. Then in your code, reference the hidden field.

Front end could look like:

<div id="myModal" style="display: none;">
        <asp:DropDownList runat="server" ID="SelectList" />
        <asp:LinkButton runat="server" ID="MyButton" Text="Go" />
    </div>
    <input type="hidden" id="countryVal" runat="server" />
    <a id="choose" href="#">Choose</a>
    <script type="text/javascript">
        $(document).ready(function () {

            $('#choose').click(function () {
                $('#myModal').dialog({
                });
                return false;
            });

            $('#<%= SelectList.ClientID %>').change(function () {
               var country = $(this).val();
               $('#<%= countryVal.ClientID %>').val(country);
            });
        }); 
    </script>

Then your code behind:

var selected = countryVal.Value;