Problems in DropDownList with updatepanel - c#

I have two DropDownList with update panel when i select value from first dropdownlist then in second dropdownlist display data related first. But there is problem at run time it can't display dropdownlist and continuously refresh this page.
So please help to solve this problem.
Here is my code ASPX PAGE
<%# Page Language="C#" AutoEventWireup="true" CodeFile="AddRoomPrice.aspx.cs" Inherits="AddRoomPrice" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<title>Presha Admin</title>
<style type="text/css">
#import url("css/style.css");
#import url('css/style_text.css');
#import url('css/form-buttons.css');
#import url('css/link-buttons.css');
#import url('css/menu.css');
#import url('css/statics.css');
#import url('css/messages.css');
#import url('css/table-sorter.css');
#import url('css/tabs.css');
#import url('css/forms.css');
#import url('css/datepicker.css');
#import url('css/jquery.fancybox-1.3.4.css');
#import url('css/accordions.css');
#import url('css/jquery.treeview.css');
#import url('css/wysiwyg.css');
#import url('css/wysiwyg.modal.css');
#import url('css/wysiwyg-editor.css');
</style>
<script type="text/javascript" src="js/jquery-1.6.2.min.js"></script>
<link rel="shortcut icon" href="gfx/Favicon.png">
<link rel="stylesheet" type="text/css" href="css/component.css" />
<script type="text/javascript" src="js/modernizr.custom.js"></script>
<!--[if lte IE 8]>
<script type="text/javascript" src="js/excanvas.min.js"></script>
<![endif]-->
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<div class="container">
<div class="logo-labels">
<img id="logo" runat="server" src="~/gfx/logo.png" height="50" />
<ul>
<li><asp:Label ID="lblAdmin" runat="server" Text="Wel come "></asp:Label></li>
<li class="logout"><asp:LinkButton ID="lnkLogout" runat="server" onclick="lnkLogout_Click"><span>Logout</span></asp:LinkButton></li>
</ul>
</div>
<div class="menu-search">
<ul>
<li>Home</li>
<li>Hotel
<ul>
<li>Hotel List</li>
<li>Add Hotel</li>
</ul>
</li>
<li>Hotel Album
<ul>
<li>Album List</li>
<li>Add Album</li>
</ul>
</li>
<li>Hotel Facility
<ul>
<li>Facility List</li>
<li>Add Facility</li>
</ul>
</li>
<li>Category
<ul>
<li>Category List</li>
<li>Add Category</li>
</ul>
</li>
<li class="current">Room Price
<ul>
<li>Price List</li>
<li>Add Price</li>
</ul>
</li>
<li>New Facility</li>
<li>Admin
<ul>
<li>Admin List</li>
<li>Add Admin</li>
</ul>
</li>
<li>Inquiry</li>
<li>Map</li>
</ul>
</div>
<div class="breadcrumbs">
<ul>
<li class="home"></li>
<li class="break">»</li>
<li>Add Room Price</li>
</ul>
</div>
<div class="section">
<div class="box">
<div class="title">
<h2>Add/Edit Room Category</h2>
</div>
<div class="content forms">
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<div class="line padding-left50">
<label>Hotel</label>
<asp:DropDownList ID="ddlHotel" runat="server" AutoPostBack="true"
onselectedindexchanged="ddlHotel_SelectedIndexChanged">
</asp:DropDownList>
</div>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="ddlHotel" EventName="selectedindexchanged" />
</Triggers>
</asp:UpdatePanel>
<asp:UpdatePanel ID="UpdatePanel2" runat="server">
<ContentTemplate>
<div class="line padding-left50">
<label>Room Category</label>
<asp:DropDownList ID="ddlCategory" runat="server">
</asp:DropDownList>
</div>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="ddlHotel" EventName="selectedindexchanged" />
</Triggers>
</asp:UpdatePanel>
<div class="line padding-left50">
<label>Single Price</label>
<asp:TextBox ID="txtSingle" runat="server" class="medium"></asp:TextBox>
</div>
<div class="line padding-left50">
<label>Double Price</label>
<asp:TextBox ID="txtDouble" runat="server" class="medium"></asp:TextBox>
</div>
<div class="line padding-left50">
<label>Extra Bed Price</label>
<asp:TextBox ID="txtExtraBed" runat="server" class="medium"></asp:TextBox>
</div>
<div class="line padding-left50">
<label>Meal Plan</label>
<asp:TextBox ID="txtMealPlan" runat="server" class="medium"></asp:TextBox>
</div>
<div class="line padding-left50">
<label>Extra Meal Price</label>
<asp:TextBox ID="txtExtraMeal" runat="server" class="medium"></asp:TextBox>
</div>
<div class="line button" style="padding-left:325px">
<asp:Button ID="btnSubmit" runat="server" Text="Sumbit" CssClass="btn btn-2 btn-2d" onclick="btnSubmit_Click"></asp:Button>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="js/superfish.js"></script>
<script type="text/javascript" src="js/supersubs.js"></script>
<script type="text/javascript" src="js/hoverIntent.js"></script>
<script type="text/javascript" src="js/jquery.flot.js"></script>
<script type="text/javascript" src="js/jquery.graphtable-0.2.js"></script>
<script type="text/javascript" src="js/jquery-ui.js"></script>
<script type="text/javascript" src="js/customInput.jquery.js"></script>
<script type="text/javascript" src="js/jquery.tablesorter.js"></script>
<script type="text/javascript" src="js/jquery.tablesorter.pager.js"></script>
<script type="text/javascript" src="js/jquery.sparkbox-select.js"></script>
<script type="text/javascript" src="js/jquery.fancybox-1.3.4.js"></script>
<script type="text/javascript" src="js/jquery.filestyle.mini.js"></script>
<script type="text/javascript" src="js/date.js"></script>
<script type="text/javascript" src="js/jquery.datepicker.js"></script>
<script type="text/javascript" src="js/jquery.treeview.js"></script>
<script type="text/javascript" src="js/jquery.tipsy.js"></script>
<script type="text/javascript" src="js/jquery.wysiwyg.js"></script>
<script type="text/javascript" src="js/plugins/wysiwyg.rmFormat.js"></script>
<script type="text/javascript" src="js/controls/wysiwyg.image.js"></script>
<script type="text/javascript" src="js/controls/wysiwyg.link.js"></script>
<script type="text/javascript" src="js/controls/wysiwyg.table.js"></script>
<script type="text/javascript" src="js/inline.js"></script>
</form>
</body>
</html>
and here is CS code
using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
using BLL;
public partial class AddRoomPrice : System.Web.UI.Page
{
clsbll bll = new clsbll();
protected void Page_Load(object sender, EventArgs e)
{
if (Session["admin"] != null)
{
lblAdmin.Text = "Wel Come " + Session["admin"].ToString();
}
else
{
Response.Redirect("Login.aspx");
}
if (!Page.IsPostBack)
{
if (Session["hotelID"] != null)
{
ddlHotel.SelectedValue = Session["hotelID"].ToString();
}
ddlHotel.DataSource = bll.getHotel();
ddlHotel.DataTextField = "HName";
ddlHotel.DataValueField = "HotelID";
ddlHotel.DataBind();
ddlHotel.Items.Insert(0, "Select Hotel");
}
}
protected void btnSubmit_Click(object sender, EventArgs e)
{
bll.insertRoomPrice(txtSingle.Text, txtDouble.Text, txtExtraBed.Text, txtMealPlan.Text, txtExtraMeal.Text, Convert.ToInt32(ddlCategory.SelectedValue), Convert.ToInt32(ddlHotel.SelectedValue));
txtSingle.Text = "";
txtDouble.Text = "";
txtExtraBed.Text = "";
txtMealPlan.Text = "";
txtExtraMeal.Text = "";
ddlCategory.SelectedIndex = 0;
ddlHotel.SelectedIndex = 0;
Session.Remove("hotelID");
//Session.Remove("hotel");
}
protected void ddlHotel_SelectedIndexChanged(object sender, EventArgs e)
{
ddlCategory.DataSource = bll.getCategoryByID(ddlHotel.SelectedValue);
ddlCategory.DataTextField = "RCategoryNameBed";
ddlCategory.DataValueField = "RCategoryID";
ddlCategory.DataBind();
ddlCategory.Items.Insert(0, "Select Category");
}
protected void lnkLogout_Click(object sender, EventArgs e)
{
Session.Remove("admin");
Response.Redirect("Login.aspx");
}
}
So please reply as soon as possible
Thanks

It is not you calling the page load function, that is the way ASP.NET works. The page posts to itself, thus calling the page_load function, when any Server controls on the page are fired (those which as set to postback).
What you need to do is to put some checks to differentiate between an initial page load and a post back
if(!IsPostBack)
{
//Code when initial loading
}
else
{
// code when post back
}

UpdatePanel control has been designed to refresh only its content.
For filtering purpose you can choose one of these methods:
All related DropDownLists must be placed inside one UpdatePanel.
or
First UpdatePanel and its content must be nested in second UpdatePanel.(Not Recommended)
There is no need to declare AsyncPostBackTrigger in both methods.
Good luck.

Maybe following code resolve the problem:
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
if (Session["admin"] == null)
Response.Redirect("Login.aspx");
else
{
lblAdmin.Text = "Welcome " + Session["admin"].ToString();
ddlHotel.Items.Clear();
ddlHotel.Items.Add(new ListItem("Select Hotel", ""));
ddlHotel.AppendDataBoundItems = true;
ddlHotel.DataSource = bll.getHotel();
ddlHotel.DataTextField = "HName";
ddlHotel.DataValueField = "HotelID";
ddlHotel.DataBind();
if (Session["hotelID"] == null)
ddlHotel.SelectedIndex = 0;
else
ddlHotel.SelectedValue = Session["hotelID"].ToString();
ddlHotel_SelectedIndexChanged(null,null);
}
}
}
protected void ddlHotel_SelectedIndexChanged(object sender, EventArgs e)
{
ddlCategory.Items.Clear();
ddlCategory.Items.Add(new ListItem("Select Category", ""));
ddlCategory.AppendDataBoundItems = true;
ddlCategory.DataSource = bll.getCategoryByID(ddlHotel.SelectedValue);
ddlCategory.DataTextField = "RCategoryNameBed";
ddlCategory.DataValueField = "RCategoryID";
ddlCategory.DataBind();
}
if not, I am so sorry, I can not help you more.

Related

I want to show data from model in asp c#

I am using this
private RepoMember repoMember = new RepoMember();
public List<Member> mem { get; set; }
protected void Page_Load(object sender, EventArgs e)
{
if (!this.IsPostBack)
{
mem = repoMember.GetAll().ToList();
}
}
RepoMember is the generic repository and GetAll() works as the name getAll to get all the members.
I am using this in aspx file
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<div>
<% foreach (Member m in mem)
{ %>
<div class="abc">
<div class="pqr">
<asp:Label Text="<%=m.Id%>" runat="server" ID="lblEmpName"></asp:Label>
</div>
</div>
<% } %>
</div>
</form>
But it shows <%=m.Id%> in the webpage.
I want to show the list of Ids on the webpage.
I am new to asp.net.
Please help.
I am using Entity Framework with MySql Database.
Edit:
Got that I can not use asp label for that but below is working
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<div>
<% foreach (Member m in mem)
{ %>
<div class="abc">
<div class="pqr">
<div><%=m.Id%></div>
</div>
</div>
<% } %>
</div>
</form>
I do not understand why...

how to code behind a html button?

I am trying to redirect to Search.aspx after login button is clicked. the login button is a html5 button. I googled and they say to make it work is to add the runat="server" and önserverclick="Button1_Click". After I done that, I double click on the login button on design mode. and it generates
function Button1_onclick() {
}
I put the Response.Redirect("Search.aspx"); inside the function. And it still have no effect when I click the Login button.
SOURCE CODE
<%# Page Language="C#" AutoEventWireup="true" CodeFile="Login.aspx.cs" Inherits="Login" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
</style>
<link rel="stylesheet" type="text/css" href="stylesheets/loginstyle.css" />
<script language="javascript" type="text/javascript">
// <![CDATA[
function Button1_onclick() {
Response.Redirect("Search.aspx");
}
// ]]>
</script>
</head>
<body>
<div id="wrapper">
<form name="login-form" class="login-form" action="" method="post">
<div class="header">
<h1>Login Form</h1>
<span>Fill out the form below to login to my super awesome imaginary control panel.</span>
</div>
<div class="content">
<input name="username" type="text" class="input username" placeholder="Username" />
<div class="user-icon"></div>
<input name="password" type="password" class="input password" placeholder="Password" />
<div class="pass-icon"></div>
</div>
<div class="footer">
<input type="button" name="submit" value="Login" class="button" runat="server" id="Button1" önserverclick="Button1_Click" onclick="return Button1_onclick()" />
</div>
</form>
</div>
<div class="gradient"></div>
</body>
</html>
CODE BEHIND CODE(NOCODE)
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class Login : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
}
try below code I hope it would help!!
function Button1_onclick()
{
window.location.assign("Search.aspx")
}

Compiler error on asp.net page with form submit

I try to firean submit via an asp button. I got the error that there is no definition vor SubmitBtn_Click in 'ASP.default_aspx.
BootstrapASP.Master:
<%# Master Language="C#" AutoEventWireup="true" CodeBehind="BootstrapASP.master.cs" Inherits="Shift.BootstrapASP" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html" charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>Shift</title>
<link type="text/css" rel="stylesheet" href="css/bootstrap.css" />
<link type="text/css" rel="stylesheet" href="css/main.css" />
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
<![endif]-->
<asp:ContentPlaceHolder ID="head" runat="server"></asp:ContentPlaceHolder>
</head>
<body>
<div>
<asp:ContentPlaceHolder ID="ContentMain" runat="server"></asp:ContentPlaceHolder>
</div>
<script src="js/jquery-1.10.2.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/interactive.js"></script>
</body>
</html>
Default.aspx:
<%# Page Title="Shift" Language="C#" MasterPageFile="~/BootstrapASP.Master" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Shift.WebForm1" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server"></asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentMain" runat="server">
<div class="container content-wrapper">
<form role="form" runat="server">
<div class="row">
<div class="col-md-4 col-md-offset-7">
<asp:LinkButton ID="SubmitBtn" runat="server" OnClick="SubmitBtn_Click" CssClass="btn btn-danger btn-lg pull-right">
<span class="glyphicon glyphicon-import"></span> Senden
</asp:LinkButton>
</div>
</div>
<div class="row">
<div class="col-md-4 col-md-offset-1">
<h1>Set Down</h1>
<hr />
<div id="down-form-holder">
<div class="form-group">
<label for="old-pc-ci">Computer CI*</label>
<input type="text" class="form-control" name="old-pc-ci" id="old-pc-ci" />
</div>
<div class="form-group">
<label for="old-mon-ci">Monitor CI*</label>
<input type="text" class="form-control" name="old-mon-ci[]" id="old-mon-ci" />
</div>
</div>
<button type="button" id="old-add-monitor" class="btn btn-default btn-sm pull-right">
<span class="glyphicon glyphicon-plus"></span> Monitor
</button>
</div>
</div>
</form>
</div>
</asp:Content>
In the Default.aspx.cs I created an eventhandler for the "SubmitBtn_Click"
Default.aspx.cs:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace Shift
{
public partial class WebForm1 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
void SubmitBtn_Click(Object sender, EventArgs e)
{
}
}
}
Methods in C# are private by default, so your click handler is not visible from the markup. Common practice is to make them protected:
protected void SubmitBtn_Click(Object sender, EventArgs e)
Your event needs to be protected, the way you have it is defaulting to private:
protected void SubmitBtn_Click(Object sender, EventArgs e)
{
}
protected void SubmitBtn_Click(object sender, EventArgs e)
{
}
<asp:LinkButton ID="SubmitBtn" runat="server" OnClick="SubmitBtn_Click" CssClass="btn
btn-danger btn-lg pull-right">
<span class="glyphicon glyphicon-import"></span> Senden</asp:LinkButton>

Slideshow didn't work

I spent > 8 hours today just to make my slide works but unfortunately it didn't work.It only display the 4 static images.. Why it doesn't work? Can anybody tell me? Here is my code.
asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
<style type="text/css" media="screen">
.slides_container {
width:570px;
height:270px;
}
.slides_container div {
width:570px;
height:270px;
display:block;
}
</style>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="slides.js"></script>
<script>
$(function() {
$("#slides").slides({
preload: true
});
});
</script>
.........................
<div id="slides">
<div class="slides_container">
<div> <img src= "folder/6.jpg" /></div>
<div><img src="folder/7.jpg" /></div>
<div><img src="folder/extreme.jpg" /></div>
<div><img src="folder/alza.jpg" /></div>
</div>
</div>
Someone who knows my problem, please help me. Appreciate that. Have a nice Tuesday :)
I assume you make use of SlideJS? If I am correct - have a look at this demo code - which worked for me
<style type="text/css" media="screen">
.slides_container
{
width: 570px;
height: 270px;
}
.slides_container div
{
width: 570px;
height: 270px;
display: block;
}
</style>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<!-- downloaded from SlideJS and put it in a js folder -->
<script src="js/slides.min.jquery.js"></script>
<script>
$(function () {
$("#slides").slides({
preload: true
});
});
</script>
<div id="slides">
<div class="slides_container">
<div>
<img src="pic/1.jpg" /></div>
<div>
<img src="pic/2.jpg" /></div>
<div>
<img src="pic/3.jpg" /></div>
<div>
<img src="pic/4.jpg" /></div>
</div>
</div>

How to get the selected values of jQuery multi select UI in codebehind?

I have the jQuery UI multiselect. I need the selected values on button click in the codebehind.
.aspx Page:
<select id="countries" runat="server" class="multiselect" name="countries[]">
</select>
<asp:Button id="Submit" runat="server" OnClick="btn_OnClick"></asp:Button>
.cs Page:
protected void Page_Load(object sender, EventArgs e) {
countries.Attributes.Add("multiple", "multiple");
for(int i=0; i<10; i++) {
countries.Items.Add(i.ToString());
}
}
protected void btn_OnClick(object sender, EventArgs e) { }​
You will need to change your select element to this (the options are just examples):
<select runat="server" id="countries" multiple="true" class="multiselect">
<option label="1" value="1" />
<option label="2" value="2" />
<option label="3" value="3" />
<option label="4" value="4" />
<option label="5" value="5" />
</select>
You left out the runat="server", and the multiple property must be true instead of "multiple". ASP.NET will take care of the name attribute for you.
In the code behind, you will need to iterate through all of the select's items and check their selected property, like this:
protected void btn_OnClick(object sender, EventArgs e)
{
for (int i = 0; i < countries.Items.Count; i++)
{
if (countries.Items[i].Selected)
{
// do something
// countries.Items[i].Value;
}
}
}
.aspx Page:
<link rel="stylesheet" href="css/common.css" type="text/css" />
<script type="text/javascript" src="js/page.js"></script>
<link type="text/css" rel="stylesheet" href="css/themes/smoothness/jquery-ui-1.7.1.custom.css" />
<link type="text/css" href="css/ui.multiselect.css" rel="stylesheet" />
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<link href="js/style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery-ui-1.8.custom.min.js"></script>
<script type="text/javascript" src="js/plugins/localisation/jquery.localisation-min.js"></script>
<script type="text/javascript" src="js/plugins/tmpl/jquery.tmpl.1.1.1.js"></script>
<script type="text/javascript" src="js/plugins/blockUI/jquery.blockUI.js"></script>
<script type="text/javascript" src="js/ui.multiselect.js"></script>
<script type="text/javascript">
$(function () {
// remote
$("#languages").multiselect({
});
});
</script>
<form target="submitFrame" runat="server">
<div>
<dl>
<dd>
<select id="languages" class="multiselect" runat="server" name="languages[]">
</select>
</dd>
</dl>
</div>
<div class="optionWrapper">
<div class="optionInput">
<input id="ec_checkValues" type="button" class="button" value="Assign Employees" />
Selected Employees:
<input id="hdn" type="text" />
</div>
.cs Page:
protected void Page_Load(object sender, EventArgs e)
{
languages.Attributes.Add("multiple", "multiple");
DataTable dt = obj.GetDataStoreInTable("Select top 10 intslno, nvrempname from tblHRIMS_employeedetail");
languages.DataSource = dt;
languages.DataTextField = "nvrempname";
languages.DataValueField = "intslno";
languages.DataBind();
}

Categories