ASP.NET 5 Hosting Spain - HostForLIFE.eu :: Sending Data to Another Page Using jQuery with QueryString in ASP.NET 5

January 12, 2015 06:37 by author

With this article, I will tell you about sending data to another page using jQuery with QueryString in ASP.NET 5. The page PassDataJQueryQueryString.aspx (Source Page), this is the page from where we want to send the data (value). The page consists of an TextBox for Name ,TextBox for Qualification and DropDownList for Technology whose values we need to send to the other page ( In this tutorial I named it: DestinationPage.aspx).

Source Page(PassDataJQueryQueryString.aspx)
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title> Sending Data to Another Page Using jQuery with QueryString in ASP.NET 5</title>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#btnSubmit").click(function () {
                var url = "DestinationPage.aspx?name=" + encodeURIComponent($("#txtName").val()) + "&Qualification=" + encodeURIComponent($("#txtQualification").val()) + "&technology=" + encodeURIComponent($("#ddlTechnology").val());
                window.location.href = url;
                return false;
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <table>
            <tr>
                <td>
                    Name
                </td>
                <td>
                    :
                </td>
                <td>
                    <asp:TextBox ID="txtName" runat="server"></asp:TextBox>
                </td>
            </tr>
            <tr>
                <td>
                    Qualification
                </td>
                <td>
                    :
                </td>
                <td>
                    <asp:TextBox ID="txtQualification" runat="server"></asp:TextBox>
                </td>
            </tr>
            <tr>
                <td>
                    Technology
                </td>
                <td>
                    :
                </td>
                <td>
                    <asp:DropDownList ID="ddlTechnology" runat="server">
                        <asp:ListItem Value=".NET" Text=".NET">
                        </asp:ListItem>
                        <asp:ListItem Value="Java" Text="Java">
                        </asp:ListItem>
                        <asp:ListItem Value="PHP" Text="PHP">
                        </asp:ListItem>
                        <asp:ListItem Value="SAP" Text="SAP">
                        </asp:ListItem>
                    </asp:DropDownList>
                </td>
            </tr>
            <tr>
                <td colspan="3">
                    <asp:Button ID="btnSubmit" runat="server" Text="Submit" />
                </td>
            </tr>
        </table>
    </div>
    </form>
</body>
</html>

Destination Page(DestinationPage.aspx):
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
    <script type="text/javascript">
        var getData = new Array();
        $(function () {
            if (getData.length == 0) {
                if (window.location.search.split('?').length > 1) {
                    var params = window.location.search.split('?')[1].split('&');
                    for (var i = 0; i < params.length; i++) {
                        var key = params[i].split('=')[0];
                        var value = decodeURIComponent(params[i].split('=')[1]);
                        getData [key] = value;
                    }
                }
            }
            if (getData["name"] != null && getData["Qualification"] != null && getData["technology"] != null) {
                var data = "<u>Values in Previous Page</u><br /><br />";
                var name;
                name = getData["name"];
                $("#lblName").html(name);
                var qualification;
                qualification = getData["Qualification"];
                $("#lblQualification").html(qualification);
                var technology;
                technology = getData["technology"];
                $("#lblTechnology").html(technology);
            }
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <table>
            <tr>
                <td>
                    Name
                </td>
                <td>
                    :
                </td>
                <td>
                    <asp:Label ID="lblName" runat="server"></asp:Label>
                </td>
            </tr>
            <tr>
                <td>
                    Qualification
                </td>
                <td>
                    :
                </td>
                <td>
                    <asp:Label ID="lblQualification" runat="server"></asp:Label>
                </td>
           </tr>
            <tr>
                <td>
                    Technology
                </td>
               <td>
                    :
                </td>
                <td>
                    <asp:Label ID="lblTechnology" runat="server"></asp:Label>
                </td>
            </tr>
        </table>
    </div>
    </form>
</body>
</html>

And this is the output:

Comments (0) | RSS comment feed

Comment RSS

ASP.NET 5 Hosting Italy - HostForLIFE.eu :: How to Create ImageButton Control in ASP.NET ?

January 9, 2015 05:35 by author

Peter

With this post, I will tell you how to create ImageButton Control in ASP.NET 5. First, you need to declare ASP.NET ImageButton Control. Declare the ImageButton by the below code with property,As like Alternative text, ImageUrl,Height,Width.Image Button is predefined Asp.net web control Use in web development.

Declare ImageButton by fallowing code with property,As like Alternative text, ImageUrl,Height,Width.Image Button is predefined Asp.net web control Use in web development.
And here is the code:
<asp:ImageButton id="imagebutton1" runat="server"
    AlternateText="ImageButton 1"
    ImageAlign="left"
    ImageUrl="~/Images/image1.jpg"
    OnClick="ImageButton_Click" Height="148px" Width="274px"/>

For Access ImageButton by javascript we use following code:
<script language="C#" runat="server">
void ImageButton_Click(object sender, ImageClickEventArgs e)
      {
         Label1.Text = "You clicked ImageButton control at the coordinates: (" +
                       e.X.ToString() + ", " + e.Y.ToString() + ")";
      }
   </script>
The JavaScript code we get clicked position in Image.and print this on the Label Text.

Code of ASP.NET Image Control:
<%@ Page Language="C#" AutoEventWireup="True" %>
<!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>
    <title>ImageButton Sample</title>
<script language="C#" runat="server">
      void ImageButton_Click(object sender, ImageClickEventArgs e)
      {
         Label1.Text = "You clicked ImageButton control at the coordinates: (" +
                       e.X.ToString() + ", " + e.Y.ToString() + ")";
      }
</script>
</head>
<body style="height: 261px">
   <form id="form1" runat="server">
      <h3>ImageButton Example:</h3>
      Click Anywhere on the image.<br /><br />
      <asp:ImageButton id="imagebutton1" runat="server"
           AlternateText="ImageButton 1"
           ImageAlign="left"
           ImageUrl="~/Images/Image1.jpg"
           OnClick="ImageButton_Click" Height="148px" Width="274px"/>
      <br />
      <br />
      <br />
      <asp:label id="Label1" runat="server"/>
      <br />
   </form>
</body>
</html>

Finally, this is the result:

Comments (0) | RSS comment feed

Comment RSS

ASP.NET 5 Hosting Russia - HostForLIFE.eu :: How to Preview Image Before Upload with jQuery in ASP.NET ?

January 5, 2015 05:13 by author

Peter

With this article, I will explain you how to preview image before upload with jQuery using FileUpload in ASP.NET 5. While for the browsers that support HTML5 i.e. Internet Explorer, Mozilla FireFox, Google Chrome and Opera, the image preview will display usingHTML5 FileReader API. Preview image before upload using FileUpload control and jQuery in ASP.NET.

Method 1:
In this method 1, we will use the code below
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>Preview image before upload using FileUpload control and jQuery in ASP.NET </title>
    <script src="http://code.jquery.com/jquery-1.10.2.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        function PreviewImageBeforeUpload(Imagepath) {
            if (Imagepath.files && Imagepath.files[0]) {
                var Filerdr = new FileReader();
                Filerdr.onload = function (e) {
                    $('#ImagePreview').attr('src', e.target.result);
                }
                Filerdr.readAsDataURL(Imagepath.files[0]);
            }
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:FileUpload ID="FilePreview" runat="server" onchange="PreviewImageBeforeUpload(this);" />
        <br />
        <asp:Image ID="ImagePreview" runat="server" Width="150px" Height="150px" />
        <asp:Button ID="btnSubmit" runat="server" Text="Upload" />
    </div>
    </form>
</body>
</html>

Next, Method 2 will using the DXImageTransform filter CSS property in browsers that don’t support HTML5 i.e. Internet Explorer 8 and 9.

Method 2:
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>Preview image before upload using FileUpload control and jQuery in ASP.NET
    </title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script language="javascript" type="text/javascript">
        $(function () {
            $("#FilePreview").change(function () {
                $("#ImagePreview").html("");
                var regex = /^([a-zA-Z0-9\s_\\.\-:])+(.jpg|.jpeg|.gif|.png|.bmp)$/;
                if (regex.test($(this).val().toLowerCase())) {
                    if ($.browser.msie && parseFloat(jQuery.browser.version) <= 9.0) {
                        $("#ImagePreview").show();
                        $("#ImagePreview")[0].filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = $(this).val();
                   }
                    else {

                        $("#ImagePreview").show();
                        $("#ImagePreview").append("<img />");
                        var Filerdr = new FileReader();
                        Filerdr.onload = function (e) {
                            $("#ImagePreview img").attr("src", e.target.result);
                        }
                        Filerdr.readAsDataURL($(this)[0].files[0]);
                    }
                } else {
                    alert("Please upload a valid image file.");
                }
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:FileUpload ID="FilePreview" runat="server" />
        <br />
        <div id="ImagePreview" style="width: 150px; height: 150px">
        </div>
        <asp:Button ID="btnSubmit" runat="server" Text="Upload" />
    </div>
    </form>
</body>
</html>

Comments (0) | RSS comment feed

Comment RSS

ASP.NET 5 Hosting France - HostForLIFE.eu :: Develop a Captcha Image Generator in ASP.NET

December 19, 2014 05:38 by author

Peter

In this tutorial, I will explain you how to Develop a Captcha Image Generator in ASP.NET 5 with C# or VB.NET. CAPTCHA stands for "Completely Automated Public Turing test to tell Computers and Humans Apart". And here is the code that I use to generate take one .aspx page as GenerateCaptcha.aspx :

GenerateCaptcha.aspx.cs:
using System.IO;
using System.Drawing;
using System.Drawing.Drawing2D;
using System.Drawing.Imaging;
public partial class GenerateCaptcha : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        Response.Clear();
        int height = 40;
        int width = 110;
        Bitmap bmp = new Bitmap(width, height);
        RectangleF rectf = new RectangleF(12, 6, 0, 0);
        Graphics g = Graphics.FromImage(bmp);
        g.Clear(Color.White);
        g.SmoothingMode = SmoothingMode.AntiAlias;
        g.InterpolationMode = InterpolationMode.HighQualityBicubic;
        g.PixelOffsetMode = PixelOffsetMode.HighQuality;
        g.DrawString(Session["captcha"].ToString(), new Font("Cambria", 13, FontStyle.Bold), Brushes.Red, rectf);
        g.DrawRectangle(new Pen(Color.Green), 1, 1, width - 15, height -10);
        g.Flush();
        Response.ContentType = "image/jpeg";
        bmp.Save(Response.OutputStream, ImageFormat.Jpeg);
        g.Dispose();
        bmp.Dispose();
    }
}

Take .aspx where you want to use captcha.
UseCaptcha.aspx
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Create your own captcha image generator in ASP.NET using C#.NET/VB.NET</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                <table>
                    <tr>
                        <td style="height: 50px; width: 100px;">
                            <asp:Image ID="imgCaptcha" runat="server" />
                        </td>
                        <td valign="middle">
                            <asp:Button ID="btnRefresh" runat="server" Text="Refresh" OnClick="btnRefresh_Click" />
                        </td>
                    </tr>
                </table>
            </ContentTemplate>
        </asp:UpdatePanel>
        Enter Captcha:
        <asp:TextBox ID="txtCaptcha" runat="server"></asp:TextBox><br />
        <asp:Button ID="btnSubmit" runat="server" Text="Submit" OnClick="btnSubmit_Click" />
    </div>
    </form>
</body>
</html>

UseCaptcha.aspx.cs
using System.Text;
using System.Drawing.Imaging;
public partial class UseCaptcha : System.Web.UI.Page
{
   protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            FillCaptcha();
        }
    }
    void FillCaptcha()
    {
try
Random random = new Random();
string combination = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz";
StringBuilder captcha = new StringBuilder();
for (int i = 0; i < 6; i++)
captcha.Append(combination[random.Next(combination.Length)]);
Session["captcha"] = captcha.ToString();
imgCaptcha.ImageUrl = "GenerateCaptcha.aspx";
}
catch
{
throw;
}
}
protected void btnRefresh_Click(object sender, EventArgs e)
{
FillCaptcha();
}
protected void btnSubmit_Click(object sender, EventArgs e)
{
if (Session["captcha"].ToString() != txtCaptcha.Text)
Response.Write("Enter Valid Captcha Code");
FillCaptcha();
}
}

And this is the result from the code:

Comments (0) | RSS comment feed

Comment RSS

HostForLIFE.eu Proudly Launches ASP.NET 5 Hosting

December 8, 2014 10:06 by author

Peter

European leading web hosting provider, HostForLIFE.eu announces the launch of ASP.NET 5 support on the recently released Windows Server 2012 R2.

HostForLIFE.eu was established to cater to an under served market in the hosting industry; web hosting for customers who want excellent service. HostForLIFE.eu – a cheap, constant uptime, excellent customer service, quality, and also reliable hosting provider in advanced Windows and ASP.NET technology. HostForLIFE.eu proudly announces the availability of the ASP.NET 5 hosting in our entire servers environment.

ASP.NET is Microsoft's dynamic website technology, enabling developers to create data-driven websites using the .NET platform and the latest version is 5 with lots of awesome features. ASP.NET 5 is a lean .NET stack for building modern web apps. Microsoft built it from the ground up to provide an optimized development framework for apps that are either deployed to the cloud or run on-premises. It consists of modular components with minimal overhead.

According to Microsoft officials, much of the functionality in the ASP.NET 5 release is a new flexible and cross-platform runtime, a new modular HTTP request pipeline, Cloud-ready environment configuration, Unified programming model that combines MVC, Web API, and Web Pages, Ability to see changes without re-building the project, etc.

HostForLIFE.eu hosts its servers in top class data centers that is located in Amsterdam (NL), London (UK), Paris (FR) and Seattle (US) to guarantee 99.9% network uptime. All data center feature redundancies in network connectivity, power, HVAC, security, and fire suppression. All hosting plans from HostForLIFE.eu include 24×7 support and 30 days money back guarantee. The customers can start hosting our ASP.NET 5 site on our environment from as just low €3.00/month only.

HostForLIFE.eu is a popular online ASP.NET based hosting service provider catering to those people who face such issues. The company has managed to build a strong client base in a very short period of time. It is known for offering ultra-fast, fully-managed and secured services in the competitive market.

HostForLIFE.eu offers the latest European ASP.NET 5 hosting installation to all our new and existing customers. The customers can simply deploy our ASP.NET 5 website via our world-class Control Panel or conventional FTP tool. HostForLIFE.eu is happy to be offering the most up to date Microsoft services and always had a great appreciation for the products that Microsoft offers.

Further information and the full range of features ASP.NET 5 Hosting can be viewed here http://hostforlife.eu/European-ASPNET-5-Hosting

About Company
HostForLIFE.eu is European Windows Hosting Provider which focuses on Windows Platform only. HostForLIFE.eu deliver on-demand hosting solutions including Shared hosting, Reseller Hosting, Cloud Hosting, Dedicated Servers, and IT as a Service for companies of all sizes.

HostForLIFE.eu is awarded Top No#1 SPOTLIGHT Recommended Hosting Partner by Microsoft (see http://www.asp.net/hosting/hostingprovider/details/953). Their service is ranked the highest top #1 spot in several European countries, such as: Germany, Italy, Netherlands, France, Belgium, United Kingdom, Sweden, Finland, Switzerland and other European countries. Besides this award, we have also won several awards from reputable organizations in the hosting industry and the detail can be found on our official website.

Comments (0) | RSS comment feed

Comment RSS

European ASP.NET 4.5 Hosting BLOG

ASP.NET 5 Hosting Spain - HostForLIFE.eu :: Sending Data to Another Page Using jQuery with QueryString in ASP.NET 5

ASP.NET 5 Hosting Italy - HostForLIFE.eu :: How to Create ImageButton Control in ASP.NET ?

ASP.NET 5 Hosting Russia - HostForLIFE.eu :: How to Preview Image Before Upload with jQuery in ASP.NET ?

ASP.NET 5 Hosting France - HostForLIFE.eu :: Develop a Captcha Image Generator in ASP.NET

HostForLIFE.eu Proudly Launches ASP.NET 5 Hosting

About HostForLIFE.eu

Month List

Other Important BLOGs

Featured on

European ASP.NET 4.5 Hosting BLOG

ASP.NET 5 Hosting Spain - HostForLIFE.eu :: Sending Data to Another Page Using jQuery with QueryString in ASP.NET 5

ASP.NET 5 Hosting Italy - HostForLIFE.eu :: How to Create ImageButton Control in ASP.NET ?

ASP.NET 5 Hosting Russia - HostForLIFE.eu :: How to Preview Image Before Upload with jQuery in ASP.NET ?

ASP.NET 5 Hosting France - HostForLIFE.eu :: Develop a Captcha Image Generator in ASP.NET

HostForLIFE.eu Proudly Launches ASP.NET 5 Hosting

About HostForLIFE.eu

Month List

Other Important BLOGs

Featured on

Tag cloud