Calendar extender is not working - asp.net

I have a requirement to show edit panel as second row of a datagrid upon addnew link click. for this I have taken a div which has set display:none. I am able to show as second row upon addnew link click. now the actual problem starts.
this div got a text box which is tied to calendar extender to behave as a claendar upon textbox click. but calendar is not showing up when the html of invisible div is inserted as second row of grid. please let me know if anyone need code for better understanding the problem. any help will be appreciated.

In your gridview put a templatedfield instead of a div. make that templated field hold a textbox and calender extender.
<asp:GridView ID="GridView1" runat="server">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<asp:TextBox ID="textbox1" runat="server"></asp:TextBox>
<asp:CalendarExtender ID="CalendarExtender1" TargetControlID="textbox1" runat="server">
</asp:CalendarExtender>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
but If you want it when your inserting you should put
<asp:GridView ID="GridView1" runat="server">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<asp:TextBox ID="textbox1" runat="server"></asp:TextBox>
<asp:CalendarExtender ID="CalendarExtender1" TargetControlID="textbox1" runat="server">
</asp:CalendarExtender>
</ItemTemplate>
<InsertItemTemplate>
<asp:TextBox ID="textbox1" runat="server"></asp:TextBox>
<asp:CalendarExtender ID="CalendarExtender1" TargetControlID="textbox1" runat="server">
</asp:CalendarExtender>
</InsertItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
I hope this helps.

<%# Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%# Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="AjaxControlToolkit" %>
<!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>
<script src="jquery-1.4.1.js" type="text/javascript"></script>
<script type="text/javascript">
function AddCalendars()
{
//The last parameter should be the TargetControl's id. If you use "TextBox1", the TextBox1 would be associated.
var elem = $(".deneme");
for (var a = 0; a < elem.length; a++)
{
if ($find("CalendarExtender" + elem[a].id))
{
$find("CalendarExtender" + elem[a].id).dispose();
}
}
for (var i = 0; i < elem.length; i++)
{
$create(AjaxControlToolkit.CalendarBehavior, { "id": "CalendarExtender" + elem[i].id }, null, null, elem[i]);
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server" />
<%--the dummy calendar which is used to download the related script file.--%>
<asp:TextBox ID="dummyTextBox" runat="server" Style="display: none"></asp:TextBox>
<AjaxControlToolkit:CalendarExtender ID="dummyCalendarExtender" runat="server" Enabled="True"
TargetControlID="dummyTextBox">
</AjaxControlToolkit:CalendarExtender>
<%--the dummy calendar which is used to download the related script file.--%>
<asp:Button ID="Button1" OnClientClick="AddCalendars();return false" runat="server"
Text="CreateCalendarFromClient" /><br />
input:<input id="deneme1" type="text" class="deneme" /><br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
TextBox:
<asp:TextBox ID="deneme2" runat="server" cssclass="deneme" ClientIDMode="Static"></asp:TextBox>
</div>
</form>
</body>
</html>

Related

gridview in a formtag which is in a content place holder tag doesnt accept

<!DOCTYPE html>
<asp:Content ID="content1" ContentPlaceHolderID="head" runat="server">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:GridView ID="gvapproveweekend" runat="server" BackColor="#DEBA84" BorderColor="#DEBA84" BorderStyle="None" BorderWidth="1px" CellPadding="3" CellSpacing="2" OnRowCommand = "OnRowCommand">
<Columns>
<asp:ButtonField ButtonType="Button" CommandName="Approve" Text="Approve" />
<asp:ButtonField ButtonType="Button" CommandName="Reject" Text="Reject" />
</Columns>
</asp:GridView>
<asp:SqlDataSource ID="SqlData" runat="server"></asp:SqlDataSource>
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
</div>
</form>
</body>
</html>
</asp:Content>
I commented the Form tag and tried executing but getting this error
"Control 'head_gvapproveweekend' of type 'GridView' must be placed inside a form tag with runat=server. "
If i keep the form for the sake og grid another error is thrown "A page can have only one server-side Form tag. "
Need a solution for this thanks in advance

How can i do the following in asp.net?

I am trying to create a simple course registration web site in asp.net. I am now creating a page that allows a user to create a course. Here is the related user interface:
And here is the code of this page:
<%# Page Language="C#" AutoEventWireup="true" CodeFile="AdminCreateCourse.aspx.cs"
Inherits="AdminCreateCourse" %>
<!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">
.style1
{
font-size: x-large;
}
.style3
{
font-size: small;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div class="style1">
<strong>Create Course</strong></div>
<p>
</p>
<p>
Instructor Name:
<asp:DropDownList ID="dInstructorSelect" runat="server" DataSourceID="SqlDataSource1"
DataTextField="FullName" DataValueField="FullName" Height="16px" Width="202px">
</asp:DropDownList>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:ConnectionString %>"
SelectCommand="SELECT [Name] + ' ' + [Surname] as FullName FROM [InstructorTable] ORDER BY [Name]">
</asp:SqlDataSource>
</p>
<p>
Course Name:
<asp:TextBox ID="tCourseName" runat="server"></asp:TextBox>
</p>
<p>
Course ID<br />
(Subject/Course):
<asp:DropDownList ID="dSubject" runat="server" Width="70px">
<asp:ListItem>CS</asp:ListItem>
<asp:ListItem>CULT</asp:ListItem>
<asp:ListItem>ECON</asp:ListItem>
<asp:ListItem>IS</asp:ListItem>
<asp:ListItem>MAN</asp:ListItem>
<asp:ListItem>SPS</asp:ListItem>
<asp:ListItem>VACD</asp:ListItem>
<asp:ListItem>BIO</asp:ListItem>
<asp:ListItem>EE</asp:ListItem>
<asp:ListItem>EL</asp:ListItem>
<asp:ListItem>MAT</asp:ListItem>
<asp:ListItem>ME</asp:ListItem>
<asp:ListItem>MS</asp:ListItem>
<asp:ListItem>TE</asp:ListItem>
</asp:DropDownList>
<asp:TextBox ID="tCourse" runat="server" Width="70px"></asp:TextBox>
</p>
<p>
CRN:
<asp:TextBox ID="tCRN" runat="server"></asp:TextBox>
</p>
<p>
Level:
<asp:DropDownList ID="dLevel" runat="server">
<asp:ListItem>Undergraduate</asp:ListItem>
<asp:ListItem>Graduate</asp:ListItem>
</asp:DropDownList>
</p>
<p>
Term:
</p>
<p>
Course Description:
</p>
<p>
<asp:TextBox ID="tCourseDescription" runat="server" Height="138px" Width="406px"></asp:TextBox>
</p>
<p>
Capacity:
<asp:TextBox ID="tCapacity" runat="server"></asp:TextBox>
</p>
<p>
Class Hour and Day: <span class="style3">Start Hour:
<asp:DropDownList ID="dHourStart" runat="server">
<asp:ListItem>8:40</asp:ListItem>
<asp:ListItem>9:40</asp:ListItem>
<asp:ListItem>10:40</asp:ListItem>
<asp:ListItem>11:40</asp:ListItem>
<asp:ListItem>12:40</asp:ListItem>
<asp:ListItem>13:40</asp:ListItem>
<asp:ListItem>14:40</asp:ListItem>
<asp:ListItem>15:40</asp:ListItem>
<asp:ListItem>16:40</asp:ListItem>
<asp:ListItem>17:40</asp:ListItem>
<asp:ListItem>18:40</asp:ListItem>
<asp:ListItem>19:40</asp:ListItem>
</asp:DropDownList>
End Hour:
<asp:DropDownList ID="dHourEnd" runat="server">
<asp:ListItem>10:30</asp:ListItem>
<asp:ListItem>11:30</asp:ListItem>
<asp:ListItem>12:30</asp:ListItem>
<asp:ListItem>13:30</asp:ListItem>
<asp:ListItem>14:30</asp:ListItem>
<asp:ListItem>15:30</asp:ListItem>
<asp:ListItem>16:30</asp:ListItem>
<asp:ListItem>17:30</asp:ListItem>
<asp:ListItem>18:30</asp:ListItem>
<asp:ListItem>19:30</asp:ListItem>
<asp:ListItem>20:30</asp:ListItem>
<asp:ListItem>9:30</asp:ListItem>
</asp:DropDownList>
Day:</span> <asp:DropDownList ID="dDay" runat="server">
<asp:ListItem>Monday</asp:ListItem>
<asp:ListItem>Tuesday</asp:ListItem>
<asp:ListItem>Wednesday</asp:ListItem>
<asp:ListItem>Thursday</asp:ListItem>
<asp:ListItem>Friday</asp:ListItem>
</asp:DropDownList>
<asp:Button ID="bAddCourseHour" runat="server" Text="Add" OnClick="bAddCourseHour_Click" />
</p>
<p>
Prerequisites:
<asp:TextBox ID="tPreq1" runat="server" Width="100px"></asp:TextBox>
<asp:TextBox ID="tPreq2" runat="server" Width="100px"></asp:TextBox>
<asp:TextBox ID="tPreq3" runat="server" Width="100px"></asp:TextBox>
</p>
<asp:Button ID="bSubmit" runat="server" Text="Submit" OnClick="bSubmit_Click" />
<asp:Button ID="bClear" runat="server" Text="Clear" OnClick="bClear_Click" />
</form>
</body>
</html>
My question is, a course may be held in more than one different days, but my interface only allows one day. Should i handle this using AJAX, or is there any other way? If i should use ajax, how can i do this?
Thanks
I assume you are looking for a way to allow multiple selections on the "Day" field. If so, you have at least couple of options here:
1) Either use the CheckBoxList Control (http://msdn.microsoft.com/enIN/library/8bw4x4wa(v=vs.90).aspx).
2) Or, if real estate is an issue, use the DropDownCheckBoxes control at http://dropdowncheckboxes.codeplex.com/

link button click not getting fired

I am sorry I am repeating this question. Rather, I am having to repeat it. The last time I posted this, I dint get an answer. I have googled for more than 3 hrs, dint find an answer. Heres the html for the linkbutton and the modal popup. The link button is inside/on a tab panel and auto postback is set to true.
<asp:LinkButton ID="lnkAddNewAddress" runat="server" OnClick="lnkAddNewAddress_Click">Click Here To Add New Address</asp:LinkButton>
<asp:ModalPopupExtender ID="lnkAddNewAddress_ModalPopupExtender" runat="server" BackgroundCssClass="modalBackground"
DynamicServicePath="" Enabled="True" PopupControlID="pnlMyAddressBook" TargetControlID="lnkAddNewAddress"
ViewStateMode="Enabled" >
</asp:ModalPopupExtender>
I want the clickevent of the linkbutton to fire which is not happening. However clicking on the link does open the modal popup extender (which is also something I want)... How do I get into the click event. I know that a postback is being avoided here because of the modal popup probably...but I dont the solution for it....
The code on save button:
if(hdnfld.Value.ToString()!=null)
{
if(hdnfld.Value.ToString()=="Save")
{
SaveNewAddress();
}
else
{
UpdateAddress();
}
<%# Page StylesheetTheme="" Title="" Language="C#" MasterPageFile="~/Site.Master"
AutoEventWireup="true" CodeBehind="frmMyAccountMyProfile.aspx.cs" Inherits="WebApplication1.frmMyAccountMyProfile" %>
<%# Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
<script type="text/javascript">
function CheckType(type)
{
document.getElementById("hdnfld").value = type;
alert(document.getElementById("hdnfld").value);
return false;
}
</script>
<link href="Styles/myStyleSheet.css" rel="stylesheet" type="text/css" />
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<div class="divwrap">
<table style="width: 100%; margin-right: 0px;">
<tr>.........
<td>
<asp:LinkButton ID="lnkAddNewAddress" runat="server" OnClientClick="return CheckType('Save');">Click Here To Add New Address</asp:LinkButton>
<asp:HiddenField ID="hdnfld" runat="server" />
<asp:ModalPopupExtender ID="lnkAddNewAddress_ModalPopupExtender" runat="server" BackgroundCssClass="modalBackground" DynamicServicePath="" Enabled="True" PopupControlID="pnlMyAddressBook" TargetControlID="lnkAddNewAddress"
ViewStateMode="Enabled">
</asp:ModalPopupExtender>
...........
<asp:Button ID="btnEdit" runat="server" CssClass="roundcorner btn" OnClick="btnEdit_Click" OnClientClick="return CheckType('Edit');" Text="Edit" />
<asp:Panel ID="pnlMyAddressBook" runat="server" BackColor="White" CssClass="roundcorner">
you can use hidden field instead of viewstate, if you really want to retain some value at code behind. You can access hidden field at client side as well as in code behind too.
<asp:LinkButton ID="lnkAddNewAddress" runat="server" OnClientClick="return CheckType('save');">Click Here To Add New Address</asp:LinkButton>
<asp:HiddenField ID="hdf_type" runat="server" />
Javascript code
function CheckType(type) {
document.getElementById("hdf_type").value = type;
return false;
}
Access value in code behind when clicked on save button, and perform your action save or update according to value in hidden field.
hdf_type.Value.ToString();
MORE HELP FOR YOU
HTML FILE SHOULD LOOK LIKE THIS
below i'm posting the whole code which is working fine for me.
<head runat="server">
<title></title>
<script type="text/javascript">
function CheckType(type) {
document.getElementById("hdf_type").value = type;
alert(document.getElementById("hdf_type").value);
return false;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<div>
<asp:LinkButton ID="lnkAddNewAddress" runat="server" OnClientClick="return CheckType('save');">Click Here To Add New Address</asp:LinkButton>
<asp:Button ID="btn" runat="server" OnClientClick="return CheckType('edit');" Text="Click Here To Add New Address" />
<asp:ModalPopupExtender ID="lnkAddNewAddress_ModalPopupExtender" runat="server" BackgroundCssClass="modalBackground"
DynamicServicePath="" Enabled="True" PopupControlID="pnlMyAddressBook" TargetControlID="lnkAddNewAddress"
ViewStateMode="Enabled">
</asp:ModalPopupExtender>
<div id="pnlMyAddressBook" style="height: 100px; width: 100px; display: none; background-color: Gray">
<asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" /><br />
</div>
<asp:HiddenField ID="hdf_type" runat="server" />
</div>
</form>
getting value at code behind:
Try this:
<asp:LinkButton ID="lnkAddNewAddress" runat="server" OnClick="lnkAddNewAddress_Click">Click Here To Add New Address</asp:LinkButton>
<asp:ModalPopupExtender ID="lnkAddNewAddress_ModalPopupExtender" runat="server" BackgroundCssClass="modalBackground"
DynamicServicePath="" Enabled="True" PopupControlID="pnlMyAddressBook" TargetControlID="btnHidden">
</asp:ModalPopupExtender>
<asp:Button ID="btnHidden" runat="server" style="Display:none;" Text="Button"/>
In Code behind:
protected void lnkAddNewAddress_Click(object sender, EventArgs e)
{
lnkAddNewAddress_ModalPopupExtender.Show();
}

AJAX GridView Not Updating

I am using a update panel and placing the SqlDataSource as well as the GridView inside the contenttemplate
i've set timercontrol as the asyncpostback trigger but the gridview does not update when i change a record from the related table in sqlserver plus what seems even more crazy is that the deleted record still shows up in the grid view when i do refresh(full post back of page)
Also i've disabled caching for the datasource however this aint wrking HELP!!!!!
here's my code
<%# Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs"
Inherits="_Default" %>
<!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>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
</div>
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="true">
<ContentTemplate>
<div id="ajx">
<div>
<asp:SqlDataSource ID="SqlDataSource1" runat="server"
ConnectionString="<%$ ConnectionStrings:busConnectionString %>"
SelectCommand="SELECT * FROM [reserv]" EnableCaching="false" CacheDuration="0" CacheExpirationPolicy="Absolute" EnableViewState="false"></asp:SqlDataSource>
</div>
<div>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
DataSourceID="SqlDataSource1" EnableModelValidation="True">
<Columns>
<asp:BoundField DataField="SeatNo" HeaderText="SeatNo"
SortExpression="SeatNo" />
<asp:BoundField DataField="Status" HeaderText="Status"
SortExpression="Status" />
</Columns>
</asp:GridView>
</div>
<div>
<asp:Timer ID="Timer1" runat="server" Interval="1000" ontick="Timer1_Tick">
</asp:Timer>
</div>
<div>
<asp:Label ID="Label1" runat="server" Text=""></asp:Label>
</div>
</div>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="Timer1"/>
</Triggers>
</asp:UpdatePanel>
</form>
</body>
</html>
You'll have to manually databind the datasource and gridview on each tick of the timer.
Add the following to your Timer1_Tick event:
protected void Timer1_Tick(object sender, EventArgs e)
{
SqlDataSource1.DataBind();
GridView1.DataBind();
}

AjaxToolkit ModalPopupExtender: How do I set focus to a control in the popup Panel?

When the user pushes the Button, I'd like to display a modal dialog box to capture a couple of values from text boxes and submit these values to the server.
When the modal box is shown, I'd like the cursor to be placed in the txtFirst textbox.
How do I do this? I've had trouble with registerscript commands before, so if one is needed, I hope the syntax, if you provide it, is correct.
Thanks
<%# Page Language="VB" AutoEventWireup="false" CodeFile="MyModalSimple.aspx.vb" Inherits="MyModalSimple" %>
<%# Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="cc1" %>
<!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>
<script type="text/javascript">
function onOk() {
form1.submit();
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:Button ID="Button1" runat="server" Text="Button" />
<cc1:modalpopupextender id="Button1_ModalPopupExtender" runat="server" targetcontrolid="Button1"
popupcontrolid="pnlModal" okcontrolid="btnOK" cancelcontrolid="btnCancel" DropShadow="true" OnOkScript="onOk();">
</cc1:modalpopupextender>
<asp:Panel ID="pnlModal" runat="server" Style="display: None1"
BackColor="#CCCCCC">
<br />
<table>
<tr>
<td>
<asp:Label ID="lblFirst" runat="server" Text="First"></asp:Label>
</td>
<td>
<asp:TextBox ID="txtFirst" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td>
<asp:Label ID="lblLast" runat="server" Text="Last"></asp:Label>
</td>
<td>
<asp:TextBox ID="txtLast" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td>
</td>
<td align="right">
<asp:Button ID="btnOK" runat="server" Text="OK" />
<asp:Button ID="btnCancel" runat="server" Text="Cancel" />
</td>
</tr>
</table>
<br />
<br />
</asp:Panel>
</div>
</form>
</body>
</html>
Also, how could I change the above code so that the modal dialog was displayed as a result of a selection of a dropdownlist item? If I set the targetcontrolid="DropDownList1", the dialog box is display when it drops rather than when a selection is made
An example can be found here. In essence you are using javascript.
I know this was already answered, but here's an easier code:
C#:
ScriptManager.RegisterStartupScript(this, this.GetType(), "FocusScript", "setTimeout(function(){$get('" + btnOk.ClientID + "').focus();}, 100);", true);
VB:
ScriptManager.RegisterStartupScript(Me, Me.[GetType](), "FocusScript", "setTimeout(function(){$get('" + btnOk.ClientID + "').focus();}, 100);", True)
Remove Style="display: None1" from control panel

Resources