Calendar Control Behaving Badly - c#

I have a problem with a user control containing a calendar control.
It looks OK in the design view in Visual Studio 2015:
However, in the browser, any browser, it looks like this:
I have tried to set the width to 330px wherever I can think of, but it always seems to get the width 1084 somehow!?
Where is the problem?
Here is the code for the user control:
<%# Control Language="C#" AutoEventWireup="true" CodeBehind="TimeKalender.ascx.cs" Inherits="Blodbanken.TimeKalender" %>
<link rel="Stylesheet" type="text/css" href="StyleSheet1.css" id="style" runat="server" visible="false" />
<div class="kalender" style="width:330px;">
<asp:Calendar ID="Calendar1" runat="server" BackColor="White" BorderColor="Black" BorderStyle="Solid" CellSpacing="1" Font-Names="Verdana" Font-Size="9pt" ForeColor="Black" Height="250px" NextPrevFormat="ShortMonth" Width="100%">
<DayHeaderStyle Font-Bold="True" Font-Size="8pt" ForeColor="#333333" Height="8pt" />
<DayStyle BackColor="#CCCCCC" />
<NextPrevStyle Font-Bold="True" Font-Size="8pt" ForeColor="White" />
<OtherMonthDayStyle ForeColor="#999999" />
<SelectedDayStyle BackColor="#E60000" ForeColor="White" />
<TitleStyle BackColor="Red" BorderStyle="None" Font-Bold="True" Font-Size="12pt" ForeColor="White" Height="12pt" />
<TodayDayStyle BackColor="#999999" ForeColor="White" />
</asp:Calendar>
</div>
<asp:Label ID="lblLedigeTimer" runat="server" Text="Available appointments:" Font-Bold="True"></asp:Label>
<br />
<asp:CheckBoxList ID="CheckBoxList1" runat="server">
<asp:ListItem>08:00 </asp:ListItem>
<asp:ListItem>09:00 </asp:ListItem>
<asp:ListItem>10:00 </asp:ListItem>
<asp:ListItem>11:00 </asp:ListItem>
<asp:ListItem>12:00 </asp:ListItem>
<asp:ListItem>13:00 </asp:ListItem>
<asp:ListItem>14:00 </asp:ListItem>
<asp:ListItem>15:00 </asp:ListItem>
</asp:CheckBoxList>
<asp:Button ID="Button1" runat="server" Text="Book it!" Width="119px" />

I'm not sure if this is it since you stated that you set the width to 330px but in the sample HTML you set the width to 100%
<asp:Calendar ... NextPrevFormat="ShortMonth" Width="100%">
Take that out the width definition and let the size be defined by the parent div

Mystery solved!
It turned out that the asp:calendar-tag translates into a bunch og table-tags. And deeply nested in there are some a-tags that were affected by the css intended for the nav-menu.
Thanks for your input!

Related

To show ProgressBar onclick of Button inside GridView

I have a GridView in which the last Column has a Button which loads data.
Doing that takes like 2 Minutes.So, I need the user to know that some functions are going on in backend not that the screen is frozen
So,I need to show a ProgressBar on click of that button inside the GridView
How to do that??
I was searching for this for a while finally found it ,
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:UpdatePanel ID="UpdatePanel2" runat="server">
<ContentTemplate>
<asp:GridView ID="Gridview" OnRowDataBound="Gridview_RowDataBound" OnRowCommand="Gridview_RowCommand" runat="server" Style="text-align: center" ShowFooter="true" Width="99%"
AutoGenerateColumns="false">
<Columns>
<asp:TemplateField HeaderText="Total Customers" HeaderStyle-BackColor="#99CCCC">
<ItemTemplate>
<asp:Button ID="btnCombine" CssClass="btn-primary btn" Text="Combine"
Font-Bold="true"
CommandArgument="<%# ((GridViewRow) Container).RowIndex %>" CommandName="More"
Style="padding-top: 1%; padding-bottom: 1%; margin-top: 1px; margin-bottom: 1px" runat="server" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
<FooterStyle BackColor="#99CCCC" ForeColor="#003399" />
<PagerStyle BackColor="#99CCCC" ForeColor="#003399" HorizontalAlign="Left" />
<RowStyle BackColor="White" ForeColor="#003399" />
<SelectedRowStyle BackColor="#009999" Font-Bold="True" ForeColor="#CCFF99" />
<SortedAscendingCellStyle BackColor="#EDF6F6" />
<SortedAscendingHeaderStyle BackColor="#0D4AC4" />
<SortedDescendingCellStyle BackColor="#D6DFDF" />
<SortedDescendingHeaderStyle BackColor="#002876" />
</asp:GridView>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdateProgress ID="UpdateProgress2" runat="server" AssociatedUpdatePanelID="UpdatePanel2">
<ProgressTemplate>
<img src="images/progress_bar.gif" style="max-width: 250px" />
</ProgressTemplate>
</asp:UpdateProgress>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnAddi" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
just name the same ID of the button u use in controlID of the AsyncPostBackTrigger and AssociatedUpdatePanelID same name u put the GridView

zoom image in gridview

I am new to asp.net.I have gridview which displays data from database.One of the field contains image.The image which is shown dynamically as only image path is stored in database.
My table contains fields
Car_Name
Car_Id
Car_Photo
No_of_Seats
Now what i want is when user clicks on image i want a pop up image in modal.....or image should be zoomed something like that....
<%# Page Title="" Language="C#" MasterPageFile="~/Project/MasterPage/MasterPage.master"
AutoEventWireup="true" CodeFile="Reserve.aspx.cs" Inherits="Project_Reserve_Reserve" %>
<%# Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
<link href="reserve.css" rel="stylesheet" type="text/css" />
<script src="../../javascript/jquery-1.9.0.js" type="text/javascript"></script>
<%-- <script src="myscript.js" type="text/javascript"></script>
<script src="f12.js" type="text/javascript"></script>--%>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="homepageContentPlaceHolder" runat="Server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
Select Start Date
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:CalendarExtender ID="TextBox1_CalendarExtender" runat="server" Enabled="True"
TargetControlID="TextBox1">
</asp:CalendarExtender>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="TextBox1"
ErrorMessage="*"></asp:RequiredFieldValidator>
<br />
<br />
Select End Date
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
<asp:CalendarExtender ID="TextBox2_CalendarExtender" runat="server" Enabled="True"
TargetControlID="TextBox2">
</asp:CalendarExtender>
<asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="TextBox2"
ErrorMessage="*"></asp:RequiredFieldValidator>
<asp:AnimationExtender ID="RequiredFieldValidator2_AnimationExtender" runat="server"
Enabled="True" TargetControlID="RequiredFieldValidator2">
</asp:AnimationExtender>
<br />
<br />
<br />
Select Model <asp:DropDownList ID="ddlModel" runat="server"
AppendDataBoundItems="True" AutoPostBack="True" DataSourceID="SqlDataSource1"
DataTextField="Model_Name" DataValueField="Model_Id" OnSelectedIndexChanged="ddlModel_SelectedIndexChanged"
Width="100px">
<asp:ListItem Value="0">--Select--</asp:ListItem>
</asp:DropDownList>
<asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server" ControlToValidate="ddlModel"
ErrorMessage="Select a Model"></asp:RequiredFieldValidator>
<br />
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:ConnectionString %>"
SelectCommand="SELECT * FROM [Model]"></asp:SqlDataSource>
<br />
<br />
<br />
<asp:GridView ID="gvcar" runat="server" AllowPaging="True" AutoGenerateColumns="False"
CellPadding="4" ForeColor="#333333" GridLines="None" EmptyDataText="No data found!">
<AlternatingRowStyle BackColor="White" ForeColor="#284775" />
<Columns>
<asp:TemplateField HeaderText="Select">
<ItemTemplate>
<asp:CheckBox ID="CheckBox1" runat="server" />
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="Car_Name" HeaderText="Car Name" />
<asp:BoundField DataField="No_of_Seats" HeaderText="Seats" />
<asp:TemplateField HeaderText="Photo">
<ItemTemplate>
<asp:Image Width="300" Height="200" ID="Image1" runat="server" ImageUrl='<%# Eval("Car_Photo") %>' />
</ItemTemplate>
</asp:TemplateField>
</Columns>
<EmptyDataTemplate>
<div>
<h3>
<em>Sorry...No Car is available rightnow for this model</em></h3>
</div>
</EmptyDataTemplate>
<EditRowStyle BackColor="#999999" />
<FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
<HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
<RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
<SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
<SortedAscendingCellStyle BackColor="#E9E7E2" />
<SortedAscendingHeaderStyle BackColor="#506C8C" />
<SortedDescendingCellStyle BackColor="#FFFDF8" />
<SortedDescendingHeaderStyle BackColor="#6F8DAE" />
</asp:GridView>
<asp:Button runat="server" ID="btnModalPopUp" Style="display: none" />
<br />
<br />
<br />
<asp:Button ID="btnbook" runat="server" Text="Book" />
<asp:Button ID="btnCancel" runat="server" Text="Cancel" />
<br />
<br />
</ContentTemplate>
</asp:UpdatePanel>
</asp:Content>
Following links might be helpful to you:
http://technico.qnownow.com/zoom-image-on-mouse-over-in-asp-net-gridview-control/
and
http://www.aspdotnet-suresh.com/2011/12/jquery-fancy-zoom-effect-for-image-in.html
hope its helpful.

Freeze Title Header in gridview asp.net c#

I have a Title in my webpage, some texts,a textbox and a button. I have a large gridview that needs to be scrolled vertically and horizontally. What i want is, Even if I scroll the gridview, the Title in my webpage, some texts,a textbox and a button will still be in the same position or freeze.
here is my html code
<div>
Data Warehouse Calendar Maintenance
<br />
<br />
</div>
<p>
<asp:Label ID="Label1" runat="server" Text="Enter Date:"></asp:Label>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
</p>
<p>
<asp:Button ID="btn_View" runat="server" onclick="btn_View_Click" Text="View" />
</p>
<p>
<asp:GridView ID="GridView1" runat="server" BackColor="LightGoldenrodYellow"
BorderColor="Tan" BorderWidth="1px" CellPadding="5" Font-Names="Calibri"
Font-Size="Medium" Font-Underline="False" ForeColor="Black"
onrowdatabound="GridView1_RowDataBound"
onselectedindexchanged="GridView1_SelectedIndexChanged" Width="271px">
<RowStyle Wrap="False" />
<EmptyDataRowStyle Wrap="False" />
<FooterStyle BackColor="Tan" BorderColor="Black" BorderStyle="Solid"
Wrap="False" />
<PagerStyle BackColor="PaleGoldenrod" ForeColor="DarkSlateBlue"
HorizontalAlign="Center" Wrap="False" />
<SelectedRowStyle BackColor="DarkSlateBlue" ForeColor="GhostWhite"
Wrap="False"/>
<HeaderStyle BackColor="Tan" BorderStyle="Solid" Font-Bold="True"
Wrap="False" />
<EditRowStyle Wrap="False" />
<AlternatingRowStyle BackColor="PaleGoldenrod" Wrap="False" />
</asp:GridView>
</p>
Yes, You can do it very easily by using css. css has the property for postion. So set your postion fixed like this.
.Title
{
Position:Fixed;
Top:120px; // Set as per your requirement
Left:120px; // Set as per your requirement
}
apply title class to that Title div.
Same can be written for texts, Textbox and for button.
Refer this sample http://www.aspsnippets.com/Articles/Scrollable-GridView-with-Fixed-Headers-in-ASP.Net.aspx
It will be useful to your problem.

How to Bind Data in HTML Drop Down List

Can any one please tell me How to Bind Data from Sql DataBase to
DropDown List(Select Drop Down) using C#.net in Asp.net
OK! first youll have to write the javascript code using HTML in the client side using the selectedIndex function! you could read more about javascript in google , second you you bind your data in server side like this
dropdown1.DataSource = datatable;
dropdown1.DataBind();
OR read these links
http://shawpnendu.blogspot.com/2009/08/javascript-how-to-get-selectedtext-from.html
http://shawpnendu.blogspot.com/2009/05/how-to-bind-or-populate-data-into.html
i hope it helps you or at least show you the right directions or hints of what you want :)
Try this one ...you can achieve it
<script type="text/javascript">
function func() {
var grd = document.getElementById("Panel1");
grd.setAttribute("style", "display:inline;");
}
</script>
<asp:TextBox ID="txtDDL" CssClass="txtClass" runat="server" ReadOnly="true" onclick="javascript:func();" />
<asp:Panel ID="Panel1" runat="server" Style="display: none;">
<asp:GridView ID="GridView1" runat="server" BackColor="LightGoldenrodYellow" BorderColor="Tan"
BorderWidth="1px" CellPadding="2" ForeColor="Black" GridLines="None">
<AlternatingRowStyle BackColor="PaleGoldenrod" />
<FooterStyle BackColor="Tan" />
<HeaderStyle BackColor="Tan" Font-Bold="True" />
<PagerStyle BackColor="PaleGoldenrod" ForeColor="DarkSlateBlue" HorizontalAlign="Center" />
<SelectedRowStyle BackColor="DarkSlateBlue" ForeColor="GhostWhite" />
<SortedAscendingCellStyle BackColor="#FAFAE7" />
<SortedAscendingHeaderStyle BackColor="#DAC09E" />
<SortedDescendingCellStyle BackColor="#E1DB9C" />
<SortedDescendingHeaderStyle BackColor="#C2A47B" />
<Columns>
<asp:TemplateField HeaderText="Select">
<ItemTemplate>
<asp:CheckBox ID="chkSelect" runat="server" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
<asp:LinkButton ID="lbtnSelect" Text="Check All" runat="server" OnClick="Select" />
<asp:Button ID="btnSubmit" CssClass="btn" Text="Submit" runat="server" OnClick="Result" />
<asp:LinkButton ID="lbtnClear" Text="Clear All" runat="server" OnClick="Clear"></asp:LinkButton>
</asp:Panel>

Get value from DetailsView to FormView Textbox in insert mode

I'm trying to get the value from detailsview to formview. I want to set the Book ID/ISBN in formview insert textbox to Book ID/ISBN value from detailsview.
Here's a sample of my code:
<asp:DetailsView ID="DetailsView1" runat="server" AutoGenerateRows="False"
CellPadding="4" DataKeyNames="bookid" DataSourceID="detailsDataSource"
ForeColor="#333333" GridLines="None" Height="50px" Width="">
<FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<CommandRowStyle BackColor="#D1DDF1" Font-Bold="True" />
<RowStyle BackColor="#EFF3FB" />
<FieldHeaderStyle BackColor="#DEE8F5" Font-Bold="True" />
<PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
<FooterTemplate>
<asp:GridView ID="GridView2" runat="server" AllowPaging="True"
AllowSorting="True" AutoGenerateColumns="False" CellPadding="4"
DataKeyNames="reservationid" DataSourceID="reserveDataSource"
ForeColor="#333333" GridLines="None">
<RowStyle BackColor="#EFF3FB" />
<Columns>
<asp:BoundField DataField="EmployeeID" HeaderText="Reserved by"
SortExpression="EmployeeID" />
<asp:BoundField DataField="reservedate" HeaderText="Reserved date"
SortExpression="reservedate" />
</Columns>
<FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
<SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />
<HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<EditRowStyle BackColor="#2461BF" />
<AlternatingRowStyle BackColor="White" />
</asp:GridView>
<asp:FormView ID="FormView1" runat="server" DataKeyNames="reservationid"
DataSourceID="reserveDataSource">
<EditItemTemplate>
reservationid:
<asp:Label ID="reservationidLabel1" runat="server"
Text='<%# Eval("reservationid") %>' />
<br />
bookid:
<asp:TextBox ID="bookidTextBox" runat="server" Text='<%# Bind("bookid") %>' />
<br />
EmployeeID:
<asp:TextBox ID="EmployeeIDTextBox" runat="server"
Text='<%# Bind("EmployeeID") %>' />
<br />
reservedate:
<asp:TextBox ID="reservedateTextBox" runat="server"
Text='<%# Bind("reservedate") %>' />
<br />
<asp:LinkButton ID="UpdateButton" runat="server" CausesValidation="True"
CommandName="Update" Text="Update" />
<asp:LinkButton ID="UpdateCancelButton" runat="server"
CausesValidation="False" CommandName="Cancel" Text="Cancel" />
</EditItemTemplate>
<InsertItemTemplate>
Book ID/ISBN:
<asp:TextBox ID="bookidTextBox" runat="server"
Text='<%# Bind("bookid") %>'/>
<br />
Employee ID:
<asp:TextBox ID="EmployeeIDTextBox0" runat="server"
Text='<%# Bind("EmployeeID") %>' />
<br />
Reserve date:
<asp:TextBox ID="reservedateTextBox0" runat="server"
Text='<%# Bind("reservedate") %>' />
<br />
<asp:LinkButton ID="InsertButton" runat="server" CausesValidation="True"
CommandName="Insert" Text="Reserve" />
<asp:LinkButton ID="InsertCancelButton" runat="server"
CausesValidation="False" CommandName="Cancel" Text="Cancel" />
</InsertItemTemplate>
So what I'm trying to do is when a user click the Insert/Reserve book linkbutton the Book ID/ISBN is already set to the Book ID/ISBN in formview insert mode as default.
Any help would be much appreciated ;)
Thanks in advance.
Can you try and check the DetailsView1.SelectedValue
<asp:TextBox ID="bookidTextBox" runat="server"
Text='<%# DetailsView1.SelectedValue %>'/>
Edit:
Now if you want to bind that value to your Insert function of your DetailsView, it will not behave like the other control, since you are using the Bind method for the other control and it provides two way binding.
Now you need to pass that value to inserting evet of DetailsView like as we are assigning values using DetailsView1.SelectedValue but not binding the value.
I hope you understand this theory.
protected void DetailsView1_ItemInserting(object sender, DetailsViewInsertEventArgs e)
{
e.Values["bookid"] = ((TextBox)DetailsView1.FindControl("bookidTextBox")).Text;
}

Categories

Resources