Question

在从另一个select元素进行用户选择后，我动态创建一个HTML select元素。但是，用于检查表单的PHP脚本无法识别新元素并将其指示为null：

以下是片段：

some.js:
if(document.getElementById(firstselect).value=='somvalue'){
    document.getElementById(gamsDiv).removeChild(gamsElem);
    gamsElem = document.createElement("select");
    gamsElem.id = "FacilityGamsId";
    gamsElem.name = "FacilityGamsId";
   gamsElem.setAttribute("onChange", "updateHidden(this);makeUpdateRequest(arguments[0],this)");                    
    opt = document.createElement("option");
    opt.text="Select one ";
    opt.value=0;
    gamsElem.options.add(opt);
    .....some other stuff
    .....                           
    document.getElementById(gamsDiv).appendChild(gamsElem);

}

the php script:

if($_POST){
    var_dump($_POST['FacilityGamsId'];
}

result: null

服务器发布操作是否有任何理由无法识别来自js脚本的任何动态HTML元素。如果我检查/检查新创建的元素，则名称和ID完全相同。

任何帮助都非常感谢;）。感谢

Answer 1

它未添加到存储在浏览器DOM中的表单中。

这家伙正试图这样做：dynamic element created not POSTed

解决方案是构建动态表单服务器端 - 如果确实需要客户端，我认为除了DOM之外，我还需要操作表单（存储在document.forms中）。

Answer 2

下面：

gamsElem.options.add(opt);

add是select element interface的方法，而不是options（HTMLElement Collection并且没有添加方法）。所以：

gamsElem.add(opt);

应该解决问题。 Note that gamsElem.add(opt); does not work in Mozilla firefox 6 so I reverted to my old code of gamsElem.options.add(opt).

和

gamsElem.setAttribute("onChange",
 "updateHidden(this);makeUpdateRequest(arguments[0],this)");

会更好：

gamsElem.onchange = function() {
    updateHidden(this);
    makeUpdateRequest(arguments[0], this);
};

虽然我不知道 arguments [0] 应该引用什么。

以下是如何正常完成的（虽然按钮会调用一个函数而不是一块内联代码，我只是为了方便而这样做了）：

<form action="">
  <div id="div0">
    <select id="sel0" name="sel0">
      <option>option 0
    </select>
    <input type="submit">
  </div>
</form>

<button onclick="
  var div = document.getElementById('div0');
  var sel = document.getElementById('sel0');
  div.removeChild(sel);
  sel = document.createElement('select');
  sel.id = 'sel1';
  sel.name = 'sel1';
  sel.onchange = function(){alert(this.value);};
  sel.options[0] = new Option('Select one', '0');
  sel.options[1] = new Option('Select two', '1');
  div.appendChild(sel);
  ">Replace select</button>

需要第二个选项才能启动 onchange 侦听器。

如果要将一个元素替换为另一个元素，请创建新元素，然后只需替换旧元素：

<button onclick="
  var oldSel = document.getElementById('sel0');
  var sel = document.createElement('select');
  sel.id = 'sel1';
  sel.name = 'sel1';
  sel.onchange = function(){alert(this.value);};
  sel.options[0] = new Option('Select one', '0');
  sel.options[1] = new Option('Select two', '1');
  oldSel.parentNode.replaceChild(sel, oldSel);
  ">Replace select</button>

或者您可以只替换选项（将select的options.length设置为零，只需添加新选项）。

Answer 3

您必须在FORM标记中添加新元素

Answer 4

在DOM准备好后运行此代码，最好是在jquery中使用$ .ready（）。

并将引号括在div名称（“gamsDiv”）

动态元素创建未POSTed

4 个答案: