Sunday, June 3, 2012

combine form validation and way2sms class

        In this post I'm going to combine way2sms API with simple form validation. so it makes easy to send sms with nice look. 

Screenshots
sendSms.php
<?php

    session_start();

    if(isset($_POST['userName']) && isset($_POST['passWord']))

    {

        require_once('classSms.php');

        $_SESSION['userName']=$_POST['userName'];

        $_SESSION['passWord']=$_POST['passWord'];

        $smsObj=new way2sms($_POST['userName'],$_POST['passWord']);

        $result=$smsObj->sendSMSToMany($_POST['mobileNumber'],$_POST['msg']);

    }
?>
<html>

<head>

    <title>Consultation Form</title>

    <link rel="stylesheet" type="text/css" href="style.css"/>

    <link href="images/c12.ico" rel="shortcut icon" type="image/x-icon" />

    <script type="text/javascript" language="javascript">

    var regx_number=/^[0-9]{10}$/;

        window.onload = function()

        {

         //onload delegating event

            var inputTag=document.getElementsByTagName("input"),

                form=document.getElementById("getDetails");

            form.onsubmit=validate;

            document.getElementById("msg").onfocus=clearInfo;

            document.getElementById("msg").onblur=showInfo;

            for(var i=0;i<inputTag.length;i++)

            {

                inputTag[i].onfocus=clearInfo;

                inputTag[i].onblur=showInfo;

            }

        

        }

        function showInfo()

        {

            var info=document.getElementById("info");

            info.innerHTML="";

            switch(this.name)

            {

                case "userName":

                    if(!validNumber(this.value)) this.value="Your Mobile Number";

                    break;

                case "passWord":

                    if((this.value)=="") this.value="your password";

                    break;

                case "mobileNumber":

                    if((this.value)=="") this.value="Mobile Numbers";

                    break;

                case "msg":

                    if(this.value =="" ) this.value="Content Here";

                    break;

                default:

                    break;

            }

        }

        function clearInfo()

        {

            var info=document.getElementById("info");

            switch(this.value)

            {

                case "Your Mobile Number":

                    this.value="";

                    info.innerHTML="Enter your way2sms user name(mobile number).";

                    break;

                case "your password":

                    info.innerHTML="Enter your passWord.";

                    this.value="";

                    break;

                case "Mobile Numbers":

                    info.innerHTML="Enter recipient mobile numbers.<br>It should be seperated by comma(,).";

                    this.value="";

                    break;

                case "Content Here":

                    info.innerHTML="Enter message to send.";

                    this.value="";

                    break;

                default:

                    break;

            }

        }

        function validate()

        { 

            var uName=document.getElementById("userName").value,

                pass=document.getElementById("passWord").value,

                mnumber=document.getElementById("mobileNumber").value,

                msg=document.getElementById("msg").value;

            if(validNumber(uName) && (pass != "") && (mnumber != "") )

                return true;

            return false;

        }

        function validNumber(number)

        {

            return regx_number.test(number);

        }

    </script>

</head>

<body>

    <div id="container">

    <div style="margin-left: 80px;"><img alt="" src="images/fill_your_details.png"></div>

        <div id="info"><?php echo @implode("<br/>",$result); ?></div>

        <form name="getDetails" id="getDetails" method="POST" action="<?php echo $_SERVER['PHP_SELF'];?>">

            <input type="text" name="userName" id="userName" value="<?php if(isset($_SESSION['userName'])) echo $_SESSION['userName']; else { echo "Your Mobile Number"; } ?>"/>

            <input type="password" name="passWord" id="passWord" value="<?php if(isset($_SESSION['passWord'])) echo $_SESSION['passWord']; else { echo "your password"; } ?>"/>

            <input type="text" name="mobileNumber" id="mobileNumber" value="Mobile Numbers"/>

            <textarea name="msg" id="msg">Content Here</textarea>

            <button>send via way2sms</button>

        </form>

    </div>

</body>

</html>
click here for demo.
click here for classSms.php.
click here for simple effective form validation. 
 

No comments:

Post a Comment