Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Page 1 of 2 12 LastLast
Results 1 to 15 of 26
  1. #1
    Regular Coder
    Join Date
    Aug 2002
    Posts
    104
    Thanks
    0
    Thanked 0 Times in 0 Posts

    How to set Property of Form Fields

    Hello guys, I wasn't sure if this is the right place to post this question or not and if not then I am sorry.

    I need to create a form that has 2 radio buttons and 3 Fields.

    The radio buttons are “yes” and “no”.

    Well, when you first come to the page, the form order is

    Radio button 1: Yes
    Radio button 2: No

    FIELD 1 : which takes 15 (not more not less) numeric characters.
    FIELD 2 : which takes 20 (not more not less) numeric characters
    and the first 4 characters have to be “8931”.
    FIELD 3 : which takes 11 (not more not less) numeric characters.

    And then “Submit”, “Clear”, and “Cancel” buttons.

    So when you come the page, all three fields are grayed out. You can not put anything unless one of the radio button is marked.

    -- When you pick yes radio button, all three fields become alive and you can put the numbers in there.

    -- If you pick no, only first and second fields become alive and you can put the numbers in there.

    When you click the “Submit” button, it should check that all FIELDS contains only numeric values, first FIELD contains 15 characters (not more not less), second FIELD contains 20 characters (not more not less) and starts with "8931", and if third FIELD is available then check that it only contains 11 characters (not more not less).

    I know it’s quite a lot to ask but I am kind of a apprentice and don’t know how to get to the end. So I was hoping any of you can help me out. If there are any tutorials for this then please give a link to that too so I can use that for future reference and don’t have to keep on posting questions like this. And if someone already has this kind of a form done and is handy then please email it at athakkar@yahoo.com (I appreciate any help more than anything)

    Thank you so much in advance.

  • #2
    Senior Coder joh6nn's Avatar
    Join Date
    Jun 2002
    Location
    72° W. 48' 57" , 41° N. 32' 04"
    Posts
    1,887
    Thanks
    0
    Thanked 1 Time in 1 Post
    i'm going to suggest that instead of using two radio buttons for your "yes / no" option, you use a checkbox, which is specifically designed for yes or no situations.

    input boxes have a maxlength attribute, which you can set as a number of characters that can be entered. unfortunately, the only way to specify which kinds of characters can be entered, and what the minimum length is, is to use javascript.
    bluemood | devedge | devmo | MS Dev Library | WebMonkey | the Guide

    i am a loser geek, crazy with an evil streak,
    yes i do believe there is a violent thing inside of me.

  • #3
    Regular Coder
    Join Date
    Aug 2002
    Posts
    104
    Thanks
    0
    Thanked 0 Times in 0 Posts
    The reason why I need to use radio buttons is because I don't want the user to check both of them. I mean either they can click yes or no. And if I use check box then I guess there is no way to prevent them to choose only one.

    I did think that I was going to have to use javascript but when it comes to javascript the only thing I can do is manipulate it. I have such a hard time creating something on my own unless I have some guidence.

    Thanks for the reply joh6nn. And any help is welcome and greately appreciated.

  • #4
    Regular Coder
    Join Date
    Aug 2002
    Posts
    104
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I found this script on dynamicdrive that checks if all the fields are filled or not.
    http://www.dynamicdrive.com/dynamici...uiredcheck.htm

    and this script will allow me to limit the characters in the fields.
    http://www.dynamicdrive.com/dynamici...limitinput.htm

    However, there are still few parts that are missing and I still can't figure out how to finish this puzzle.

    Any help?

  • #5
    Senior Coder
    Join Date
    Jun 2002
    Location
    ColoRockyz
    Posts
    1,646
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Try being specific and post your code.
    Zoobie or not Zoobie...That is the problem.
    <body onUnload="flush( ! )">

  • #6
    Regular Coder
    Join Date
    Aug 2002
    Posts
    104
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Unhappy

    Sorry, but if you read the first post you'll know what my question is.
    And about posting the code, it's just a simple form right now with 2 radio buttons, 3 fields, and submit, clear, and cancel buttons.
    I don't know how to put the javascripts in there to make it work.
    Please Help!!

  • #7
    New Coder
    Join Date
    Aug 2002
    Location
    Pakistan
    Posts
    56
    Thanks
    0
    Thanked 0 Times in 0 Posts
    simple way to limit the content of a field:
    <input maxlength=15>

    for validating the fields you will have to use any javascript form validation
    To steal ideas from one person is plagiarism, to steal ideas from many is research.

  • #8
    Senior Coder
    Join Date
    Jun 2002
    Location
    41° 8' 52" N -95° 53' 31" W
    Posts
    3,660
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Code:
    <?xml version="1.0" encoding="utf-8"?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
        "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" >
    <head>
         <title>Validation Example</title>
    <script type="text/javascript">
    <!--
    function valform(f){
         var errormsg = "";
         var focusfield = "";
         if(!/^\d{15}$/.test(f.field1.value)){
              errormsg += "Please enter 15 numeric characters in Field 1.\n";
              if(focusfield == "") focusfield = "field1";
         }
         if(!/^8931\d{16}$/.test(f.field2.value)){
              errormsg += "Please enter 20 numeric characters in Field 2 starting with \"8931\".\n";
              if(focusfield == "") focusfield = "field2";
         }
         if(f.enablefield3.checked == true && !/^\d{11}$/.test(f.field3.value)){
              errormsg += "Please enter 11 numeric characters in Field 3.\n";
              if(focusfield == "") focusfield = "field3";
         }
         if(errormsg != ""){
              alert("Please correct the following errors:\n\n" + errormsg);
              eval("f." + focusfield + ".focus()");
              return false;
         }
         else{
              return true;
         }
    }
    // -->
    </script>
    </head>
    <body>
         <form id="exampleform" action="exampleform.htm" onsubmit="return valform(this)">
              <div>
                   <input type="checkbox" name="enablefield3" value="Yes" />Enable Field 3.<br />
                   <input type="text" name="field1" size="20" maxlength="15" value="" /> Field 1<br />
                   <input type="text" name="field2" size="20" maxlength="20" value="" /> Field 2<br />
                   <input type="text" name="field3" size="20" maxlength="11" value="" onblur="if(this.form.enablefield3.checked == false){this.value = this.defaultValue}" /> Field 3<br />
                   <input type="submit" value="Submit" />
                   <input type="reset" value="Reset" />
              </div>
         </form>
    </body>
    </html>
    I don't think any validation script could match the requirements you posted any more exactly (minus the unnecessary radio buttons).

    No use really disabling the third field (until people no longer use NS 4.X, since "disabled" doesn't work in that browser...), just delete anything they might put in there unless they agree to the checkbox... also, what is a "cancel" button supposed to do? Reset clears the form.

    I used a checkbox, since it is either checked or not (as suggested above), which satisfies the "yes/no" condition that two radio buttons would otherwise be required to achieve.

    P.S. That "/^8931\d{16}$/" mumbo-jumbo is called a "Regular Expression". Regular Expressions (otherwise known as "RegEx") are one of the most powerful (and simple) validation tools available, and any good programming language uses them, not just javascript. See this link for more info:

    http://www.siteexperts.com/tips/func...ts23/page1.asp

    Also, FYI, the best forum to post this in would have been the javascript programming forum.

    Hope this helps...

    If for some reason (which I would hope is not the case, since you were pretty clear in your explanation) this doesn't do what you're trying to do, please let me know.

    Last edited by whammy; 11-18-2002 at 02:30 AM.
    Former ASP Forum Moderator - I'm back!

    If you can teach yourself how to learn, you can learn anything. ;)

  • #9
    Regular Coder
    Join Date
    Aug 2002
    Posts
    104
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Hi whammy, how are you? First of all, I like to apologies for not replying sooner. I kinda got caught up with work. Second of all, I don't know how to thank you for taking time and helping me with this form. This is exactly how I wanted and you made it to work!!

    May be my ideas were little too extreme but your solution is much more logical and better. I really have not enough words to appreciate you taking time and doing this. If there is a way I could repay then please let me know. (At least then I won't feel guilty)

    I have done C++ and I have done something like this in VB too but I am new to javascript and totally ignorant to the methods of javascript so please excuse me for that.

    The link is very educational and just by taking a glance at it, I learned lots of stuff ie. the use of ^ $ \b and \B. And you are right, I should have posted my question in Javascript section but I wasn't sure.

    Once again, thank you very much and thanks a lot for helping.
    Last edited by WebPlaya; 11-18-2002 at 03:16 AM.

  • #10
    Senior Coder
    Join Date
    Jun 2002
    Location
    41° 8' 52" N -95° 53' 31" W
    Posts
    3,660
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Your thanks and very kind compliments are more than enough.

    You never know, I might need to learn some C++ stuff from you in the future.

    P.S. Let us know if you're looking for additional validation or any methods to acheive it. That is just one solution out of many.
    Last edited by whammy; 11-18-2002 at 03:24 AM.
    Former ASP Forum Moderator - I'm back!

    If you can teach yourself how to learn, you can learn anything. ;)

  • #11
    Regular Coder
    Join Date
    Aug 2002
    Posts
    104
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I don't think so... I am sure you can open the C++ book, knock it down in few hours and then you can beat me in that too!!

  • #12
    Senior Coder
    Join Date
    Jun 2002
    Location
    41° 8' 52" N -95° 53' 31" W
    Posts
    3,660
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Heh... well let's hope your prediction comes true, I am not learning C++ but I have to master .NET for my MCAD certification, and it does not look easy.
    Former ASP Forum Moderator - I'm back!

    If you can teach yourself how to learn, you can learn anything. ;)

  • #13
    Regular Coder
    Join Date
    Aug 2002
    Posts
    104
    Thanks
    0
    Thanked 0 Times in 0 Posts
    By the way, I am trying to combine these two scripts. I mean the solution you gave me and then I got this script from DynamicDrive which is for to disable the submit button once you hit it. and this is how the form tag looks like, please correct me if I am wrong.

    <form id="exampleform" action="exampleform.htm" onsubmit="return valform(this)"; "submitonce(this)" >

    where "submitonce(this)" function is in the head section which looks like

    <script>

    function submitonce(theform){
    //if IE 4+ or NS 6+
    if (document.all||document.getElementById){
    //screen thru every element in the form, and hunt down "submit" and "reset"
    for (i=0;i<theform.length;i++){
    var tempobj=theform.elements[i]
    if(tempobj.type.toLowerCase()=="submit"||tempobj.type.toLowerCase()=="reset")
    //disable em
    tempobj.disabled=true
    }
    }
    }
    </script>

    (I only pasted the function and not the comments in my reply becasue i didn't want to take any space, however the comments are still there in the code)

  • #14
    Regular Coder
    Join Date
    Aug 2002
    Posts
    104
    Thanks
    0
    Thanked 0 Times in 0 Posts
    ...
    Last edited by WebPlaya; 11-18-2002 at 03:39 AM.

  • #15
    Senior Coder
    Join Date
    Jun 2002
    Location
    41° 8' 52" N -95° 53' 31" W
    Posts
    3,660
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Hmm, what are you trying to accomplish with the provided code?

    If you want to disable the submit button once you hit it, I don't understand what you are trying to accomplish, since the validation I provided shouldn't let the form be submitted unless it meets your requirements.

    P.S. I don't use AIM, but I use Yahoo or MSN messenger...
    Last edited by whammy; 11-18-2002 at 03:33 AM.
    Former ASP Forum Moderator - I'm back!

    If you can teach yourself how to learn, you can learn anything. ;)


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

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