Results 1 to 8 of 8

Thread: show/hide div layer on form submit?

  1. #1
    Join Date
    Jul 2005
    Location
    UK
    Posts
    159
    Thanks
    15
    Thanked 0 Times in 0 Posts

    Lightbulb show/hide div layer on form submit?

    I've made a simple mailing list form nested in a div layer floating in the corner of the screen. its basically just a text field and submit button. is it possible to hide the div layer that the form is in, when the user clicks submit?

    I'm imagining this would be a javascript question, but if not, can someone point me in the right direction?

  2. #2
    Join Date
    Jan 2007
    Posts
    629
    Thanks
    10
    Thanked 28 Times in 28 Posts

    Default

    That would depend entirely on the type of action the form envokes. Is it an action form, or a submitted form? For an action form (i.e. the user types hello in a box and clicks the action button and an alert then says "hello"), you can use
    Code:
    //in the head section
    function hideit(){
    document.getElementById('DIVtoHIDE').style.display = 'none';
    }
    //in the button
    onsubmit="hideit()"
    //or
    onclick="hideit()"
    But if the form is submitted (i.e. the page changes) you will need to use a cookie or something similar to find out if the form was submitted and thus hide it. Try looking at this. (You can also do this, perhaps in a better way-- without cookies-- with a server-side language like PHP.)
    Last edited by Jas; 02-14-2008 at 06:49 PM.
    --Jas
    function GreatMinds(){ return "Think Like Jas"; }
    I'm gone for a while, but in the meantime: Try using my FTP script | Fight Bot Form Submissions

  3. #3
    Join Date
    Jul 2005
    Location
    UK
    Posts
    159
    Thanks
    15
    Thanked 0 Times in 0 Posts

    Default

    Thanks for your reply, but I'm afraid I did not understand your instructions. To answer your question, here is what my form looks like, and I'd like to make it so that when it posts it doesn't redirect the user, but instead simply hides the div layer the form is in.

    Code:
    <!-- newsletter subscribe below here -->
    
    <script language="Javascript" type="text/javascript">
    var fieldstocheck = new Array();
    fieldnames = new Array();
    function checkform() {
    for (i=0;i<fieldstocheck.length;i++) {
    if (eval("document.subscribeform.elements['"+fieldstocheck[i]+"'].value") == "") {
    alert("Please enter your "+fieldnames[i]);
    eval("document.subscribeform.elements['"+fieldstocheck[i]+"'].focus()");
    return false;
    }
    }
    return true;
    }
    function addFieldToCheck(value,name) {
    fieldstocheck[fieldstocheck.length] = value;
    fieldnames[fieldnames.length] = name;
    }
    </script>
    
    <form method="post" action="http://www.yourdomain.com/lists/?p=subscribe&id=1" name="subscribeform">
    Email:<input type="text" name="email" value = ""><br>
    <script language="Javascript" type="text/javascript">addFieldToCheck("email","Email Address");</script>
    Name: <input type="text" name="attribute2" value = "">
    <script language="Javascript" type="text/javascript">addFieldToCheck("attribute2","Name");</script>
    <input type="hidden" name="list[1]" value="signup" />
    <input type="submit" name="subscribe" value="Subscribe" onClick="return checkform();">
    </form>
    
    <!-- newsletter subscribe ends here -->

  4. #4
    Join Date
    Jan 2007
    Posts
    629
    Thanks
    10
    Thanked 28 Times in 28 Posts

    Default

    Well, the type of form you have connot do that unless you use something like AJAX, I think, that can communicate with the server in realtime. I'm sorry, but I don't know that programming language. You might try learning about the language here, though.
    --Jas
    function GreatMinds(){ return "Think Like Jas"; }
    I'm gone for a while, but in the meantime: Try using my FTP script | Fight Bot Form Submissions

  5. #5
    Join Date
    Feb 2008
    Location
    Cebu City Philippines
    Posts
    1,160
    Thanks
    17
    Thanked 277 Times in 275 Posts

    Default

    Hi moscarda,
    If i'm taking this right, you want the div be hidden when the submit is pressed?
    If so, add this script in the head:
    Code:
    <script type="text/javascript">
    function hide(){
    document.getElementById('idOfTheDivYouWantToHide').style.display='none';
    }
    </script>
    Then on your page, you could enable the code during onSubmit or onClick of the submit button, see if it helps
    Learn how to code at 02geek

    The more you learn, the more you'll realize there's much more to learn
    Ray.ph!

  6. #6
    Join Date
    Jul 2005
    Location
    UK
    Posts
    159
    Thanks
    15
    Thanked 0 Times in 0 Posts

    Default

    youre right, that didn't work. i'll look into the AJAX thing. thanks

  7. #7
    Join Date
    Feb 2008
    Location
    Cebu City Philippines
    Posts
    1,160
    Thanks
    17
    Thanked 277 Times in 275 Posts

    Default

    It did'nt work??...

    Okay, if you're going to ajax then...GOOD LUCK!!..
    Learn how to code at 02geek

    The more you learn, the more you'll realize there's much more to learn
    Ray.ph!

  8. #8
    Join Date
    Jul 2005
    Location
    UK
    Posts
    159
    Thanks
    15
    Thanked 0 Times in 0 Posts

    Default

    you seem surprised, if you know a way of getting it to work, and/or can provide some test code, please do so! i dont know anything about ajax, nor do i imagine i will be able to learn it in time for my deadline.

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
  •