Question

This may seem like an odd one, but I want to be able to fill in a static web form using values passed in via a GET param list.

Say I have a page, ‘self.html’:

<form action="self.html" method="get" accept-charset="utf-8">
  <label for = "40">New Question?</label>
  <input type="radio" name="40" id="40" value="Yes"> Yes &nbsp;
  <input type="radio" name="40" id="40" value="No"> No
  <label for = "41">What's your favourite colour?</label>
  <input type="text" name="43" value="" id="41">
</form>

I need the form to submit itself whenever an input changes:

  $(document).ready(function(){
    $('input').change(function(){
      $("form:first").submit();
    });
    // collate_results();
  });

but obviously I want to keep the values, so that they’re not reset on the reload.

(Why? Because I’m doing it in a FileMaker web view, and the only way to pull data out of a form is to get the source – url – and parse it… hence I need to url to update to reflect the current state of the form, and also be able to pass in the data for any new records I want to display…)

UPDATE:

Here’s my non-working code – it’s fine single value fields, but fails for radio buttons…

$('input').change(function(){
  $("form:first").submit();
});
var qString = jQuery.url.attr("query");
if(qString) {
  qString = qString.split("&");
  $(qString).each( function() {
    var parts = this.split("=");
    var item = $('#'+parts[0]);
    if($(item).attr('type') == 'text') {
      $('#'+parts[0]).val(parts[1]);
    };
    if($(item).attr('type') == 'radio') {
      $(item).each(function() { 
        console.log(this);
        if($(this).val() == parts[1]) {
          $(this).attr('checked','checked');
        } else {
          $(this).attr('checked','');
        }
      });
    };
  })
}
});

The problem is that I will have multiple radio buttons with values of yes, no, na on the form, so the way that jQuery wants to do it doesn’t seem to apply. I can re-id the radio button if that helps…

<form action="self.html" method="get" accept-charset="utf-8">
  <label for = "40">New Question?</label>
  <input type="radio" name="47" id="47_yes" value="Yes">Yes &nbsp;
  <input type="radio" name="47" id="47_no" value="No" checked> No
  <label for = "48">What's your favourite colour?</label>
  <input type="text" name="48" value="" id="48">
</form> 

Answer 1

Here’s something that sort of works… but still having problems with url encoding and decoding of values…

$(document).ready(function(){
  $('input').change(function(){
    $("form:first").submit();
  });
  var qString = jQuery.url.attr("query");
  if(qString) {
    qString = qString.split("&");
    $(qString).each( function() {
      var parts = this.split("=");
      var items = $("input[name^='"+parts[0]+"']");
      var myval = decodeURI(parts[1]);
      $(items).each(function() {
        var item = this;
        if($(item).attr('type') == 'text') {
          $('#'+parts[0]).val(myval);
        };
        if($(item).attr('type') == 'radio') {
          if($(item).val() == myval) {
            $(item).attr('checked','checked');
          } else {
            $(item).attr('checked','');
          }
        };
      });
    })
  }
});