SitePoint Sponsor

User Tag List

Results 1 to 12 of 12
  1. #1
    SitePoint Member
    Join Date
    Feb 2011
    Posts
    7
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Simple Form Problem...

    Im trying to make a simple form .. where you can type a URL into the input box and when you click the button. It will take you to the URL that you typed.

    Code:
    <input type="text" maxlength="100" size="58" name="forum_url">
    
    <input type="button" value="Forums" style="width : 170px; margin: 3px" onClick="location.href='this.document.links.forum_url.value'";
    this doesn't work.... what do i do?

  2. #2
    SitePoint Wizard bronze trophy chris.upjohn's Avatar
    Join Date
    Apr 2010
    Location
    Melbourne, AU
    Posts
    2,189
    Mentioned
    17 Post(s)
    Tagged
    1 Thread(s)
    Your code has both invalid HTML and javascript, the below will work

    HTML Code:
    <form action="" method="get" id="links">
        <input type="text" maxlength="100" size="58" name="forum_url" />
        <input type="button" value="Forums" style="width : 170px; margin: 3px" onclick="window.location=document.forms.links.forum_url.value; return false;" />
    </form>

  3. #3
    SitePoint Member
    Join Date
    Feb 2011
    Posts
    7
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks alot!

  4. #4
    SitePoint Member
    Join Date
    Feb 2011
    Posts
    7
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It works fine except.....

    Lets say you type in... www.google.com

    but my domain is www.domain.com/mydomain


    it automatically makes the URL www.domain.com/mydomainwww.google.com


    how can i fix this?

  5. #5
    SitePoint Member
    Join Date
    Feb 2011
    Posts
    7
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    nevermind.... it works fine as long as you put 'HTTP://' first.... Thanks again!

  6. #6
    SitePoint Wizard bronze trophy chris.upjohn's Avatar
    Join Date
    Apr 2010
    Location
    Melbourne, AU
    Posts
    2,189
    Mentioned
    17 Post(s)
    Tagged
    1 Thread(s)
    Its actually pretty simple to check for http etc, simply use the code below and it will work fine.

    HTML Code:
    <form action="" method="get" id="links">
        <input type="text" maxlength="100" size="58" name="forum_url" />
        <input type="button" value="Forums" style="width : 170px; margin: 3px" onclick="gotoURL()" />
    </form>
    
    <script>
    function gotoURL() {
        // Get the URL
        var url = document.forms.links.forum_url.value;
        
        // Make sure the URL has a length
        if (!url.length) {
            alert('Please enter a valid URL');
            return false;
        }
        
        // Check if it has "http://" in the value
        var regex = /^(http|ftp|https|ftps)/i;
        
        if (!regex.test(url)) {
            url = 'http://' + url;
        }
        
        window.location = url;
        return false;
    }
    </script>

  7. #7
    SitePoint Member
    Join Date
    Feb 2011
    Posts
    7
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    0.o

    This is Awesome man! thanks for your help, i was looking for a way to fix that.

  8. #8
    SitePoint Wizard bronze trophy chris.upjohn's Avatar
    Join Date
    Apr 2010
    Location
    Melbourne, AU
    Posts
    2,189
    Mentioned
    17 Post(s)
    Tagged
    1 Thread(s)
    No problem, the regex could even be shortened to

    Code JavaScript:
    var regex = /^(http(s)?|ftp(s)?)/i;

  9. #9
    SitePoint Member
    Join Date
    Feb 2011
    Posts
    7
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I have 2 more problems....

    how can i make the link open in another Frame on the page? target="framename" ?


    I'm also trying to figure out a way for the form values to "remember me"... I know this can be done through cookies but all the methods I have tried so far have been faliures.

  10. #10
    SitePoint Wizard bronze trophy chris.upjohn's Avatar
    Join Date
    Apr 2010
    Location
    Melbourne, AU
    Posts
    2,189
    Mentioned
    17 Post(s)
    Tagged
    1 Thread(s)
    Below is the code that will allow you to open the link in an iframe

    HTML Code:
    <form action="" method="get" id="links">
        <input type="text" maxlength="100" size="58" name="forum_url" />
        <input type="button" value="Forums" style="width : 170px; margin: 3px" onclick="gotoURL()" />
    </form>
    
    <script>
    function gotoURL() {
        // Get the URL
        var url = document.forms.links.forum_url.value;
        
        // Make sure the URL has a length
        if (!url.length) {
            alert('Please enter a valid URL');
            return false;
        }
        
        // Check if it has "http://" in the value
        var regex = /^(http(s)?|ftp(s)?)/i;
        
        if (!regex.test(url)) {
            url = 'http://' + url;
        }
        
        // Create a new iframe
        createIframe('urlFromForm', url);
        return false;
    }
    
    function createIframe(iframe, url) {
        // Check if any iframe elements exists on the page
        //
        // If one exists that has the exact same name then skip the
        // DOM build process
        var iframes = document.getElementsByTagName('iframe'), ele = false, exists = false;
        
        if (iframes.length) {
            for(var i = 0; i < iframes.length; i++) {
                if (iframes[i].name == iframe) {
                    exists = true, ele = iframes[i];
                    break;
                }
            }
        }
        
        if (!exists) {
            // Create the new iframe element
            ele = document.createElement('iframe');
            
            // Set the iframe attributes
            ele.name = iframe;
            ele.width = '500px';
            ele.height = '500px';
            ele.frameborder = 'none';
            ele.style.border = 'none';
            ele.style.allowtransparency = 'true';
            ele.style.margin = '0px';
            ele.scrolling = 'yes';
            
            // Append the iframe to the body
            document.body.appendChild(ele);
        }
        
        ele.src = url;
    }
    </script>
    As for the cookie remember what is the code you have tried, could you please post it.

  11. #11
    SitePoint Member
    Join Date
    Feb 2011
    Posts
    7
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I have solved this. Thanks again for your help.

  12. #12
    SitePoint Wizard bronze trophy chris.upjohn's Avatar
    Join Date
    Apr 2010
    Location
    Melbourne, AU
    Posts
    2,189
    Mentioned
    17 Post(s)
    Tagged
    1 Thread(s)
    No problem


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
  •