Help your customers fill out web forms with URL query strings

javascript.js

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript">
  $(function () {
    
    //grab the entire query string
    var query = document.location.search.replace('?', '');
    
    //extract each field/value pair
    query = query.split('&');
    
    //run through each pair
    for (var i = 0; i < query.length; i++) {
    
      //split up the field/value pair into an array
      var field = query[i].split("=");
      
      //target the field and assign its value
      $("input[name='" + field[0] + "'], select[name='" + field[0] + "']").val(field[1]);
    
    }
  });
</script>

pseudo-form.html

<script type="text/javascript">
  LCMS.FormBuilder.AddFormOnlyOnce('MainContent_0_0_pnlViewForm', 'MainContent_0_0_btnFormPost' ... and so on
</script>

query.txt

http://demo.lightignite.com/query-string-form-fill?field_92375_1015030=John&field_92375_1015031=Smith&[email protected]&field_92375_1018146=Yes

source.html

<div class="element" id="element3528871_1345643">
  <input type="hidden" name="MainContent$0$0$hfCallBack" id="MainContent_0_0_hfCallBack"> <input type="hidden" name="MainContent$0$0$hfViewState" id="MainContent_0_0_hfViewState">
  <div id="MainContent_0_0_pnlViewForm" class="form_container">
    <div class="formHeader">
      <h2 class="formTitle">Query string form filling demo</h2>
      <p class="formDescription"></p>
    </div>
    <div style="display:none;" class="errorSummary">
      <p>Please enter the required information</p>
    </div>
    <div class="fieldItem type-name medField" id="">
      <div class="fieldItemInner">
        <div class="fieldTitle">
          <span class="title">Name</span>
        </div>
        <div class="fieldContent">
          <p class="fieldRow">
            <span class="fieldBlock">
              <input name="field_92375_1015030" type="text" size="16" class="textField firstname" value="">
              <em class="fieldNote">First</em>
            </span>
            <span class="fieldBlock">
              <input name="field_92375_1015031" type="text" size="16" class="textField lastname" value="">
              <em class="fieldNote">Last</em>
            </span>
          </p>
        </div>
        <div class="fieldInstructions"></div>
      </div>
    </div>
    
    <!-- REST OF FORM OMITTED FOR BREVITY -->
    
  </div>
</div>