Hi All,
Recently i have applied new message system like what we have seen in gmail and yahoo , when we delete the message,the message come for 4-5 second and after that it just fade out. First i was thinking it is going to be though.But after i implement it,i was not all that diffcult.So below is the solution .
/******************************************************************/
First we have to place a div in the master page and have to assign id to it.
<div id="msgdiv"></div>
Make the body of the master page runat="server" and have a id for it as well.
<body id="MainBody" runat="server">
we also have to add jquery file of 1.2.1min.js file :
<script src="js/jquery-1.2.1.min.js" type="text/JavaScript"></script>
Now lets say you want to show message on deleting of message from inbox.
So add the following two functions in JavaScript:
function DeleteFromInbox() {
document.getElementById("msgdiv").className = "quick-alert";
document.getElementById("msgdiv").innerHTML = "<table border='0' align='center' cellpadding='0' cellspacing='0'><tr><td><img src='images/checked_new_icon.jpg' alt='' /></td><td width='8'> </td><td>message deleted from inbox successfully.</td></tr></table>";
setTimeout("FadeOutDiv()", 2000);
}
function ErrorInDeleteing() {
document.getElementById("msgdiv").className = "quick-alert";
document.getElementById("msgdiv").innerHTML = "<table border='0' align='center' cellpadding='0' cellspacing='0'><tr><td><img src='images/checked_new_icon.jpg' alt='' /></td><td width='8'> </td><td>message was not deleted from inbox.</td></tr></table>";
setTimeout("FadeOutDiv()", 2000);
}
function FadeOutDiv() {
$(".quick-alert").fadeOut("slow", function() {
$(".quick-alert").remove();
});
}
we should have following in our css file :
.quick-alert
{
width:66%;
background:#EE5A1E; font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#fff; font-weight:bold; text-align:center; border:1px solid #727272; padding:5px; margin:3px;margin-left:100px;
}
here you can set BG-color and font size according to your design.
Now finally on the click of the delete button we have to call this function from server-side :
protected void btnDelete_Click(object sender, ImageClickEventArgs e)
{
int i = DeleteFromInbox();
// after this we can return any variable knowing if the message is deleted or not
HtmlGenericControl MasterPageBodyTag = (HtmlGenericControl)this.Page.Master.FindControl("MainBody");
if (i>0)
{
MasterPageBodyTag.Attributes.Add("Onload", "javascript:DeleteFromInbox();");
}
else
{
MasterPageBodyTag.Attributes.Add("Onload", "javascript:ErrorInDeleteing();");
}
}
/******************************************************************/
Friday, June 12, 2009
Monday, June 1, 2009
PNG images problem for ie6
Hi,
Today i have a problem regarding the png images dot displaying properly in IE6 browser.
Then i find some of the best solution regarding this they are listed below :
1. IF YOU ARE USING PNG IMAGE AS SOURCE IMAGE :
if you are using png image like the following :
< img src=".png" / >
then all you have to do is to place the following code in your head section of the page :
2. IF YOU ARE USING PNG IMAGE IN Css as Background image :
if you are setting the png images in your css file as background image then the follwoing is the solution :
.tab {
background-image:url(images/tab_b.png);
background-repeat:repeat-x;
background-position:0 0;
height: 42px;
position: relative;
top: 0;
z-index: 999;
}
then you can use the following in bold to hack the png for ie6 and you done
.tab {
background-image:url(images/tab_b.png);
background-repeat:repeat-x;
background-position:0 0;
height: 42px;
position: relative;
top: 0;
z-index: 999;
_background-image: none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/tab_b.png, sizingMethod='scale');
}
3. If There are png images in both your css and page then you can use the follwing script
to correct ong effect :
var bgsleight = function() {
function addLoadEvent(func) {
var oldonload = window.onload;
if (typeof window.onload != 'function') {
window.onload = func;
} else {
window.onload = function() {
if (oldonload) {
oldonload();
}
func();
}
}
}
function fnLoadPngs() {
var rslt = navigator.appVersion.match(/MSIE (\d+\.\d+)/, '');
var itsAllGood = (rslt != null && Number(rslt[1]) >= 5.5);
for (var i = document.all.length - 1, obj = null; (obj = document.all[i]); i--) {
if (itsAllGood && obj.currentStyle.backgroundImage.match(/\.png/i) != null) {
fnFixPng(obj);
obj.attachEvent("onpropertychange", fnPropertyChanged);
}
}
}
function fnPropertyChanged() {
if (window.event.propertyName == "style.backgroundImage") {
var el = window.event.srcElement;
if (!el.currentStyle.backgroundImage.match(/transparent\.gif/i)) {
var bg = el.currentStyle.backgroundImage;
var src = bg.substring(5,bg.length-2);
el.filters.item(0).src = src;
el.style.backgroundImage = "url(blank.gif)";
}
}
}
function fnFixPng(obj) {
var bg = obj.currentStyle.backgroundImage;
var src = bg.substring(5,bg.length-2);
var sizingMethod = (obj.currentStyle.backgroundRepeat == "no-repeat") ? "crop" : "scale";
obj.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + src + "', sizingMethod='" + sizingMethod + "')";
obj.style.backgroundImage = "url(blank.gif)";
}
return {
init: function() {
if (navigator.platform == "Win32" && navigator.appName == "Microsoft Internet Explorer" && window.attachEvent) {
addLoadEvent(fnLoadPngs);
}
}
}
}();
bgsleight.init();
place the above code in js file and set the path of the file in your page.Also place a blank.gif file in the same directory where the .js file is.
You can get image below :
Today i have a problem regarding the png images dot displaying properly in IE6 browser.
Then i find some of the best solution regarding this they are listed below :
1. IF YOU ARE USING PNG IMAGE AS SOURCE IMAGE :
if you are using png image like the following :
< img src=".png" / >
then all you have to do is to place the following code in your head section of the page :
2. IF YOU ARE USING PNG IMAGE IN Css as Background image :
if you are setting the png images in your css file as background image then the follwoing is the solution :
.tab {
background-image:url(images/tab_b.png);
background-repeat:repeat-x;
background-position:0 0;
height: 42px;
position: relative;
top: 0;
z-index: 999;
}
then you can use the following in bold to hack the png for ie6 and you done
.tab {
background-image:url(images/tab_b.png);
background-repeat:repeat-x;
background-position:0 0;
height: 42px;
position: relative;
top: 0;
z-index: 999;
_background-image: none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/tab_b.png, sizingMethod='scale');
}
3. If There are png images in both your css and page then you can use the follwing script
to correct ong effect :
var bgsleight = function() {
function addLoadEvent(func) {
var oldonload = window.onload;
if (typeof window.onload != 'function') {
window.onload = func;
} else {
window.onload = function() {
if (oldonload) {
oldonload();
}
func();
}
}
}
function fnLoadPngs() {
var rslt = navigator.appVersion.match(/MSIE (\d+\.\d+)/, '');
var itsAllGood = (rslt != null && Number(rslt[1]) >= 5.5);
for (var i = document.all.length - 1, obj = null; (obj = document.all[i]); i--) {
if (itsAllGood && obj.currentStyle.backgroundImage.match(/\.png/i) != null) {
fnFixPng(obj);
obj.attachEvent("onpropertychange", fnPropertyChanged);
}
}
}
function fnPropertyChanged() {
if (window.event.propertyName == "style.backgroundImage") {
var el = window.event.srcElement;
if (!el.currentStyle.backgroundImage.match(/transparent\.gif/i)) {
var bg = el.currentStyle.backgroundImage;
var src = bg.substring(5,bg.length-2);
el.filters.item(0).src = src;
el.style.backgroundImage = "url(blank.gif)";
}
}
}
function fnFixPng(obj) {
var bg = obj.currentStyle.backgroundImage;
var src = bg.substring(5,bg.length-2);
var sizingMethod = (obj.currentStyle.backgroundRepeat == "no-repeat") ? "crop" : "scale";
obj.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + src + "', sizingMethod='" + sizingMethod + "')";
obj.style.backgroundImage = "url(blank.gif)";
}
return {
init: function() {
if (navigator.platform == "Win32" && navigator.appName == "Microsoft Internet Explorer" && window.attachEvent) {
addLoadEvent(fnLoadPngs);
}
}
}
}();
bgsleight.init();
place the above code in js file and set the path of the file in your page.Also place a blank.gif file in the same directory where the .js file is.
You can get image below :
Saturday, May 2, 2009
Show Password in textbox in normal mode
Hi all,
If you want the user to change his passowrd then you has to show him his last password
that is in Normal mode.
Ex : if the password is "Testing" then if you show it directly in textbox where textbox mode is
Password will be shown as "******".
So now if you want to show it as "Testing".then below is solution for it:
Place the text box on the .aspx part
In the code behind call function on page_load
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
LoginInfo();
txtpass.Attributes.Add("value", viewstate["pwd"].ToString());
}
}
void LoginInfo()
{
Try
SqlCommand cmd = new SqlCommand("select PassHint from tbllogin where UserID=@aid ", new SqlConnection(ConfigurationManager.ConnectionStrings["LocalSqlServer"].ConnectionString.ToString()));
cmd.CommandType = CommandType.Text;
cmd.Connection.Open();
using (SqlDataReader dr = cmd.ExecuteReader())
{
if (dr.HasRows)
{
viewstate["pwd"] = dr["UserPass"].ToString();
}
}
dr_.Close();
cmd.Connection.Close();
cmd.Dispose();
catch (Exception ex)
{
//Response.Write(ex.ToString());
}
}
And you are done.
If you want the user to change his passowrd then you has to show him his last password
that is in Normal mode.
Ex : if the password is "Testing" then if you show it directly in textbox where textbox mode is
Password will be shown as "******".
So now if you want to show it as "Testing".then below is solution for it:
Place the text box on the .aspx part
In the code behind call function on page_load
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
LoginInfo();
txtpass.Attributes.Add("value", viewstate["pwd"].ToString());
}
}
void LoginInfo()
{
Try
SqlCommand cmd = new SqlCommand("select PassHint from tbllogin where UserID=@aid ", new SqlConnection(ConfigurationManager.ConnectionStrings["LocalSqlServer"].ConnectionString.ToString()));
cmd.CommandType = CommandType.Text;
cmd.Connection.Open();
using (SqlDataReader dr = cmd.ExecuteReader())
{
if (dr.HasRows)
{
viewstate["pwd"] = dr["UserPass"].ToString();
}
}
dr_.Close();
cmd.Connection.Close();
cmd.Dispose();
catch (Exception ex)
{
//Response.Write(ex.ToString());
}
}
And you are done.
Tuesday, April 28, 2009
Allow user to download files of different types
Hi All,
here is code for you if you want the users to download file from your web page (as image,.xsls,.xslt etc).
*************** Code from here *******************
Response.ContentType = "image/jpeg";
Response.AppendHeader("Content-Disposition", "attachment; filename=" + filename);
Response.TransmitFile(Server.MapPath("foldername" + filename));
Response.End();
*************** Till here *************************
Content-Type -- You can set the content-type according to your file......
as if it is jpeg then content-type will be "image/jpeg"
below is list of some of content-type :
MS Word file --- application/msword
straight binary --- application/octet-stream
xml,xslt files ---- application/xslt+xml
RTF document --- application/rtf
PDF document --- application/pdf
ZIP document --- application/zip
you can view more about these at the below link :
http://www.asptutorial.info/sscript/ContentType.html
here is code for you if you want the users to download file from your web page (as image,.xsls,.xslt etc).
*************** Code from here *******************
Response.ContentType = "image/jpeg";
Response.AppendHeader("Content-Disposition", "attachment; filename=" + filename);
Response.TransmitFile(Server.MapPath("foldername" + filename));
Response.End();
*************** Till here *************************
Content-Type -- You can set the content-type according to your file......
as if it is jpeg then content-type will be "image/jpeg"
below is list of some of content-type :
MS Word file --- application/msword
straight binary --- application/octet-stream
xml,xslt files ---- application/xslt+xml
RTF document --- application/rtf
PDF document --- application/pdf
ZIP document --- application/zip
you can view more about these at the below link :
http://www.asptutorial.info/sscript/ContentType.html
Thursday, April 23, 2009
Display images from database
Hi,
Now a days developer like to save images to database.
Now the problem how to get image back from database.
For the same purpose we can use HttpHandler which can get the image from database.
and can be applied easily :
Here is code for that
Now in the .aspx this what you need to do :
and you are done .
You can view the same here :
http://forums.asp.net/t/1394122.aspx?PageIndex=2
Now a days developer like to save images to database.
Now the problem how to get image back from database.
For the same purpose we can use HttpHandler which can get the image from database.
and can be applied easily :
Here is code for that
you has to create a new generic handler.say its name is ImageViewer.ashx
here you put the following code in ProcessRequest() of the httphandler
context.Request.QueryString["ImageID"].ToString() // id of the row of database
Stream stream = null;
context.Response.ContentType = "image/jpeg/gif";
context.Response.Cache.SetCacheability(HttpCacheability.Public);
context.Response.BufferOutput = false;
int buffersize = 1024 * 16;
byte[] buffer = new byte[buffersize];
//Run your query here and get the binary stream from database assign it the stream variable as below
stream = stream from database;
int count = stream.Read(buffer, 0, buffersize);
while (count > 0)
{
context.Response.OutputStream.Write(buffer, 0, count);
count = stream.Read(buffer, 0, buffersize);
}
Now in the .aspx this what you need to do :
and you are done .
You can view the same here :
http://forums.asp.net/t/1394122.aspx?PageIndex=2
RegularExpressionValidator for image upload
Hi all,
you can control for uploading of only images(.jpg,.gif) etc.
Using the RegularExpressionValidator you can validate it on client side .
Here is the code for this :
asp:regularexpressionvalidator runat="server" errormessage="Only picture files are allowed!" validationexpression="^(([a-zA-Z]:)|(\\{2}\w+)\$?)(\\(\w[\w].*))+(.gif|.GIF|.jpg|.JPG|.jpeg|.JPEG)$" controltovalidate="fileUpload" display="None">
http://forums.asp.net/p/1411282/3093528.aspx#3093528
you can
Using the RegularExpressionValidator you can validate it on client side .
Here is the code for this :
asp:regularexpressionvalidator runat="server" errormessage="Only picture files are allowed!" validationexpression="^(([a-zA-Z]:)|(\\{2}\w+)\$?)(\\(\w[\w].*))+(.gif|.GIF|.jpg|.JPG|.jpeg|.JPEG)$" controltovalidate="fileUpload" display="None">
Wednesday, April 22, 2009
Fake player of the IPl part-2
Hi all,
there is one blog which is getting every body crazy these days.
here you can get lots of detail and funny things about the IPL-2.
Have a look at the link below and have fun :
http://fakeiplplayer.blogspot.com
there is one blog which is getting every body crazy these days.
here you can get lots of detail and funny things about the IPL-2.
Have a look at the link below and have fun :
http://fakeiplplayer.blogspot.com
Subscribe to:
Comments (Atom)
