Recent News

MULTI FILE UPLOAD USING JQUERY

Herewith I have explained and given the code for multiple file upload using jquery.
We know all the normal upload functionality. But someone of us wants the multiple file upload in .NET. Here jquery makes that very easy.
We just use the same asp:fileupload control. If you want to accept only jpg,png only you no need to go for a customvalidator tocheck the file extension. You just add the accept="jpg|png". Thats it. It allows only files which has the extension of above.
Ok let us see the code below,

HEAD SECTION:
<script src="Scripts/jquery-1.3.2.js" type="text/javascript"></script>
<script src="Scripts/jquery.MultiFile.js" type="text/javascript"></script>
 
BODY TAG:
<div>

<asp:FileUpload ID="fupImage" runat="server" class="multi" accept="" />
<br />
<asp:Button ID="btnUpload" runat="server" Text="Upload All" OnClick="btnUpload_Click" />
</div>

Thats it about in the UI page(aspx).
Let us see the code behind page,

the following code should be inside in the upload button event,

try

{
// Get the HttpFileCollection
HttpFileCollection hfc = Request.Files;
Guid newid = new Guid();
newid = System.Guid.NewGuid();
for (int i = 0; i < hfc.Count; i++)
{
HttpPostedFile hpf = hfc[i];
if (hpf.ContentLength > 0)
{
hpf.SaveAs(Server.MapPath("Files") + "\\" +
System.IO.Path.GetFileName(newid + hpf.FileName));
Response.Write("Uploaded Successfully <br/>");
}
}
}
catch (Exception ex)
{
// ERROR OCCURED
}
 
Feel free to post your comments here!... If any one wants the whole solution post your mailid here. I will send mail to you personally.....
 
“You have to dream before your dreams can come true.” - A P J


Radio Button Event

Here I have explained the events of radio button with javascript.
Let me explain the scenarion first,
We are having two radio button say radioobtn1 and radiobtn2. If I click on the button 1 then I need to show one DIVor FORM. same as when I click on radiobtn 2. I have given the code for the above scenarion.

<script>
function show()
{
if(document.getElementById('radiobtn1').checked)
{
document.form1.style.display='block';
document.form2.style.display='none';
}
else
{
document.form1.style.display='none';
document.form2.style.display='block';
}
}
</script>


<input type="radio" checked="checked" onClick="javascript:show()" name="radiobtn1" id="radiobtn1" value="radiobtn1" /> Radiobtn1
<input type="radio" name="radiobtn2" onClick="javascript:show()" id="radiobtn2" value="radiobtn2" /> radiobutton2

<form action='#url' name="form1" METHOD='POST'>
<table>
<tr class="displaynone">
<td>THIS IS FORM1
contents goes here
</td>
</table>
</form>


<form action='#url' class="displaynone" name="form2" METHOD='POST'>
<table>
<tr class="displaynone">
<td>THIS IS FORM2:

contents goes here

</td>
</table>
</form>
 
 
Hope this should help for freshers and even for all.....
 
Happy Coding!!!!!!!!!
 
 
 

Expand DIV using jquery

Hi All,

     Here you can get the idea about the expanding of div inside an master page or any other pages. This has some animation. That is if you click on the Login Link then the below login tab will be open with some animation.
    Here you may find the style used for this sample in style tag. Please have a look at the following coding,

This should be inside the head tag.

<script src="js/jquery-1.2.6.min.js" type="text/javascript"></script>
<style type="text/css" media="screen">
#expand
{
display: none;
background-color: Transparent;
position: absolute;
z-index: 100; /* padding: 16px;
background-color: Blue;
z-index: 1000;
width:350px; */
}

.expandInfo
{
background-color: Transparent;
margin: 0;
padding: 0px;
}
</style>
 

<script type="text/javascript">
<!--
$(function () {
$('.expandInfo a').click(function () {
$('#expand').slideToggle(1500);
return false;
});
})
//-->
</script>

<script type="text/javascript">
<!--
$(function () {
$('.expandInfoClose a').click(function () {
$('#expand').slideToggle(1500);
return false;
});
})
//-->
</script>
 
Then the body content may be as follows,
 
<div class="bg">
<p class="expandInfo">
<a href="#home" title="Login" class="login" style="width: 100px; height: 100px;">Login</a>
</p><br />
<br />
<div id="expand"><table cellpadding="0" cellspacing="0" class="loginbg">
<tr>
<td valign="top" style="padding-left: 30px">
<div style="float: right; padding-right: 10px">
<p class="expandInfoClose">
<a href="#home" title="Close">
<asp:Image runat="server" ID="imgcloselog" SkinID="imgLoginBoxClose" />
</a>
</p>
</div>
<asp:Panel runat="server" ID="pnlLoginMaster" DefaultButton="btnLogin">
<table cellpadding="4" cellspacing="4" align="left" style="margin-top: 60px;">
<tr>
<td align="left" valign="top">
<%--// CONTENTS--%>
cellspacingcellspacingcellsp acingcellspacing cellspacing cellspacingcells pacingcellspacingcellspacing
cellspacing cellsp acing cellspa cingcellspa cingcel lspacingce llsp acing
</td>
</tr>
</table>
</asp:Panel>
</td>
</tr>
</table>
</div>
</div>

You can download the jquery here
If you have any questions please feel free to post comments....
Suggessions always welcome ..........Happy coding!!!!!!!

Meet you again!!!!!!!!

Get Top 1 Record from Dataset

Hi Guys,

     Many of them in need of getting the Top 1 or Top 10 records from a Dataset without going to SQL query. It is possible to do from Code Behind. I have given the code below,
     The below code is to get single record from a Dataset. Also I have given for getting 8 records at Green Color.

  public DataSet GetTopTen(DataSet ds)
{
try
{
DataView dv = ds.Tables[0].DefaultView;
dv.Sort = "ModifiedDatetime DESC";
DataSet dss = new DataSet();
DataTable dt = dv.Table.Clone();
dss.Tables.Add(dt);

// This is To get 8 records
//int counter = 0;
//if (dv.Count > 8)
// counter = 8;
//else
// counter = dv.Count;
//for (int i = 0; i < counter; i++)
//{
// DataRow dv = dv[i].Row;
// dss.Tables[0].ImportRow(dv);
//}

// This is for Getting only one Record
DataRow dv = dv[0].Row;
dss.Tables[0].ImportRow(dv);
dss.AcceptChanges();
return (dss);
}

catch (Exception e)
{
throw e;
}
}

Hope this will help you Guys.... Please touch with this blog... I will update regularly....



Followers

Top Commentators

Recent Comments | Recent Posts


bottom