Translate

Wednesday, 13 May 2015

Google Maps in mvc4



Google Maps shown below



<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <style type="text/css">
        html {
            height: 100%;
        }

        body {
            height: 100%;
            margin: 0;
            padding: 0;
        }

        #map-canvas {
            height: 100%;
        }
    </style>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
    <script type="text/javascript"
        src="https://maps.googleapis.com/maps/api/js?sensor=false">
    </script>
    <script type="text/javascript">
        function initialize(location) {

            console.log(location);

            var mapOptions = {

                center: new google.maps.LatLng(location.coords.latitude, location.coords.longitude),
                zoom: 8
            };
            var map = new google.maps.Map(document.getElementById("map-canvas"),
            mapOptions);
        }

        $(document).ready(function () {
            navigator.geolocation.getCurrentPosition(initialize);
        });
    </script>
</head>
<body>
    <div id="map-canvas" />
</body>
</html>


Output Map

Tuesday, 12 May 2015

Apply watermark text for text boxes in HTML in different Ways


we can apply water mark to html text boxes.

Using watermark plugin

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
  <script src="~/Scripts/WaterMark.min.js"></script>

    <script>
        $(document).ready(function () {
            $("#txtName,#Email,#Mobile").WaterMark();
        });
    </script>
<body>
<table>

        <tr>
            <td>Name:</td>
            <td>
                <input type="text" id="txtName" title="Enter Name" />
            </td>
        </tr>
        <tr>
            <td>Email:</td>
            <td>
                <input type="text" id="Email" title="Enter Email" /></td>
        </tr>
        <tr>
            <td>Mobile:</td>
            <td>
                <input type="text" id="Mobile" title="Enter Mobile" /></td>
        </tr>
    </table>

</body>





using naormal place holder

<body>

<form action="demo_form.asp">
  <input type="text" name="fname" placeholder="First name"><br>
  <input type="text" name="lname" placeholder="Last name"><br>
  <input type="submit" value="Submit">
</form>

</body>

Monday, 4 May 2015

simple Captcha in MVC

Simple Captcha In MVC :

In Model:
 public class SubscribeModel
    {
        //model specific fields
        [Required]
        [Display(Name = "How much is the sum")]
        public string Captcha { get; set; }

    }

In Controller:

Name Spaces in controller:

using System.Drawing;
using System.IO;
using System.Drawing.Drawing2D;
using System.Drawing.Text;

using JQGridExample.Models;


public ActionResult Index()
   {
            return View();

   }

   public ActionResult CaptchaImage(string prefix, bool noisy = true)
        {
            var rand = new Random((int)DateTime.Now.Ticks);
            //generate new question
            int a = rand.Next(10, 99);
            int b = rand.Next(0, 9);
            var captcha = string.Format("{0} + {1} = ?", a, b);

            //store answer
            Session["Captcha" + prefix] = a + b;

            //image stream
            FileContentResult img = null;

            using (var mem = new MemoryStream())
            using (var bmp = new Bitmap(130, 30))
            using (var gfx = Graphics.FromImage((Image)bmp))
            {
                gfx.TextRenderingHint = TextRenderingHint.ClearTypeGridFit;
                gfx.SmoothingMode = SmoothingMode.AntiAlias;
                gfx.FillRectangle(Brushes.White, new Rectangle(0, 0, bmp.Width, bmp.Height));

                //add noise
                if (noisy)
                {
                    int i, r, x, y;
                    var pen = new Pen(Color.Yellow);
                    for (i = 1; i < 10; i++)
                    {
                        pen.Color = Color.FromArgb(
                        (rand.Next(0, 255)),
                        (rand.Next(0, 255)),
                        (rand.Next(0, 255)));

                        r = rand.Next(0, (130 / 3));
                        x = rand.Next(0, 130);
                        y = rand.Next(0, 30);

                        gfx.DrawEllipse(pen,x-r, y-r,r,r);
                    }
                }

                //add question
                gfx.DrawString(captcha, new Font("Tahoma", 15), Brushes.Gray, 2, 3);

                //render as Jpeg
                bmp.Save(mem, System.Drawing.Imaging.ImageFormat.Jpeg);
                img = this.File(mem.GetBuffer(), "image/Jpeg");
            }

            return img;

        }
        [HttpPost]
        public ActionResult Index(SubscribeModel model)
        {
            //validate captcha
            if (Session["Captcha"] == null || Session["Captcha"].ToString() != model.Captcha)
            {
                ModelState.AddModelError("Captcha", "Wrong value of sum, please try again.");
                //dispay error and generate a new captcha
                return View(model);
            }
            return View("ThankYouPage");
        }
        public ActionResult ThankYouPage()
        {
            return View();

        }



In View:

@model JQGridExample.Models.SubscribeModel

@{
    ViewBag.Title = "CaptchaImage";
}

<h2>CaptchaImage</h2>
@using(Html.BeginForm()){
    <table>
        <tr>
            <td> @Html.LabelFor(model => model.Captcha)
    <a href="@Url.Action("Index","Add")">
        <img alt="Captcha" src="@Url.Action("CaptchaImage")" style="" />
    </a> </td>
            <td> @Html.TextBoxFor(model => model.Captcha)
    @Html.ValidationMessageFor(model => model.Captcha) </td>
        </tr>
        <tr><td><input type="submit" value="submit" /></td</tr>

    </table>

}