I have applied script on dropdownlist for stylish look and style is applied properly ,but in .cs page(code page) OnSelectedIndexChanged of dropdownlist is not working properly.

My Html Code:

<head>
<link href="css/screen.css" rel="stylesheet" media="screen" type="text/css" title="default"/>
<script src="js/jquery/jquery-1.4.1.min.js" type="text/javascript"></script>
<script src="js/jquery/jquery.selectbox-0.5_style_2.js" type="text/javascript"></script>
<script type="text/javascript">
            $(document).ready(function () {
            $('.styledselect_form_1').selectbox({ inputClass: "styledselect_form_1" });
             });
</script>
</head>





<body>
<asp:DropDownList ID="ddprice" runat="server" AutoPostBack="True" OnSelectedIndexChanged="ddprice_SelectedIndexChanged" class="styledselect_form_1">
<asp:ListItem Value="0">BY PRICE</asp:ListItem>
<asp:ListItem Value="1">Low to High</asp:ListItem>
<asp:ListItem Value="2">High to Low</asp:ListItem>
</asp:DropDownList>
</body>

My Source code is:

protected void ddprice_SelectedIndexChanged(object sender, EventArgs e)
{
Response.redirect("index.aspx");
}

And my script in css class name screen.css is

/* STYLED Dropdown*/

div.selectbox-wrapper2  {
background-color: #e3e3e3;
border: none;
border-bottom: none;
margin: 0px;
margin-top: 0px;
max-height: 200px;
overflow: auto;
padding: 0px;
position: absolute;
text-align: left;
width: 400px;
}
div.selectbox-wrapper2 ul   {
list-style-type: none;
margin: 0px;
padding: 0px;
}
div.selectbox-wrapper2 ul li.selected2  {
background-color: #94b52c;
color: #fff;
}
div.selectbox-wrapper2 ul li.current2   {
background-color: #94b52c;
color: #fff;
}
div.selectbox-wrapper2 ul li    {
border-bottom: none;
color: #393939;
cursor: pointer;
display: block;
font-size: 12px;
line-height: 12px;
list-style-type: none;
margin: 0;
padding: 6px 2px 6px 10px;
}
.styledselect_form_1    {
background: url(../images/price-2.jpg) left no-repeat;
border: none;
border-left: none;
color: #393939;
cursor: pointer;
display: block;
font-family: Arial;
font-size: 12px;
height: 24px;
margin: 0px 0px 0px 0px;
padding: 7px 0 0 6px;
text-align: left;
width: 192px;
}

Should be :

Response.Redirect("index.aspx");

Notice the Capital R on redirect

I have tried with "Response.Redirect("index.aspx");" also but still not working as on select change of dropdown(Id="ddprice") it is not calling or firing the ddprice_SelectedIndexChanged which is an select event of dropdown on .cs page.

There is nothing wrong with your script, may be it's not working with the dropdownbox with OnSelectedIndexChanged.

yes thats true. Its not working with OnSelectedindexChanged of dropdown. What shall i do to make it work.

Have you tried debugging to see if its entering the method?

What IDE are you using ... Visual Studio? If so, go to the page in question and view it in the designer. Double click on the dropdown list and verify it goes to the correct OnSelectedIndexChanged method.

If its reaching the Response, try adding the bool in the redirect.

Response.Redirect("index.aspx", false);

I had tried debugging to see its enter method or not, but its not calling method nor its going on .cs page of page load.
In short its not going to .cs page

Member Avatar for saravind84

Have you set the autopostback to true?

What are you developing on? Visual Studio? What version?
Post your .cs page completely, including the using statements.
Post your aspx page completly.

Hi, Please try the below script part:

             function pageLoad(sender, args) {
             //Your jquery code
             }



         I hope this will work.

you mean i have to write this code over there right????

 <script type="text/javascript">
            $(document).ready(function () {
            $('.styledselect_form_1').selectbox({ inputClass: "styledselect_form_1" });
             });
</script>

No, Instead of $(document).ready(function ()..write function pageLoad(sender, args) .Please check below:

function pageLoad(sender, args)  {
            $('.styledselect_form_1').selectbox({ inputClass: "styledselect_form_1" });
             });

Hi,

Why are you adding this code

OnSelectedIndexChanged="ddprice_SelectedIndexChanged"

on your front-end webpage if the function is already being called on the back-end?

protected void ddprice_SelectedIndexChanged(object sender, EventArgs e)
{
Response.redirect("index.aspx");
}

Remove that and try again

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.