dropdownlist selection not possible it shrinks automatically

Question

0.00/5 (No votes)

See more:

I placed an dropdown list in an update panel

ASP.NET

asp:UpdatePanel ID="UpdatePanel3" runat="server">
                                    <contenttemplate>
                                    <asp:DropDownList ID="DropDownList1" runat="server" Height="24px" 
                                      Width="186px">
                                    
                                    </contenttemplate>
 </asp:UpdatePanel>

and in formload i write like this

C#

protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                connStr = ConfigurationManager.ConnectionStrings["NFTRANSConnectionString1"].ConnectionString;
                Driverjobcodeload();
            }
        }


  public void Driverjobcodeload()
        {


            DataTable dt = new DataTable();
            SqlConnection con = new SqlConnection(connStr);
            SqlDataReader ddDR = null;
            con.Open();
            SqlCommand cmd = new SqlCommand("Select DriverCode ,Driverid from DriverMaster_tbl ", con);
            ddDR = cmd.ExecuteReader();
            dt.Load(ddDR);
            DropDownList1.DataSource = dt;
            DropDownList1.DataTextField = "DriverCode";
            DropDownList1.DataValueField = "Driverid";
            DropDownList1.DataBind();
        }

but when i run this in browser Iam not able to select any item in the dropdownlist once i expan the list it get shrinked automatically within a second and even if i manage to select one its willnot be the selected item selected item will be default the first one.

I know since iam a new bie to web development it may be a error from my side but can anyone suggest any possible issue

Posted 19-Feb-13 23:14pm

SREENATH GANGA

Updated 20-Feb-13 0:28am

v3

Add a Solution

Comments

ali_heidari_ 20-Feb-13 5:42am

your dropdown list not in update panel ! and and set updatemode of update panel to always ! UpdateMode="Always" ... hope help you

SREENATH GANGA 20-Feb-13 6:07am

thank you ....but vwhen i try to put it inside iam getting error at run at server Parser Error Message: Type 'System.Web.UI.UpdatePanel' does not have a public property named 'DropDownList'.

ali_heidari_ 20-Feb-13 6:10am

you cant put it into it directly! updatepanel has a member named ContentTemplate! you should put dropdownlist on ContentTemplate

SREENATH GANGA 20-Feb-13 6:30am

Thankyou for your support I kept the dropdownlist inside contenttemplate still issue continues

ali_heidari_ 20-Feb-13 6:39am

when you use updatepanel and ajax, your dropdownlist will reload with any event!and when you click on dropdownlist ,page will reload and dropdownlist closed! so i suggest you keep dropdownlist out of updatepanel and make a trigger for it if you want any event raise(like OnSelectedIndexChanged!

4 solutions

Solution 1

XML

Here's jQuery based example. it takes all keyboard and mouse events into account, especially clicks:

if (!$.support.leadingWhitespace) { // if IE6/7/8
    $('select.wide')
        .bind('focus mouseover', function() { $(this).addClass('expand').removeClass('clicked'); })
        .bind('click', function() { $(this).toggleClass('clicked'); })
        .bind('mouseout', function() { if (!$(this).hasClass('clicked')) { $(this).removeClass('expand'); }})
        .bind('blur', function() { $(this).removeClass('expand clicked'); });
}
Use it in combination with this piece of CSS:
select {
    width: 150px; /* Or whatever width you want. */
}
select.expand {
    width: auto;
}
All you need to do is to add the class wide to the dropdown element(s) in question.
<select class="wide">
    ...
</select>

Posted 19-Feb-13 23:40pm

nilschaudhari

Solution 4

Hi,

You can take dropdownlist in to trigger tag in update panel.

Posted 20-Feb-13 1:19am

nehas1jan

Solution 3

Your code is fine. The problem is with the HTML markup. As you have not posted the complete markup, here is what i assume you have missed:
1. A ScriptManager on your aspx page.
2. DropDownList tag is not well formed.
3. UpdatePanel's UpdateMode property is not specified, so by default it is "Always".

Replace your markup with the following and try:

XML

<asp:scriptmanager runat="server" id="ScriptManager1"></asp:scriptmanager>
<asp:updatepanel id="UpdatePanel3" runat="server" updatemode="Conditional"/><contenttemplate>
<asp:DropDownList ID="DropDownList1" runat="server"></DropDownList>
</contenttemplate>
</asp:UpdatePanel>

Posted 20-Feb-13 1:02am

Zafar Sultan

Updated 20-Feb-13 1:06am

v2

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

S. M. Ahasan Habib · Accepted Answer · 2013-02-19T23:50:00

I just follow your code. My markup is

<form id="form1" runat="server">
<asp:scriptmanager runat="server" id="scrManager" enablepartialrendering="true" xmlns:asp="#unknown"></asp:scriptmanager>
<div>
    <asp:updatepanel id="UpdatePanel3" runat="server" xmlns:asp="#unknown">

                               </asp:updatepanel>
                              <asp:dropdownlist id="DropDownList1" runat="server" height="24px" xmlns:asp="#unknown">
                                   onselectedindexchanged="DropDownList1_SelectedIndexChanged" Width="186px" AutoPostBack="true">
                               </asp:dropdownlist>
</div>
</form>

My codebehind is

C#

protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
        Driverjobcodeload();
    }
}
public void Driverjobcodeload()
{
    var dt = new DataTable();
    dt.Columns.Add("DriverCode", typeof(string));
    dt.Columns.Add("Driverid", typeof(string));

    DataRow row1 = dt.NewRow();
    row1["DriverCode"] = "1";
    row1["Driverid"] = "One";
    dt.Rows.Add(row1);
    DataRow row2 = dt.NewRow();
    row2["DriverCode"] = "2";
    row2["Driverid"] = "Two";
    dt.Rows.Add(row2);
    DataRow row3 = dt.NewRow();
    row3["DriverCode"] = "3";
    row3["Driverid"] = "Three";
    dt.Rows.Add(row3);
  
    DropDownList1.DataSource = dt;
    DropDownList1.DataTextField = "DriverCode";
    DropDownList1.DataValueField = "Driverid";
    DropDownList1.DataBind();
}
protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
{
    var z = 100;
}

The code is working fine. Please check that and compare with your code. Let me know any difference it with your code except database access.