You must Sign In to post a response.
  • Category: HTML

    How to handling onsubmit event in submit button like this?

    Friends,

    I am designing my web site in html with javascript. i have two submit button in my web page. if user click submit button 1 want to check validation script and action, its work well my problem is when user click submit button 2 want to show the details only not to check validation script but it checked validation script also. how to handling onsubmit event in submit button like this?


    This is my html code

    <html>
    <title>Construction Management System</title>
    <head>
    <link rel="stylesheet" type="text/css" href="CSS_CMS.css">
    <script type="text/javascript">
    function OnSubmitForm()
    {
    if(document.pressed == 'Save')
    {
    document.myForm.action ="Customer_Master_DB.php";
    }
    else
    if(document.pressed == 'View')
    {
    document.myForm.action ="View.php";
    }
    // Trigger the validations
    return true;
    }
    </script>

    <script type="text/javascript" src="validation.js"></script>

    </head>
    <body>
    <!--<form id="myForm" name="myForm" method="post" action="" onsubmit="return OnSubmitForm();">-->
    <form id="myForm" name="myForm" onsubmit="return validateFormOnSubmit(this)" method="post" >
    <div class="wrapper">
    <div class="banner">
    <img class="logo" src="1.jpg"/>
    </div>

    <div id='cssmenu'>
    <ul>
    <li class='active'><a href='index.html'><span>Home</span></a></li>
    <li class='has-sub'><a href='#'><span>Master</span></a>
    <ul>
    <li><a href='#'><span>Customer Master</span></a></li>
    <li><a href='#'><span>Supplier Master</span></a></li>
    <li><a href='#'><span>Site Master</span></a></li>
    <li><a href='#'><span>Material Master</span></a></li>
    <li class='last'><a href='#'><span>Calculation Master</span></a></li>
    </ul>
    </li>
    <li ><a href='#'><span>Transactions</span></a>
    <ul>
    <li><a href='#'><span>Estimation</span></a></li>
    <li><a href='#'><span>Log Book</span></a></li>
    <li><a href='#'><span>Inward Material</span></a></li>
    <li><a href='#'><span>Make Payment</span></a></li>
    <li class='last'><a href='#'><span>Outward Material</span></a></li>
    </ul>
    </li>
    <li class='has-sub'><a href='#'><span>Utility</span></a>
    <ul>
    <li><a href='#'><span>Backup Location Assign</span></a></li>
    <li><a href='#'><span>Backup</span></a></li>
    <li><a href='#'><span>New User Account Create</span></a></li>
    <li><a href='#'><span>Password Change</span></a></li>
    <li><a href='#'><span>Password Reset</span></a></li>
    <li class='last'><a href='#'><span>User Rights <span></a></li>
    </ul>
    </li>

    <li class='has-sub'><a href='#'><span>Reports</span></a>
    <ul>
    <li><a href='#'><span>Estimation Report</span></a></li>
    <li><a href='#'><span>Log Book Report</span></a></li>
    <li><a href='#'><span>Inward Material Report</span></a></li>
    <li><a href='#'><span>Payment Report</span></a></li>
    <li class='last'><a href='#'><span>Outward Material</span></a></li>
    </ul>
    </li>
    <li class='last'><a href='#'><span>Logout</span></a>
    </ul>
    </div>

    <!--<div class="contents">
    <div class="heading">
    <div class="col">Category ID</div>
    <div class="col">Category </div>
    </div>
    <div class="table-row">
    <div class="col">1</div>
    <div class="col">PHP</div>
    </div>
    <div class="table-row">
    <div class="col">2</div>
    <div class="col">WordPress</div>
    </div>
    <div class="table-row">
    <div class="col">3</div>
    <div class="col">Dot Net</div>
    </div>
    <div class="table-row">
    <div class="col">4</div>
    <div class="col">ASP</div>
    </div>
    </div>-->

    <br>


    <div>
    <fieldset>
    <legend>Add Customer</legend>
    <table id="customers">

    <tr>
    <td>
    <div class="label"><label>Customer Name</label></div>
    </td>
    <td>
    <div><input class="input" type="text" name="cname" autofocus/></div>
    </td>
    </tr>

    <tr>
    <td>
    <div class="label"><label>Customer Address</label></div>
    </td>
    <td>
    <div><textarea class="textarea" cols="25" rows="4" name="caddress"></textarea></div>
    </td>
    </tr>

    <tr>
    <td>
    <div class="label"><label>Area</label></div>
    </td>
    <td>
    <div><input class="input" type="text" name="carea"/></div>
    </td>
    </tr>

    <tr>
    <td>
    <div class="label"><label>City</label></div>
    </td>
    <td>
    <div><input class="input" type="text" name="ccity"/></div>
    </td>
    </tr>

    <tr>
    <td>
    <div class="label"><label>Contact No 1</label></div>
    </td>
    <td>
    <div><input class="input" type="text" name="ccn1" /></div>
    </td>
    </tr>

    <tr>
    <td>
    <div class="label"><label>Contact No 2</label></div>
    </td>
    <td>
    <div><input class="input" type="text" name="ccn2"/></div>
    </td>
    </tr>

    <tr>
    <td>
    <div class="label"><label>Email</label></div>
    </td>
    <td>
    <div><input class="input" type="text" name="cmail"/></div>
    </td>
    </tr>
    </table>

    <br>

    <table id="customers">
    <tr>
    <td>

    <input type="submit" name="Save" value="Save" id="submit" onclick="myForm.action='Customer_Master_DB.php'"/>
    <input type="submit" name="View" value="View" id="submit" onclick="myForm.action='View.php'"/>

    <!--<input type="submit" name="Save" value="Save" id="submit" onclick="document.pressed=this.value"/>
    <input type="submit" name="View" value="View" id="submit" onclick="document.pressed=this.value"/>

    <input type="submit" name="Save" value="Save" id="submit" onClick="window.location.href='Customer_Master_DB.php'" />
    <input type="submit" name="View" value="View" id="submit" onClick="window.location.href='View.php'" />

    <input type="button" name="Submit" value="Save" onclick="document.myForm.action = 'Customer_Master_DB.php'; document.myForm.submit();">
    <input type="button" name="Submit" value="Submit" onclick="document.myForm.action = 'View.php'; document.myForm.submit();" >-->
    </td>
    </tr>
    </table>
    </fieldset>
    </div>

    <?php
    //include("View.php");
    ?>

    <div id="footer">
    <div class="copyright">
    Copyright © 2014 Dvaita Software Solutions [P] Ltd. All rights reserved.
    </div>
    </div>
    </div>
    </form>
    </body>
    </html>
  • #748210
    Hi,
    In HTML you have a property called formnovalidate. You have to use this property for the button which you don't want to validate the form.

    Check below code,

    <button type="submit" formnovalidate>View the form Data without validation</button>


    Regards,
    Asheej T K

  • #748215
    Hey,

    In your earlier post also, i suggested one way to achieve it like below. Let me know if you want a code/any other resource for this-

    For the validation upon button click, check like the below-

    function fncheck()
    {
    var pgng = document.getElementById("<%=textboxid.ClientID%>").value.trim();
    if(pgnd == "")
    {
    alert('The textbox should not be empty...');
    document.getElementById("<%=txtfname.ClientID%>").focus();
    return false;
    }
    }
    Use whatever validation you want in the function.

    And to view the data upon button click-

    Use sessions to view the data, because it will not be beneficial to save this data. Session will be the good options. Let me know if you need code for this.

    Thanks,
    Ashutosh Jha
    http://tricksroad.com


  • Sign In to post your comments