Page 1 of 2 12 LastLast
Results 1 to 10 of 13

Thread: form - show a specific thing if another specific thing is entered

  1. #1
    Join Date
    Oct 2010
    Posts
    11
    Thanks
    5
    Thanked 0 Times in 0 Posts

    Default form - show a specific thing if another specific thing is entered

    I have a form script that validates for "value must be one of". If someone enters potatoes in the field, and if potatoes is one of the acceptable values, the form goes through. That's all the form does.

    I need the form to produce a different result for each matching entry. For instance, potatoes and tomatoes are acceptable options. If someone enters potatoes, I need the result to be a popup window that says potatos are brown. If they enter tomatoes, the result should say tomatoes are red. How do I create different resulting text based on their acceptable entry?

    Thank you so much in advance.

  2. #2
    Join Date
    Oct 2010
    Posts
    11
    Thanks
    5
    Thanked 0 Times in 0 Posts

    Default

    Here is the form I want to use:


    <!-- The following code is revised from SmartClient demo code(SmartClient_70rc2_LGPL.zip).-->


    <HTML><HEAD>
    <SCRIPT>var isomorphicDir="isomorphic/";</SCRIPT>
    <SCRIPT SRC=isomorphic/system/modules/ISC_Core.js></SCRIPT>
    <SCRIPT SRC=isomorphic/system/modules/ISC_Foundation.js></SCRIPT>
    <SCRIPT SRC=isomorphic/system/modules/ISC_Containers.js></SCRIPT>
    <SCRIPT SRC=isomorphic/system/modules/ISC_Grids.js></SCRIPT>
    <SCRIPT SRC=isomorphic/system/modules/ISC_Forms.js></SCRIPT>
    <SCRIPT SRC=isomorphic/system/modules/ISC_DataBinding.js></SCRIPT>
    <SCRIPT SRC=isomorphic/skins/SmartClient/load_skin.js></SCRIPT>
    </HEAD><BODY>
    <SCRIPT>

    var formItems = [
    {
    name:"isOneOf",
    title:"isOneOf ['a','b','c']",
    validators:[
    {
    type:"isOneOf",
    errorMessage:"Value must be one of ['a','b','c'].",
    list:['a','b','c']
    }
    ]
    },

    {
    type:"rowSpacer"},
    // Submit button for form - will perform automatic client side validation before submission
    // Note: we would have to set canSubmit to true on the DymamicForm to allow form submission.
    // {title:"Submit Form", type:"submit", align:"center"}
    // Button to call validation demonstration function
    {title:"Validate Form", type:"button", click:"validateForm()", align:"center"}
    ],


    formValues = {
    isOneOf:"x",
    };

    DynamicForm.create({
    ID:"simpleForm",
    left:20,
    top:40,
    items:formItems,
    values:formValues,
    width:600,
    titleWidth:200
    });


    // A function to demonstrate form validation, and alert on success
    // Note: Validation is performed automatically on form submission -
    // no explicit call to the form.validate() function usually required.
    function validateForm(){
    if(simpleForm.validate()){
    alert ("Form validation was successful!");
    simpleForm.redraw();
    };
    };

    </SCRIPT>
    </BODY>
    </HTML>

  3. #3
    Join Date
    Oct 2010
    Posts
    11
    Thanks
    5
    Thanked 0 Times in 0 Posts

    Default

    Actually what is the simplest way to do this? I would rather just go through formmail. I have had forms through them before that did similar things but I don't remember what would do this. I need something that validates for "value must be one of" and then produces a different result for each valid value.

  4. #4
    Join Date
    May 2007
    Location
    Boston,ma
    Posts
    2,127
    Thanks
    173
    Thanked 207 Times in 205 Posts

    Default

    Are you looking for this to occur on the page the user is on? Do you have access to a server side script? Are the acceptable values coming from a database or any of the data?
    Corrections to my coding/thoughts welcome.

  5. The Following User Says Thank You to bluewalrus For This Useful Post:

    asdfqwerty (10-15-2010)

  6. #5
    Join Date
    Oct 2010
    Posts
    11
    Thanks
    5
    Thanked 0 Times in 0 Posts

    Default

    Thanks for you response. I think the script I posted at the beginning of this thread is too complicated for me. I made a totally different script to do the same thing. It is much shorter and more simple. It works except that it shows the wrong answers. Do you know why it is showing the answer for b when it should show the answer for a? Or why it shows the answer for a when anything else is entered?


    <script type="text/javascript">
    function lookupitem(){
    var itemField = document.getElementById('item');
    if (itemField.value != "a")
    {
    document.write("goes with a");
    }
    else if (itemField.value != "b")
    {
    document.write("goes with b");
    }
    else if (itemField.value != "")
    {
    document.write("Please enter some text.");
    }
    else
    {
    document.write("Item not found");
    }}
    </script>
    <input type='text' id='item' />
    <input type='button' onclick='lookupitem()' value='Look It Up' />

  7. #6
    Join Date
    May 2007
    Location
    Boston,ma
    Posts
    2,127
    Thanks
    173
    Thanked 207 Times in 205 Posts

    Default

    The != means not equal to you want to use == or ===.

    Code:
    <script type="text/javascript">
    function lookupitem(){
    	var itemField = document.getElementById('item');
    	if (itemField.value == "a") {
    		document.write("goes with a");
    	} else if (itemField.value == "b") {
    		document.write("goes with b");
    	} else if (itemField.value == "") {
    		document.write("Please enter some text.");
    	} else {
    		document.write("Item not found");
    	}
    }
    </script>
    Corrections to my coding/thoughts welcome.

  8. The Following User Says Thank You to bluewalrus For This Useful Post:

    asdfqwerty (10-15-2010)

  9. #7
    Join Date
    Oct 2010
    Posts
    11
    Thanks
    5
    Thanked 0 Times in 0 Posts

    Default

    Thanks!! I have combined that script with another script. It works unless I change these parts

    document.write("goes with a");

    to these

    document.getElementById("a");

    even though I have the id's set up. How can I fix this?


    <script type="text/javascript">
    function youentered(){
    var item = document.getElementById('item').value;
    document.getElementById('entereditem').innerHTML = item;
    document.getElementById('explanation').innerHTML = 'Your search entry: ';
    }
    function itemresults(){
    var itemField = document.getElementById('item');
    if (itemField.value == "a") {
    document.getElementById("a");
    } else if (itemField.value == "b") {
    document.getElementById("b");
    } else if (itemField.value == "") {
    document.getElementById("c");
    } else {
    document.getElementById("d");
    }
    }


    </script>
    <table id='a' bgcolor="ccffff">
    <tr><td>goes with a</td></tr>
    </table>
    <table id='b' bgcolor="ccffff">
    <tr><td>goes with b</td></tr></table>
    <table id='c' bgcolor="ccffff">
    <tr><td>Please enter some text.</td></tr></table>
    <table id='d' bgcolor="ccffff">
    <tr><td>Item not found.</td></tr></table>
    <p>Enter something<p />
    <p><i id='explanation'>Your search entry: </i><b id='entereditem'>none</b></p>
    <input type='text' id='item' onkeyup='youentered()' />
    <input type='button' onclick='itemresults()' value='Look It Up'/>

  10. #8
    Join Date
    May 2007
    Location
    Boston,ma
    Posts
    2,127
    Thanks
    173
    Thanked 207 Times in 205 Posts

    Default

    I think this should work...

    Code:
    <script type="text/javascript">
    function youentered(){
    var item = document.getElementById('item').value;
    document.getElementById('entereditem').innerHTML = item;
    document.getElementById('explanation').innerHTML = 'Your search entry: ';
    }
    function itemresults(){
    var itemField = document.getElementById('item');
    if (itemField.value == "a") {
    document.getElementById("show").innerHTML = "goes with a";
    } else if (itemField.value == "b") {
    document.getElementById("show").innerHTML = "goes with b";
    } else if (itemField.value == "") {
    document.getElementById("show").innerhtml = "goes with c";
    } else {
    document.getElementById("show").innerhtml = "<p>Enter something<p />\n<p><i id='explanation'>Your search entry:</i>\n<b id='entereditem'>none</b>\n</p> ";
    youentered();
    }
    }
    </script>
    <table bgcolor="ccffff">
    <tr>
    <td id="show"></td>
    </tr>
    </table>
    <input type='text' id='item' onkeyup='youentered()' />
    <input type='button' onclick='itemresults()' value='Look It Up'/>
    Last edited by bluewalrus; 10-13-2010 at 04:30 PM. Reason: Typos, coded it a weird way switched a bit
    Corrections to my coding/thoughts welcome.

  11. The Following User Says Thank You to bluewalrus For This Useful Post:

    asdfqwerty (10-15-2010)

  12. #9
    Join Date
    Oct 2010
    Posts
    11
    Thanks
    5
    Thanked 0 Times in 0 Posts

    Default

    That is working! I would rather do it with Div's if that is possible. Instead of "goes with a" it would show the content of div 1, div 2, and div 3. "goes with b" could show the content of div 4 and div 5. I have looked all over online. Is that even possible? And if it isn't thanks for your help anyway because it looks great!

  13. #10
    Join Date
    May 2007
    Location
    Boston,ma
    Posts
    2,127
    Thanks
    173
    Thanked 207 Times in 205 Posts

    Default

    Umm not sure what you mean, so you don't want the table and you want 4 divs? Create the html for the page you want and a description of the functional you want and I'll attempt to create it the functional via javascript.
    Last edited by bluewalrus; 10-14-2010 at 03:47 AM. Reason: a little bit clearer
    Corrections to my coding/thoughts welcome.

  14. The Following User Says Thank You to bluewalrus For This Useful Post:

    asdfqwerty (10-15-2010)

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
  •