代码之家 › 专栏 › 技术社区 › Dycey

使用jquery从get url参数重置输入值

get parameters webforms url jquery

Dycey · 技术社区 · 15 年前

这可能看起来很奇怪,但我希望能够使用通过get-param列表传入的值填充静态Web表单。

假设我有一个页面'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>

每当输入更改时,我需要提交表单:

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

但很明显,我想保留这些值,以便在重新加载时不会重置它们。

(为什么?因为我是在一个FileMaker Web视图中完成的,从表单中提取数据的唯一方法是获取源代码(url)并解析它…因此,我需要url来更新以反映表单的当前状态,并且能够为我想要显示的任何新记录传入数据…)

更新:

这是我的非工作代码-它是很好的单值字段,但对于单选按钮失败…

$('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','');
        }
      });
    };
  })
}
});

问题是我将表单上有多个值为yes、no和na的单选按钮,因此jquery想要这样做的方式似乎不适用。如果这有帮助的话,我可以重新识别收音机按钮…

<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>

2 回复 | 直到 15 年前

mike 15 年前

更好的方法可能是在每次输入更改时实现Ajax提交。
但是要读取get参数,可以使用这个插件 http://www.mathias-bank.de/2007/04/21/jquery-plugin-geturlparam-version-2/ 对于jQuery。

Dycey 15 年前

这是一些工作……但在URL编码和值解码方面仍然存在问题…

$(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','');
          }
        };
      });
    })
  }
});