SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Member
    Join Date
    Jun 2012
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Form Conditions

    Hi i have a standard HTML form on an asp page and i need to have my submit button be disabled but visible, but when the required fields on the form have been filled in i want the button to change image and become active. This needs to happen without the user having to press anything.

    Any ideas and examples would be appreciated, im also open to any programming methods which are compatable with asp.

    Thank you.

  2. #2
    SitePoint Guru
    Join Date
    Jun 2007
    Posts
    690
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    This isn't an ASP issue. You can do this type of control through javascript. You may want to move this post to a javascript forum.

  3. #3
    SitePoint Member
    Join Date
    Jun 2012
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    form conditions not working

    I'm using the code below to check through my form to see when the user has entered data into all of my required fields, then this makes the submit button active. This works as such apart from a user can enter text into the email field and the submit button becomes active, without any of the other required fields being filled in. If i take the value out of the email field and enter values into the other required fields nothing happens unless i enter something into the email field.

    Please take a look at the code below,


    <script type="text/javascript">
    function variableCheck() {
    document.getElementById("myButton").disabled=true;
    }
    function getElements(event) {
    var x=document.forms["form1"]["fname"].value;
    if (x==null || x=="")
    {
    }
    var x=document.forms["form1"]["sname"].value;
    if (x==null || x=="")
    {
    }
    var x=document.forms["form1"]["pharmacy"].value;
    if (x==null || x=="")
    {
    }
    var x=document.forms["form1"]["add1"].value;
    if (x==null || x=="")
    {
    }
    var x=document.forms["form1"]["city"].value;
    if (x==null || x=="")
    {
    }
    var x=document.forms["form1"]["county"].value;
    if (x==null || x=="")
    {
    }
    var x=document.forms["form1"]["pcode"].value;
    if (x==null || x=="")
    {
    }
    var x=document.forms["form1"]["telephone"].value;
    if (x==null || x=="")
    {
    }
    var x=document.forms["form1"]["member"].value;
    if (x==null || x=="")
    {
    }
    var x=document.forms["form1"]["emailx"].value;
    if (x==null || x=="")
    {

    document.getElementById("myButton").disabled=true
    document.getElementById("myButton").src="images/submit_non_active.gif";
    } else {
    document.getElementById("myButton").disabled=false
    document.getElementById("myButton").src="images/submit_active.gif";
    }
    }
    </script>

  4. #4
    SitePoint Member
    Join Date
    Jun 2012
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I now have an idea of what the problem is, basically the script is just looking at the last form field which i have coded in the function. i need this to check all of the form fields.

  5. #5
    SitePoint Wizard bronze trophy chris.upjohn's Avatar
    Join Date
    Apr 2010
    Location
    Melbourne, AU
    Posts
    2,191
    Mentioned
    17 Post(s)
    Tagged
    1 Thread(s)
    See the following code, i have simplified it as your current code is very redundant.

    Code JavaScript:
    // Assign the fields we want to validate in the following array
    var form   = document.forms['form1'],
        button = document.getElementById('myButton'),
        check  = ['fname', 'sname', 'pharmacy', 'add1', 'city', 'country', 'pcode', 'telephone', 'member', 'emailx'],
        errors = 0;
     
    function getElements() {
        for (var i = 0; i < check.length; i++) {
            // Check if the field has a valid value
            var value = form[check[i]].value;
     
            if (value === null || value === '' || !value.length) {
                errors++;
            }
        }
     
        button.disabled = (errors > 0) ? true : false;
        button.src      = 'images/' + (errors > 0) ? 'submit_non_active.gif' : 'submit_active.gif';
     
        // Reset the errors counter
        errors = 0;
    }

  6. #6
    SitePoint Member
    Join Date
    Jun 2012
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks for much cleaner code.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •