DOTNET

Thursday, February 26, 2015

Test Browser Supports Cookies Are Not

Design the form as follows:

<head runat="server">
<title></title>
<script type="text/javascript">
function checkcookies() {
if (navigator.cookieEnabled)
alert("Cookies are Enabled");
else
alert("Cookies are Disabled");
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="checkcookies();" />
</div>
</form>

</body>

Output:

Creating ZIP File

First download the dll Ionic.Zip from the following URL.

https://dotnetzip.codeplex.com/releases/view/68268

And, then add the dll( by Using Add Reference)

Design the form as follows:

<body>
<form id="form1" runat="server">
<div>
<asp:FileUpload ID="FileUpload1" runat="server" />
<asp:Button ID="btnFileUpload" runat="server" Text="ZipFile" OnClick="btnFileUpload_Click" />
<asp:Label ID="lblMessage" runat="server" Text=""></asp:Label>
</div>
</form>
</body>

Add, the following Namespace:

using Ionic.Zip;

protected void Page_Load(object sender, EventArgs e)
{

}
protected void btnFileUpload_Click(object sender, EventArgs e)
{
try
{
string FileName = string.Empty;
if (FileUpload1.HasFile)
{
FileName = FileUpload1.FileName;
string path = Server.MapPath("~/Files/" + FileName);
FileUpload1.SaveAs(path);
ZipFile obj = new ZipFile();
obj.AddFile(path);
obj.Save(Server.MapPath("~/Files/File.zip"));
lblMessage.Text = "Upload Successfully";
}
}
catch (Exception)
{
throw;
}

}

output:

Wednesday, February 25, 2015

Gridview using jQuery in ASP.NET

Design the form the as follows:

<body>
<form id="form1" runat="server">
<div>
<asp:GridView ID="grdActivation" runat="server" AutoGenerateColumns="False">
<Columns>
<asp:BoundField DataField="Userid" HeaderText="Userid" />
<asp:BoundField DataField="Name" HeaderText="Name" />
<asp:BoundField DataField="Emailid" HeaderText="Emailid" />
</Columns>
</asp:GridView>
</div>
</form>

</body>

javascript Function:

<script src="jquery-1.7.min.js"></script>

<script type="text/javascript">
$(function () {
$.ajax({
type: "POST",
url: "Default9.aspx/GetUserInfoData",
data: '{}',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: OnSuccess,
failure: function (response) {
alert("Failure Details : " + response.d);
},
error: function (response) {
alert("Error Details: " + response.d);
}
});
});

function OnSuccess(response) {
var xmlDoc = $.parseXML(response.d);
var xml = $(xmlDoc);
var users = xml.find("Table");
var row = $("[id*=grdActivation] tr:last-child").clone(true);
$("[id*=grdActivation] tr").not($("[id*=grdActivation] tr:first-child")).remove();

$.each(users, function () {
$("td", row).eq(0).html($(this).find("Userid").text());
$("td", row).eq(1).html($(this).find("Name").text());
$("td", row).eq(2).html($(this).find("Emailid").text());
$("[id*=grdActivation]").append(row);
row = $("[id*=grdActivation] tr:last-child").clone(true);
});
}

</script>

.cs Page:

protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
BindEmptyRow();
}
}

private void BindEmptyRow()
{
DataTable dt = new DataTable();
dt.Columns.Add("Userid");
dt.Columns.Add("Name");
dt.Columns.Add("Emailid");
dt.Rows.Add();
grdActivation.DataSource = dt;
grdActivation.DataBind();
}

[WebMethod]
public static string GetUserInfoData()
{
SqlConnection con = new SqlConnection("------------");
SqlCommand cmd = new SqlCommand("select * from sdfsf", con);
DataSet ds = new DataSet();
SqlDataAdapter da=new SqlDataAdapter(cmd);
da.Fill(ds);
return ds.GetXml();

}

output:

in case if , you want to apply styles to the rows alternative color than add below lines of javascript code.

var index= 1;
$.each(users, function () {
$("td", row).eq(0).html($(this).find("Userid").text());
$("td", row).eq(1).html($(this).find("Name").text());
$("td", row).eq(2).html($(this).find("Emailid").text());
$("[id*=grdActivation]").append(row);
row = $("[id*=grdActivation] tr:last-child").clone(true);

if index= == 1 || index= % 2 != 0)) {
$(row).css("background-color", "colorcode");
}
else {
$(row).css("background-color", "colorcode");
}
index= index+ 1;
row = $("[id*=grdActivation] tr:last-child").clone(true);
});

CALLING JQUERY CODE FROM SERVER SIDE

Design the form as follows:

<head runat="server">
<title></title>
<script src="jquery-1.7.min.js"></script>
</head>

<form id="form1" runat="server">
<div>
<asp:Button ID="btnjquery" runat="server" Text="callingjquerycode" OnClick="btnjquery_Click" />
</div>
</form>

.cs page:

protected void Page_Load(object sender, EventArgs e)
{

}
protected void btnjquery_Click(object sender, EventArgs e)
{
StringBuilder sb = new StringBuilder();
sb.Append("$(document).ready(function(){");
sb.Append("alert('hi welcome to this world.');");
sb.Append("});");
Page.ClientScript.RegisterStartupScript(this.GetType(), "Script",sb.ToString(), true);
}

Output:

Tuesday, February 24, 2015

JQUERY TIPS (jQuery selectors)

ID Selector

$(document).ready(function () {
$('#divClassusingID').css('background', '#000567');
});

Code:

<script src="jquery-1.7.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#divClassusingID').css('background', '#000567');
});
</script>

<div>
<div id="divClassusingID" style="width:400px">
adf
</div>
</div>

Class Selector

$(document).ready(function () {
$('.divClassusingID').css('background', '#000567');
});

Code:

<script src="jquery-1.7.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('.divClassusingID').css('background', '#000567');
});
</script>

<div>
<div class="divClassusingID" style="width:400px">
hi uday
</div>
</div>

Element Selector

$(document).ready(function () {
$('.divClassusingID').css('background', '#000567');
});

Code:

<script src="jquery-1.7.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('p').css('font-size', '40px');
});
</script>

<div>
<div class="divClassusingID" style="width:400px">
<p> hi uday</p>
</div>
</div>

output:

Apply css to Form Selector

<head runat="server">
<title></title>
<script src="jquery-1.7.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('form *').css('color', '#FF99CC');
});
</script>
</head>

<body>
<form id="form1" runat="server">
<div>
<div class="divClassusingID" style="width:400px">
<p> hi uday</p>
adsfasf
</div>
</div>
</form>
</body>

Select Multiple Elements

$('p, div').css('color', '#FF99CC');

It applys css color to paragraph and div

<head runat="server">
<title></title>
<script src="jquery-1.7.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('p, div').css('color', '#FF99CC');
});

</script>
</head>

<body>
<form id="form1" runat="server">
<div>
<div class="divClassusingID" style="width:400px">
<p> hi uday</p>
<div> hi uday</div>
</div>
</div>
</form>
</body>

</html>

Output:

The parent > child (immediate child element)

$(document).ready(function () {
$('div > p').css('color', '#FF99CC');

})

It is going to apply styles to paragraph in div.

<head runat="server">
<title></title>
<script src="jquery-1.7.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('div > p').css('color', '#FF99CC');
});

</script>
</head>

<body>
<form id="form1" runat="server">
<div class="divClassusingID" style="width:400px">
<p> hi uday </p>
<p>hi uday </p>
<p>hi uday </p>
<p>hi uday </p>
</div>
<p>hi uday </p>
</form>
</body>

</html>

Output:

:first and :last

:first : It will find the first element.
:last : It will find the last element

<head runat="server">
<title></title>
<script src="jquery-1.7.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('p:first').css('color', '#FF99CC');
$('p:last').css('color', '#FF99CC');
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div class="divClassusingID" style="width:400px">
<p> hi uday </p>
<p>hi uday </p>
<p>hi uday </p>
<p>hi uday </p>
</div>
<p>hi uday </p>
</form>
</body>

output:

:even and :odd
Now, i want to find out the even and odd elements.
Here , the index starts with 0.

<head runat="server">
<title></title>
<script src="jquery-1.7.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('tr:even').css('color', '#FF99CC');
$('tr:odd').css('color', '#0000FF');
});
</script>
</head>

<body>
<form id="form1" runat="server">
<div class="divClassusingID" style="width:400px">
<table>
<tr><td>hi uday</td></tr>
<tr> <td>hi uday</td> </tr>
<tr> <td>hi uday</td> </tr>
<tr><td>hi uday</td> </tr>
<tr><td>hi uday</td></tr>
<tr><td>hi uday</td></tr>
<tr> <td>hi uday</td></tr>
<tr><td>hi uday</td> </tr>
</table>
</div>
</form>

Output:

show and hide methods()

javascript code:

<script type="text/javascript">
$(document).ready(function () {
$('#visibleoncheck').hide();
$('#CheckBox1').live('click', function () {
if ($(this).is(':checked')) {
$('#visibleoncheck').show();

} else {
$('#visibleoncheck').hide();
}
});
});

</script>

<div>
<table border="0" cellspacing="0" cellpadding="0" style="width: 100%;">
<tr>
<td>Hi Uday </td>
<td>HI</td>
</tr>
<tr>
<td>Check Required</td>
<td> <asp:CheckBox ID="CheckBox1" runat="server" /></td>
</tr>
<tr id="visibleoncheck">
<td>Visible</td>
<td><asp:Label ID="Label2" runat="server" Text="Visible "></asp:Label></td>
</tr>
</table>

</div>

output: