SitePoint Sponsor

User Tag List

Results 1 to 3 of 3

Hybrid View

  1. #1
    SitePoint Zealot
    Join Date
    Dec 2010
    Posts
    145
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Simple Form in Shopify Site

    Hello,

    I have a page here:

    http://www.vivomasks.com/pages/masqu...event-planners

    All I want is a simple drop down of the US states. When someone chooses that state, and click submit, they are taken to the page specific to that state.

    What is the easiest way to do this? All I know is basic HTML, I don't know any server side language but I can learn if I know where to look. Thanks

  2. #2
    SitePoint Member
    Join Date
    May 2013
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hello
    This isn't too difficult of a task. It looks like it is pre-programmed already to look for the specific 2 digit short-codes for the states. So all you need to do is create the pages and name them NY, NJ, MD, PA, etc, etc.

  3. #3
    SitePoint Addict bronze trophy
    Join Date
    Mar 2013
    Location
    Oneonta, NY
    Posts
    307
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Awkward,

    You could do it like this:

    <label for='state' >State/Province*:</label><br/>
    <select name='state' id='state' value=''>
    <option>Select One</option>
    <optgroup label="U.S. States">
    <option value="AK">Alaska</option>
    <option value="AL">Alabama</option>
    <option value="AR">Arkansas</option>
    <option value="AZ">Arizona</option>
    <option value="CA">California</option>
    <option value="CO">Colorado</option>
    <option value="CT">Connecticut</option>
    <option value="DC">District of Columbia</option>
    <option value="DE">Delaware</option>
    <option value="FL">Florida</option>
    <option value="GA">Georgia</option>
    <option value="HI">Hawaii</option>
    <option value="IA">Iowa</option>
    <option value="ID">Idaho</option>
    <option value="IL">Illinois</option>
    <option value="IN">Indiana</option>
    <option value="KS">Kansas</option>
    <option value="KY">Kentucky</option>
    <option value="LA">Louisiana</option>
    <option value="MA">Massachusetts</option>
    <option value="MD">Maryland</option>
    <option value="ME">Maine</option>
    <option value="MI">Michigan</option>
    <option value="MN">Minnesota</option>
    <option value="MO">Missouri</option>
    <option value="MS">Mississippi</option>
    <option value="MT">Montana</option>
    <option value="NC">North Carolina</option>
    <option value="ND">North Dakota</option>
    <option value="NE">Nebraska</option>
    <option value="NH">New Hampshire</option>
    <option value="NJ">New Jersey</option>
    <option value="NM">New Mexico</option>
    <option value="NV">Nevada</option>
    <option value="NY">New York</option>
    <option value="OH">Ohio</option>
    <option value="OK">Oklahoma</option>
    <option value="OR">Oregon</option>
    <option value="PA">Pennsylvania</option>
    <option value="PR">Puerto Rico</option>
    <option value="RI">Rhode Island</option>
    <option value="SC">South Carolina</option>
    <option value="SD">South Dakota</option>
    <option value="TN">Tennessee</option>
    <option value="TX">Texas</option>
    <option value="UT">Utah</option>
    <option value="VA">Virginia</option>
    <option value="VT">Vermont</option>
    <option value="WA">Washington</option>
    <option value="WI">Wisconsin</option>
    <option value="WV">West Virginia</option>
    <option value="WY">Wyoming</option></optgroup></select>
    You would then have to have some kind of function to direct users to a specific page depending on what their choice was. You could use an onClick event in your submit button like this,

    <input type='submit' name='Submit' value='Submit' onclick=”someFunction()” />
    <script type=”text/javascript”>

    <script type="text/javascript">
    function someFunction()
    {
    var e = document.getElementById("changeFormAct");
    var strType = e.options[e.selectedIndex].value;
    if(strType == 'AL')
    {
    document.myform.action ="alabama.html";
    }
    return true;
    }
    </script>
    Hope that helps,

    Shawn
    Last edited by TechnoBear; May 9, 2013 at 08:48. Reason: Unintended smilies removed


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
  •