File Upload Control with File Type Filter

Hi,

We are going to learn how to upload a File using FileUpload Control in ASP.NET.

ASPX Code

We Placed a FileUpload Control and a button to Click.

<asp:FileUpload ID="FileUpload1" runat="server"  /> 
<asp:Button ID="BtnUpload" runat="server" Text="Upload File" onclick="BtnUpload_Click" />

Back-end Code

Now BtnUpload_Click event in .cs page.
We are going to Upload only Picture (.JPG file or .BMP file).

 
protected void BtnUpload_Click(object sender, EventArgs e)
    {
       string sSiteFolder = "ResumeFolder";
       string sRealPath = Server.MapPath(sSiteFolder);
       if (!Directory.Exists(sRealPath))
           Directory.CreateDirectory(sRealPath);
       string CompletePath = sRealPath + FileUpload1.FileName;
       string FileExt = CompletePath.Substring(CompletePath.IndexOf("."));
       switch (FileExt)
         { 
          case ".jpg":
                FileUpload1.SaveAs(sRealPath + FileUpload1.FileName);
                break;
          case ".JPG":
                FileUpload1.SaveAs(sRealPath + FileUpload1.FileName);
                break;
          case ".bmp":
                FileUpload1.SaveAs(sRealPath + FileUpload1.FileName);
                break;
          case ".BMP":
                FileUpload1.SaveAs(sRealPath + FileUpload1.FileName);
                break;
         }
     }

Enjoy...
John Bhatt

Read More

Support Help Nepal Network by Facebook.

Facebook....
A method to Pass Time and in its language utility to connect with World. There are more accounts on Facebook than the Polulation of Earth.

Friends, some one is willing to do good work using Facebook. You should support. Just one click to Support a will to do for the Nation. I think every body wants to do something for his nation. Its time to do something.

Lets Vote for Help Nepal Network on Chase Community Giving's Polling Competition.

http://apps.facebook.com/chasecommunitygiving/charity/view/ein/51-0496452

Like application. and Vote.

Read More

Pagination with DataList

Hi,
As we know, DataList is the most versatile Data Bound Control available in ASP.NET. Where you can display data as per your need in your required style, direction etc.
But there is some problem also. There is no option to Paginate the Data Loaded in DataList directly. In case we have too many records, we can not display all them in One Page without paginating.

To escape from this situation, Developers move to GridView, which has easy support for Paginating data.

Today, we will learn How to Paginate DataList data in Simple steps.


First create a DataList as per your requirement. I made like below which is quite simple.





Lets place Next and Previous Buttons for Navigation. Code for above design is below:

Code in ASPX Page (Design)

  <asp:DataList ID="DataList1" runat="server" Height="194px" Width="174px" 
            oneditcommand="DataList1_EditCommand" 
            oncancelcommand="DataList1_CancelCommand" 
            onupdatecommand="DataList1_UpdateCommand" DataKeyField="eno">
            <HeaderTemplate>
              
              <table width="450" border="2">
                <tr>
                    <th>Employee Name </th>
                    <th>Designation </th>
                    <th>Salary </th>
                    <th>
                        Edit
                    </th>
                </tr>
               
            </HeaderTemplate> 
            <EditItemTemplate>
                <tr>
                    <td>
                        <asp:TextBox ID="txtEname" Text='<%#Eval("ename")%>' runat="server" />
                    </td>
                    <td>
                        <asp:TextBox ID="txtJOb" Text='<%#Eval("job")%>' runat="server" />
                    </td>
                    <td>
                        <asp:TextBox ID="txtSal" Text='<%#Eval("sal")%>' runat="server" />
                    </td>
                    <td>
                        <asp:LinkButton ID="lnk2" runat="server" Text="Update" CommandName ="Update" />
                    </td>
                    <td>
                        <asp:LinkButton ID="LinkButton1" runat="server" Text="Cancel"
                         CommandName ="Cancel" />
                    </td>
                </tr>
            
            </EditItemTemplate> 
            <ItemTemplate>
                <tr>
                    <td><%#Eval("ename")%></td>
                    <td><%#Eval("job")%></td>
                    <td><%#Eval("sal")%></td>
                    <td>
                        <asp:LinkButton ID="lnk1" CommandName="Edit"  Text="Edit !" runat="server" />
                    </td>
                </tr>
                
            </ItemTemplate> 
            
            <FooterTemplate>
              </table>
            </FooterTemplate> 
        </asp:DataList>
        <br />
    <table class="style1">
        <tr>
            <td class="style2">
                <asp:LinkButton ID="LinkButton2" runat="server" onclick="LinkButton2_Click">Next</asp:LinkButton>
            </td>
            <td>
                <asp:LinkButton ID="LinkButton3" runat="server" onclick="LinkButton3_Click">Previous</asp:LinkButton>
            </td>
        </tr>
    </table> 

Now Lets to to Backend. ASPX.CS Page (Code Behind):

protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            CurrentPageIndex = 0;
            showData(); 
        }
    }
    int pg = 0;
    void showData()
    {
        PagedDataSource pgd = new PagedDataSource();
        SqlDataAdapter da = new SqlDataAdapter("select * from emp", "Data Source=.\\SQLDB;Database=Test1;Integrated Security=True");
        DataSet ds = new DataSet();
        da.Fill(ds);

        pgd.DataSource = ds.Tables[0].DefaultView;
        pgd.CurrentPageIndex = CurrentPageIndex ;
        pgd.AllowPaging = true;
        pgd.PageSize = 5;

        LinkButton2.Enabled = !(pgd.IsLastPage);
        LinkButton3.Enabled = !(pgd.IsFirstPage);
  
 
        DataList1.DataSource = pgd;
        DataList1.DataBind();

    }

    protected void DataList1_EditCommand(object source, DataListCommandEventArgs e)
    {
        DataList1.EditItemIndex = e.Item.ItemIndex;
        showData(); 
    }
    protected void DataList1_CancelCommand(object source, DataListCommandEventArgs e)
    {
        DataList1.EditItemIndex = -1;
        showData(); 
    }
    protected void DataList1_UpdateCommand(object source, DataListCommandEventArgs e)
    {

    }

    public int CurrentPageIndex
    {
        get
        {
            if (ViewState["pg"] == null)
                return 0;
            else
                return Convert.ToInt16(ViewState["pg"]); 
        }
        set
        {
            ViewState["pg"] = value; 
        }
    } 

protected void LinkButton2_Click(object sender, EventArgs e)    {
        CurrentPageIndex++;
        showData();
    }
    protected void LinkButton3_Click(object sender, EventArgs e)
    {
        CurrentPageIndex--;
        showData();
    }

Now Let me Describe things happened in above code:




Move to showData() function.








We created a new object of PagedDataSource. Paged data source as name stands clear, paginated data.





Now we wrote Query, Passed in Adapter, Filled DataSet which should be all clear, because it was Basic Task in ADO.NET. Now we gave it CurrentPageIndex. means where is page now.








For this, just look below to a class CurrentPageIndex which is returning value of CurentPageIndex =0 if page is beling Loaded. To check whether page is loaded or postback, we take help of ViewState. If ViewState["pg"] == null, On Page load this will be null because it is just being initiated. On Postback it will pass the Int value stored in it to CurrentPageIndex.








We set Pagination in PagedDataSource true and Define Page size of 5 records per page.


Now Passed PagedDataSource object as Datasource of Datalist.








Now Linkbutton click events, We increased and Decreased value of CurrentPageIndex.








Hope this must be helpful to you. In case of Any problem, correction in code and help, feel free to comment below.





John Bhatt




Glad to Know, Free to Share.....





http://www.johnbhatt.com

Read More

Rich Text Editor with ASP.NET

Introduction

As we know, ASP.NET lack a Control, that we need most, RichText Editor. 

If you are trying to create a application or website with Admin Panel or Blog or Forum Website or something such project for Web in ASP.NET platform, we need RickText Editor. 

To overcome from this, we can use Many open source JavaScript based editors, like Tiny MCE, FCKEditor, etc.

Content:

In this Article, we would learn how to Implement Free RichText Editor into ASP.NET website. We are using TinyMCE editor here.

We are using TinyMCE, which is One of most popular and Open Source project. Download latest version of TinyMCE from Download Page, and Extract the Zip File.

Browse the Extracted Location and go to ..\tinymce_3.5.6\tinymce\jscripts folder.

Now Copy the tinymce folder from above Location to your Solution in Visual Studio.

Add a Page where you want to Implement RichTextbox and Design the Page.

Now lets Move to Topic. How to Add TinyMCE in Page and Richtext box Control placed for Content of Blog in above sample.

Insert JavaScript file tiny_mce.js in Web Page and some also initialize this function.

This Code into head Section.

 
<script type="text/javascript" src="tiny_mce/tiny_mce.js"></script>
    <script type="text/javascript" language="javascript">
        tinyMCE.init({
            // General options
            mode: "textareas",
            theme: "advanced",
            plugins: "pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups",
        });
    </script>

Note: You can so many settings, look in Samples and Help Doc of TinyMCE.

Now Run the Page. Look, how it looked.

Without any additional Practice, our TextBox with Multiline turned into RichText Editor.

Now, its ok as per Requirement. No, when you will send Command to Server, it will return Error Like below.

We have to add just One Line of Code in Web.config file and one property in Default.aspx form (Page with Rich Text Editor).

That is : 

in web.config:

<configuration>
  <system.web>
    <compilation debug="true" targetFramework="4.0"/>
    <httpRuntime requestValidationMode="2.0"/>
  </system.web>
</configuration>

and in Page directive:

ValidateRequest = "false"

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" ValidateRequest="false" %> 

Now, you can save the Data in Database, Do postback, retrieve same in Rich Text box and do anything you want.

Conclusion

IT is Jugad. So enything is possible here. Don't be worry about things that are not available. Just modify and make use of things those are available. Tiny MCE is one of the most known and Popular Rich Text editor (WYSIWYG).

You can find many more articles written by me on Dotnetspider also. Have a look at them.
You can add me to your Circle on Google+ at +John Bhatt

Hope this will be helpful to you. 

Read More