Hi I am doing a social network service using asp.net/c#, I have little problems with message sending.
when i am starting to send message scroll display like this. when i press send message it shows old message first and scroll is top, but i want newer message it mean's when i page loaded page should be showed new messages first
my aspx codes
<div style=" overflow-y:auto; height:368px; margin-top: -50px; border-top-style: groove; border-right-style: groove; border-left-style: groove; width: 602px; margin-left: 0px;" >
<asp:Repeater runat="server" ID="Repeater1" >
<ItemTemplate>
<div style="border-top: thin none #BBCEB3; border-bottom: thin none #BBCEB3; padding: 10px; width: 548px; margin-top: -10px; right: 10px; left: 10px; border-left-width: thin; margin-left: 15px; background-color: #fffff0; border-left-color: #BBCEB3; border-right-color: #BBCEB3; border-top-style: groove; border-bottom-style: groove;">
<br />
<div style="width: 58px; height: 40px">
<asp:Image ID="Image2" runat="server" Height="59px" ImageAlign="Top" ImageUrl='<%#Eval("SProfilePic") %> ' Width="55px" />
</div>
<div style="width: 307px; margin-left: 65px; margin-top: -60px">
<asp:Label ID="Label6" runat="server" Font-Bold="True" Font-Names="Arial" ForeColor="#000066"><%#Eval("SenderName") %> </asp:Label>
</div>
<div id="status" style=" width: 461px; margin-left: 78px; margin-top: 11px;"> <asp:Label ID="Label7" runat="server" Font-Italic="False" ForeColor="Black" Font-Size="Medium"><%#Eval("Messages") %> </asp:Label>
</div>
<div style="margin-left: 400px; background-color: #C0C0C0;">
<asp:Label ID="Label11" runat="server" Text="" Font-Size="Small"><%#Eval("Time") %> </asp:Label>
</div>
</div>
</ItemTemplate>
Put server controller there for example this:
<asp:Button ID="BtnOutside" runat="server" Text="Random" style="margin-left:-999px;" />
And then use
Page.SetFocus(Me.BtnOutside.ClientID);
To get focus to that button which is not visible to the client because of the negative margin. This should push the scroll bar to the bottom.
Put this in your code wherever you want to Focus on -- You can use this
multilple times in the same code set just change the "ID"
<asp:Button ID="FocusBottom" runat="server" Text="Random" style="margin-left:-999px;"
In the event(button click whatever) put in this.
Page.SetFocus(FocusBottom);
Change the (#######) to "ID" you want to call
Related
I have no idea how to accomplish something like this, so here goes.
I have a datatable that has the following data:
Room Cook Waiter Input
201 Joe Jim Green.png
202 Jack Mary Red.png
203 Jet Mark Yellow.png
204 Nick Jill Green.png
I have 3 PNG files: Green.png, Red.png, Yellow.png. Each PNG is 100x100px.
The data control that I've been using is a datalist. Each datalist item has the following: a 100x100px div for displaying the PNG according to the Input column and 3 labels, for columns Room, Cook, and Waiter.
This is not an issue and it's already being displayed correctly: each datalist item is 100x100px in size and within this space I have 3 labels displaying the other columns.
The bigger issue, which is where I'm stuck at, is being able to click on each datalist item and running server-side code. And when the server-side code runs, the codebehind will have the Room, Cook. and Waiter in that datalist item. This is where I'm really stuck at.
Most of the partial solutions I've seen have been with jquery, but I do not want to use that. Ideally, it would be to add a label over an image button, but that's not possible. Worse-case scenario would be to display the text outside the button, but that would ruin the design.
I'm including the aspx markup:
<asp:DataList ID="DataListDiv" runat="server" RepeatColumns="5">
<ItemTemplate>
<div style="padding: 8px">
<div style='width:195px;height:162px; background-image:url(<%# Eval("image_path") %>)'>
<div style="width: 195px; height: 22px; padding-top: 5px; overflow: hidden;">
<div style="box-sizing: border-box; width:97px; float:left;">
<asp:Label ID="Label1" runat="server" Text='<%# Eval("RoomNum")%>' ></asp:Label>
</div>
</div>
<div style="width: 195px; height: 22px; box-sizing: border-box">
<asp:Label ID="Label2" runat="server" Text='<%# Eval("CookName")%>' ></asp:Label>
</div>
<div style="width: 195px; height: 22px; box-sizing: border-box">
<asp:Label ID="Label3" runat="server" Text='<%# Eval("WaiterName")%>' ></asp:Label>
</div>
</div>
</div>
</ItemTemplate>
</asp:DataList>
Any help is appreciated.
Wrap your primary DIV with a LinkButton control and then you should be able to accomplish what you want. This will make the entire DIV clickable. You will may need to use the CommandName and CommandArgument properties.
<asp:DataList ID="DataListDiv" runat="server" RepeatColumns="5">
<ItemTemplate>
<asp:LinkButton ID="lnkButton" runat="server" CommandName="Details" CommandArgument='<%# Eval("RoomNum") + "," + Eval("CookName") + "," + Eval("WaiterName") %>' OnClick="lnkButton_Click">
<div style="padding: 8px">
<div style='width:195px;height:162px; background-image:url(<%# Eval("image_path") %>)'>
<div style="width: 195px; height: 22px; padding-top: 5px; overflow: hidden;">
<div style="box-sizing: border-box; width:97px; float:left;">
<asp:Label ID="Label1" runat="server" Text='<%# Eval("RoomNum")%>' ></asp:Label>
</div>
</div>
<div style="width: 195px; height: 22px; box-sizing: border-box">
<asp:Label ID="Label2" runat="server" Text='<%# Eval("CookName")%>' ></asp:Label>
</div>
<div style="width: 195px; height: 22px; box-sizing: border-box">
<asp:Label ID="Label3" runat="server" Text='<%# Eval("WaiterName")%>' ></asp:Label>
</div>
</div>
</div>
</asp:LinkButton>
</ItemTemplate>
</asp:DataList>
Alternatively, you can use the "OnItemCommand" command in the DataList control. Here's some helpful info on setting that up: https://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.datalist.itemcommand(v=vs.110).aspx
Below is code before convert to HTML.I want to change overflow hidden.I found many way of CSS file. But couldn't find it and try using id to change css always no responding.
Telerik Code
<telerik:ReportViewer ID="ReportViewer1" runat="server" Height="800px"
Width="100%"></telerik:ReportViewer>
HTML View Through Browser Developer tools
<td id="TD_2">
<div id="TD2" style="overflow-y: auto; padding-left: 100px; width: auto; overflow-x:
hidden; position: inherit; height: 355px;">
<telerik:ReportViewer ID="ReportViewer1" runat="server" Height="800px"
Width="100%"></telerik:ReportViewer>
</td>
Presently, I am using file upload control for uploading files on SQL server through ASP.NET (using C#) successfully. Now I am trying to make as page like this
<body>
<form id="form1" runat="server">
<p style="font-family: Tahoma; font-weight: 700; font-size: medium; color: #0000CC">
Performance Feedback From Zonal Railways<p style="font-family: Tahoma; font-weight: 700; font-size: small; color: #990000">
Performance feedback of :
<asp:TextBox ID="equipment" runat="server" ></asp:TextBox>
<p style="font-family: Tahoma; font-weight: 700; font-size: small; color: #990000">
Uploaded by :
<asp:TextBox ID="uploadedby" runat="server" ></asp:TextBox>
<p class="style1">
<strong>Letter Date : <asp:TextBox ID="Letterdt" runat="server" ></asp:TextBox>
</strong></p>
<div>
<span class="style1"><strong>Select File to Upload :</strong></span>
<asp:FileUpload ID="FileUpload1" runat="server" />
<asp:Button ID="btnUpload" runat="server" OnClick="btnUpload_Click" Text="Upload File" />
<br />
<asp:Label ID="lblMessage" runat="server" Text="" Font-Names = "Arial"></asp:Label>
</div>
</form>
<p>
<span class="style2"><strong>Back</strong></span>
<span class="style3"><strong>Home</strong></span></p>
</body>
Please suggest any readymade example for meet the requirment or any code.
Here's a link where you can learn how to upload files to SQL Server Database
http://www.aspsnippets.com/Articles/Upload-and-Download-files-from-SQL-Server-Database-in-ASPNet.aspx
I have an ASP.NET page that has a FileUpload control inside.
When I try to upload a third file I am getting:
System.OutOfMemoryException
at System.Convert.FromBase64String(String s)
at System.Web.UI.ObjectStateFormatter.Deserialize(String inputString)
at System.Web.UI.ObjectStateFormatter.System.Web.UI.IStateFormatter.Deserialize(String serializedState)
at System.Web.UI.Util.DeserializeWithAssert(IStateFormatter formatter, String serializedState)
at System.Web.UI.HiddenFieldPageStatePersister.Load()
here's my code:
<td style="width: 60%; height: 67px; vertical-align: top">
<div class="fileinputs" id="div2" style="left: 0px; top: 0px; width: 100%; vertical-align: middle">
<div id="div3" class="fakefile" style="left: 0px; top: 0px; vertical-align: middle">
<asp:TextBox ID="txtFileUpload" runat="server" Width="265px" CssClass="borde-form"
Height="15px" ValidationGroup="docs" />
<img name="imgExaminar" alt="Examinar" src="../../Images/botExaminar.gif" style="cursor: hand;
width: 81px; height: 20px; vertical-align: middle" />
</div>
<asp:FileUpload EnableViewState="true" ID="fileUpload" runat="server" Width="368px"
Height="19px" CssClass="hidden" />
</div>
<asp:CustomValidator ID="cvattachment" runat="server" OnServerValidate="cvattachment_ServerValidate"
ControlToValidate="fileUpload" ErrorMessage="Existe un archivo con el mismo nombre"
Font-Bold="False" Font-Names="Arial" Font-Size="X-Small" ValidationGroup="docs"></asp:CustomValidator>
</td>
<td style="width: 30%; height: 67px; vertical-align: top">
<asp:ImageButton ID="imgAdjuntar" runat="server" ImageUrl="~/Images/botAdjuntar.GIF"
OnClick="imgAdjuntar_Click" ValidationGroup="docs" Height="20px" Width="66px"></asp:ImageButton>
</td>
When I click on my imgAdjuntar, I am getting the error, but the imgAdjuntar_Click method is never called, but the Application_Error on the Global.asax is fired instead.
Plus, none of my breakpoints are being stepped into, the error occurs before reaching the application code.
Maybe the control is the one that's failing?
What can I do?
Thank you!
Make sure that you are not storing files within the ViewState.
In addition, try to disable the ViewState for the entire page.
Check the following treads, which may be helpful:
How do i handle 'System.OutOfMemoryException' in uploading?
Exception of type 'System.OutOfMemoryException' was thrown
I am trying to put a rotating wheel popup on the page while I am executing backend code for fetching new data from DB.
Here is what I tried, but it doesn't want to work so far, nothing gets displayed.
I want to display something when the checkbox is clicked (CheckedChanged), that's when something is fetching from db.
Here is the ajax code I have:
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<Triggers>
<asp:AsyncPostBackTrigger controlid="cbAll" eventname="CheckedChanged" />
</Triggers>
<ContentTemplate>
</ContentTemplate>
</asp:UpdatePanel>
<asp:updateprogress associatedupdatepanelid="UpdatePanel1"
id="updateProgress" runat="server">
<progresstemplate>
<div id="progressBackgroundFilter"></div>
<div id="processMessage"> Loading...<br /><br />
<img alt="Loading" src="../images/ajax-loader.gif" />
</div>
</progresstemplate>
</asp:updateprogress>
And here is the checkbox control:
<asp:CheckBox ID="cbAll" runat="server" Checked="true" Text="Show me everything" ForeColor="White"
Visible="false" AutoPostBack="True"
oncheckedchanged="cbAll_CheckedChanged" />
Modify your code a bit.
You do not need the trigger, the event has AutoPostBack checkbox.
<asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional">
<%--<Triggers>
<asp:AsyncPostBackTrigger ControlID="cbAll" EventName="CheckedChanged" />
</Triggers>--%>
<ContentTemplate>
<asp:CheckBox ID="cbAll" runat="server" Checked="true" Text="Show me everything"
ForeColor="White" Visible="false" AutoPostBack="True" OnCheckedChanged="cbAll_CheckedChanged" />
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdateProgress AssociatedUpdatePanelID="UpdatePanel1" ID="updateProgress" runat="server">
<ProgressTemplate>
<div id="progressBackgroundFilter">
</div>
<div id="processMessage">
Loading...<br />
<br />
<img alt="Loading" src="../images/ajax-loader.gif" />
</div>
</ProgressTemplate>
</asp:UpdateProgress>
I hope this helps.
I've done something like this in the past by skipping the update progress control and instead handling the PageRequestManager beginRequest and endRequest events. In my case I also wanted to block the ui of the page, so I used the jQuery blockUI plugin.
Put the following div somewhere at the root of your page:
<div id="processMessage">
Loading...
<br />
<br />
<img src="/images/ajax-loader.gif" alt="Loading" />
</div>
And style it with the following css:
#updatingDiv
{
width: 75px;
height: 75px;
margin-left: auto;
margin-right: auto;
text-align: center;
padding: 10px;
display: none;
background-color: #EEEEEE;
border: solid 1px #AAAAEE;
}
Add the following JavaScript:
$(function() {
Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(function() {
$.blockUI({ message: $('#updatingDiv'), css: { border: 'none', background: 'transparent'} });
});
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(function() {
$.unblockUI();
});
});
You'll need to be sure to include the jQuery library and the blockUI plugin I mentioned earlier.
Of course, you can modify the css/html to suit your needs.
Try this, and don t forget the script manager blog.
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<Triggers>
<asp:AsyncPostBackTrigger controlid="cbAll" eventname="CheckedChanged" />
</Triggers>
<ContentTemplate>
<asp:updateprogress associatedupdatepanelid="UpdatePanel1" id="updateProgress" runat="server">
<progresstemplate>
<div id="progressBackgroundFilter"></div>
<div id="processMessage"> Loading...<br /><br />
<img alt="Loading" src="../images/ajax-loader.gif" />
</div>
</progresstemplate>
</asp:updateprogress>
</ContentTemplate>
</asp:UpdatePanel>
Source
`
.divWaiting
{
position: absolute;
overflow: hidden;
text-align: center;
top: 0;
left: 0;
height: 100%;
width: 100%;
padding-top: 40%;
}
.divWaiting #div1
{
position: relative;
top: 0;
left: 0;
background-color: White;
width: 180px;
left: 460px;
border: 2px solid #870307;
border-radius: 6px;
text-align: center;
}
Download .gif image for rotating wheel