Advanced Search

Return to Snippet

Revision: 35345
at November 5, 2010 20:46 by Carolyne
Initial Code 
<html>
<head>
<script type="text/javascript">
function populate(form)
{
    if ( location.search == null || location.search.length < 1 ) return; // no querystring

    var pairs = location.search.substring(1).split("&");
    for ( var p = 0; p < pairs.length; ++p )
    {
        var pair = pairs[p].split("=");
        var name = pair[0];
        var value = unescape( pair[1].replace(/\+/g, " ") );
        var fld = form.elements[name];
        var ftype = null;
        var farray = false;
        var atype = Array;

        if ( fld != null )
        {
            if ( fld.length != null && fld.length >= 1 && fld[0].type != null && fld[0].type != undefined )
            {
                ftype = fld[0].type;             
                farray = true;
            } else {
                ftype = fld.type;
            }
        }
        switch ( ftype )
        {
            case "text": case "hidden": case "textarea":
                if ( farray ) fld = fld[0]; // only handle first-named for this type
                fld.value = value;
                break;
            case "select-one": case "select-multiple":
                if ( farray ) fld = fld[0]; // only handle first-named for this type
                for ( var o = 0; o < fld.options.length; ++o )
                {
                    var opt = fld.options[o];
                    var oval = opt.value;
                    if ( oval == null || oval == "" ) oval = opt.text;
                    if ( oval == value )
                    {
                        opt.selected = true;
                        break;
                    }
                }
                break;
            case "checkbox": case "radio":
                if ( ! farray )
                {
                    // single checbox or radio of that name:
                    fld.checked = true;
                } else {
                    for ( var cr = 0; cr < fld.length; ++cr )
                    {
                        if ( fld[cr].value == value )
                        {
                            fld[cr].checked = true;
                            break;
                        }
                    }
                }
                break;
            default:
                alert("Unknown field type encountered for field " + name + ": " + ftype);
                break;
        } // end of switch
    } // end of loop on fields from qs
}
</script>
</head>
<body onload="populate(document.TheForm);">
<p>
Example querystring to try:<br/> ?sel1=Three&sel2=2&sel2=4&cb1=2&cb1=3&rb1=C&text1=put+some+random+text+here&ta1=all+fun+and+games...
</p>
<form name="TheForm">
Text1<input type="text" name="text1" /><br/><br/>
Checkboxs: 1:<input type="checkbox" name="cb1" value="1" />
2: <input type="checkbox" name="cb1" value="2" />
3: <input type="checkbox" name="cb1" value="3" />
<br/><br/>
RB1<br/>
A<input type="radio" name="rb1" value="A" /><br/>
B<input type="radio" name="rb1" value="B" /><br/>
C<input type="radio" name="rb1" value="C" /><br/>
<br/><br/>
<textarea name="ta1" rows=4 cols=40></textarea>
<br/><br/>
Sel1:
<select name="sel1">
   <option>One</option>
   <option>Two</option>
   <option>Three</option>
   <option>Four</option>
</select>
<br/><br/>
Sel2:
<select name="sel2" multiple>
   <option value="1">One</option>
   <option value="2">Two</option>
   <option value="3">Three</option>
   <option value="4">Four</option>
</select>
<br/>
</form>
</body>
</html>
Initial URL 

                                

                                                            

                                    

                                        

                                        Initial Description
                                        

                                    

                                    
Code matches querysting data to form feilds on the page based on the feild name.
I've added the example querystring to the body of the page.

Found at: http://codingforums.com/showthread.php?t=198419
Code by: Old Pedant

                                

                                                            

                                    

                                        

                                        Initial Title
                                        

                                    

                                    
Prepopulate form with values from querystring

                                

                                                            

                                    

                                        

                                        Initial Tags
                                        

                                    

                                    
form

                                

                                                            

                                    

                                        

                                        Initial Language
                                        

                                    

                                    
JavaScript