Im trying to fadeOut image on page load. Im new in Jquery but i need some help because i didnt find working answers in google , what am i missing
WebForm1.aspx
# Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="Zzz.WebForm1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript" id="fadeout">
$(body).ready(function () {
$('#Image1').fadeOut(3000);
});
</script>
</head>
<body onload="fadeout">
<form id="form1" runat="server">
<asp:Image ID="Image1" runat="server" Style =" position:absolute;width:100px;height:100px;left:10px;top:10px; " ImageUrl="~/Photos/facebook.jpg" />
</form>
</body>
</html>
WebForm1.aspx.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace Zzz
{
public partial class WebForm1 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
}
}
You aren't referencing the jquery library.
Use $(document).ready(function() {...}) or $(function() {...})
You need to include jQuery library, in the head or your page, put this (I use a CDN, but you can get it locally):
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
And you need to use the correct statement for page loaded, and, most important, the correct statement for identify the element (ASP.NET adds text to ASP elements ID, so you need get that id form the framework):
$(function () {
$('#<%=Image1.ClientID%>').fadeOut(3000);
});
Finally, an advice, if you can, start your projects using ASP.NET MVC
Try this:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>
$(document).ready(function () {
$('#Image1').fadeOut(3000);
});
</script>
To execute from your .cs code:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace Zzz
{
public partial class WebForm1 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
Page.ClientScript.RegisterStartupScript(this.GetType(), "", "$('#Image1').fadeOut(3000);", true);
}
}
}
Related
Explain : I want to display data from database on google map but is shows that google API key is needed, I already put it inside script tag but still error is occured.I attached code of default.apsx page and default.aspx.cs page.
plaese help me our this issue.
Error : You need to set the Google Maps API Key
my code is:
//Default.aspx
<%# Register Assembly="GMaps" Namespace="Subgurim.Controles" TagPrefix="cc1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript" src = "https://maps.googleapis.com/maps/api/js?key=AIzaSyC6v5-2uaq_wusHDktM9ILcqIrlPtnZgEk&sensor=false">
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<cc1:GMap ID="GMap1" runat="server" Width="500px" Height="500px" />
</div>
</form>
</body>
</html>
//default.aspx.cs
using Subgurim.Controles;
using Subgurim.Controles.GoogleChartIconMaker;
using System;
using System.Collections.Generic;
using System.Drawing;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
GLatLng mainLocation = new GLatLng();
GMap1.setCenter(mainLocation, 14);
XPinLetter xpinLetter = new XPinLetter(PinShapes.pin_star, "H", Color.Blue, Color.White, Color.Chocolate);
GMap1.Add(new GMarker(mainLocation, new GMarkerOptions(new GIcon(xpinLetter.ToString(), xpinLetter.Shadow()))));
List<lOCATION> tblobj = new List<lOCATION>();
using (MapDATAEntities dbcontext =new MapDATAEntities())
{
tblobj = dbcontext.lOCATIONs.Where(i => i.country.Equals("india")).ToList();
}
PinIcon p;
GMarker gm;
GInfoWindow win;
foreach (var i in tblobj)
{
p = new PinIcon(PinIcons.truck, Color.Cyan);
gm = new GMarker(new GLatLng(Convert.ToDouble(i.lat), Convert.ToDouble(i.lng)),
new GMarkerOptions(new GIcon(p.ToString(), p.Shadow())));
win = new GInfoWindow(gm, i.city + " <a href='" + i.empImg + "'>Read more...</a>", false, GListener.Event.mouseover);
GMap1.Add(win);
}
}
}
}
I'm using VisualStudio 2013 Express for WEB, and I created an empty web application, and then added a new web form.
I'm trying to learn ASP.NET, and I learned that in the session / page life cycle there is Page_Load where I can execute thing that will happen just after the page loads. The thing is I learned that it is possible to put the Page_Load event under <script> before the <HTML> tag.
(The aspx file name is Register) When I try this:
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="Register.aspx.cs" Inherits="Learning.Register" %>
<!DOCTYPE html>
<script runat="server">
int randomnumber = 0;
public void Page_Load()
{
Random rnd = new Random();
randomnumber = rnd.Next(100000, 1000000);
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<% Response.Write(randomnumber); %>
</div>
</form>
</body>
</html>
All I get is 0 for some reason.
Also, I noticed that under Register.aspx.cs I have this:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace Learning
{
public partial class Register : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
}
}
You can definitely put the server side code in aspx using script tag. But the page load syntax should exactly match as it is in your code behind(.cs file)
Page_Load(object sender, EventArgs e)
In your script code you have just Page_Load() which does not trigger at all.
If you need this to be excecuted then you need to remove the function in the code behind and replace the method signature in the script tag
in the script tag you need to have base.OnLoad(e)
protected void Page_Load(object sender, EventArgs e)
{
base.OnLoad(e)
Random rnd = new Random();
randomnumber = rnd.Next(100000, 1000000);
}
That's because you are overriding the behavior of the base class, and if you don't call base.OnLoad(e) then Page_Load would not run in the markup side.
I need a value from javascript before the main page load and then want to use that value in code. The code which I am using for that purpose is:
I have make a test.aspx page. The code for which is as following:-
<%# Page Language="C#" AutoEventWireup="true" CodeFile="test.aspx.cs" Inherits="test" %>
<!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>Untitled Page</title> <script type="text/javascript" language="javascript">
function GetScreenHeightAndWidth()
{
var width = screen.width;
var height = screen.height;
var object = 'Label1';
document.getElementById(object ).innerHTML=height ;
//alert(height);
'<%Session["Screensize"] = "' + height +'"; %>' ;
}
</script>
</head>
<body onload="GetScreenHeightAndWidth();" >
<form id="form1" runat="server">
<div>
<asp:Label ID="Label1" runat="server" Text="test"></asp:Label>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
</div>
</form>
</body>
</html>
The code for test.aspx.cs page is as following:-
using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.IO;
using System.Windows.Forms;
public partial class test : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
Session["Screensize"] = Label1.Text;
TextBox1.Text=Session["Screensize"].ToString();
}
}
The result is as following:-
768 test
while result what I need is 768 and 768.
Is there any way to solve the problem?
What you are asking is impossible to do. Why do you need to know the screen size on the server -side in the first place? Whatever you need to accommodate on the html produced by the server can be either adjusted via proper CSS rules or Javascript (JQuery if you prefer that framework)
If you set the width/height values to a hidden field from script, you can than access them from codebehind after a postback. Labels are not posted with the form so you cant use that.
First of all thanks to all of you for responding to my question. After much search I have found what I was exactly wanting. For this I have to use one more page and add this code in my original code:
if (!IsPostBack)
{
if (Session["ScreenResolution"] == null)
{
Response.Redirect("detectscreen.aspx");
}
else
{
Session["Screensize"] = Session["ScreenResolution"].ToString();
}
TextBox1.Text = Session["Screensize"].ToString();
}
And the code for new page is:
protected void Page_Load(object sender, EventArgs e)
{
if (Request.QueryString["action"] != null) {
Session["ScreenResolution"] = Request.QueryString["res"].ToString();
Response.Redirect("Catalogue.aspx");
}
}
and the script in the new page will be like this:
<script language="javascript" type="text/javascript">
res = "&res="+screen.height
top.location.href="detectscreen.aspx?action=set"+res
</script>
I am using FileUpload Control to upload images, I can select the image using that browse button, but when i try to preview that selected one, i am not getting the file name, its showing empty..
protected void btnImgUpload_Click(object sender, ImageClickEventArgs e)
{
try
{
string strimage;
string strfilename, strextn;
if (fupImage.HasFile)
{
In the above code,fupImage.FileName property should have to selected Image name, but it remains as empty string "" , so fubImage.HasFile condition is going false. I am not getting why the condition is going false, while the file is selected,? what is the problem here?
Thanks in advance
what i did to test it is
I create an Asp page
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication2.WebForm1" %>
<!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:FileUpload ID="fupImage" runat="server" />
<asp:Button ID="btnImageUpload" runat="server" onclick="btnImageUpload_Click"
Text="Upload" />
</div>
</form>
</body>
</html>
and the code behind class is
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace WebApplication2
{
public partial class WebForm1 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void btnImageUpload_Click(object sender, EventArgs e)
{
try
{
string strimage;
string strfilename, strextn;
if (fupImage.HasFile)
{
//do something
}
}
catch
{
}
}
}
}
and nothing goes wrong with that
I want to say to test it just create a very simple instance and test it in complex environment may be there are some extra rules may prevents normal jobs! and sometimes it looks so unnoraml
Check for the View-state property of that file uploader Control, If View-state is false, then on post back you'll get empty value
I have a web page with an empty div, id="PreAcquisitionDiv" runat="server"
In the C# code-behind, on Page_Load, I build up a table and set it to PreAcquisitionDiv.InnerHtml
My page displays OK. I cause a PostBack, intending to change the data in the table. In the code, the PreAcquisitionDiv.InnerHtml does change, but the table I put there the first time is still displayed on the page instead.
I have seen some warnings about using InnerHtml at all, but the examples of alternatives that I have seen are JavaScript.
I am using IE 8, but I observe the same behavior in Chrome.
Thank you for any suggestions!
For example, this code displays "SomeStuff" when it first displays the page; then still "SomeStuff" after the PostBack even though the InnerHtml was changed.
protected void Page_Load( object sender, EventArgs e )
{
StringBuilder html = new StringBuilder( #"<TABLE BORDER='1' WIDTH='100%'>" );
if( !IsPostBack )
{
html.Append(#"<TR><TD>SomeStuff</TD></TR>" );
}
else
{
html.Append( #"<TR><TD>Some New Stuff</TD></TR>" );
}
html.Append( #"</TABLE>" );
this.PreAcquisitionDiv.InnerHtml = html.ToString( );
}
If you are changing the HTML on post back are you running your function to set it on post back as well?
UPDATE: I copied and pasted your code and it works fine for me. Here is my entire code behind:
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 System.Text;
namespace Sandbox
{
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
StringBuilder html = new StringBuilder(#"<TABLE BORDER='1' WIDTH='100%'>");
if (!IsPostBack)
{
html.Append(#"<TR><TD>SomeStuff</TD></TR>");
}
else
{
html.Append(#"<TR><TD>Some New Stuff</TD></TR>");
}
html.Append(#"</TABLE>");
this.PreAcquisitionDiv.InnerHtml = html.ToString();
}
protected void btnTest_OnClick(object sender, EventArgs e)
{
}
}
}
And here is my entire ASPX page
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Sandbox._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>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<div id="PreAcquisitionDiv" runat="server">
</div>
<asp:Button ID="btnTest" runat="server" OnClick="btnTest_OnClick" />
</form>
</body>
</html>