让Javascript插入我的文本框中的值（AJAX！）

所以我有这个代码，我试图用它来更新我的表单文本框，当我选择不同的下拉用户。让Javascript插入我的文本框中的值（AJAX！）

下面的代码：

<script type="text/javascript"> 
document.getElementById("useruname").onchange = function() { 
var selecteduname = this.value; 
} 

var xmlhttp; 
function loadXMLDoc() 
{ 

if (window.XMLHttpRequest) 
    { 
xmlhttp=new XMLHttpRequest(); 
} 
else 
    { 
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
} 
} 

function updateAdduser() 
{loadXMLDoc(); 
xmlhttp.onreadystatechange=function() 
{ 
if (xmlhttp.readyState==4 && xmlhttp.status==200) 
{ 
var json = xmlhttp.responseText; 
var fields = JSON.parse(json); 
Object.keys(fields).forEach(function (name) { 
var input = document.getElementsByName(name); 
input.value = fields[name]; 
}); 
} 
} 
xmlhttp.open("GET", "ajaxuseradd.psp?=", true); 
xmlhttp.send(); 
} 

</script> 
<form action="adduser.psp" method="get"> 
<fieldset> 
<label for="uname">Username:</label> 
<select name="uname" id="useruname" onChange="updateAdduser();"> 
<% 
import MySQLdb 

db = MySQLdb.connect("localhost", "login", "password", "somethingelse") 
c = db.cursor() 

c.execute("""SELECT user from employees;""") 

tup = c.fetchall() 

tupstr = str(tup) 

tupstr = tupstr.replace("(", "").replace("'", "").replace(")", "").replace(",,", ",").replace("'", "").replace("' ", "'").replace(", ", ",") 

tupstr = tupstr.rstrip(",") 

numlist = tupstr.split(",") 

optionlist = ['<option value="%s">%s</option>' % (x, x) for x in numlist] 

options = "\n".join(optionlist) 

%> 


<%= options %> 

</select> 

</fieldset> 
<fieldset> 
    <label for="fname">First Name:</label> 
<input type="text" name="fname" /> 
</fieldset> 
<fieldset> 
    <label for="lname">Last Name:</label> 
<input type="text" name="lname" /> 
</fieldset> 
<fieldset> 
    <label for="email">Email:</label> 
    <input type="text" name="email"> 
</fieldset>

来源

2011-11-03 Andrew Alexander

......那么，什么是它做的，它不应该，或者不这样做，它应注意什么？请更准确地说明“更新我的表单文本框”的含义。另外，我假设你在这里使用某种模板引擎，并且该代码段中间的Python实际上被执行并且插入了结果？您可能还想提及您的模板引擎。至于实际的AJAX工作，你有没有考虑过使用像jQuery这样的库？ –

它应该用来自服务器的值填充文本框。即他们会预先加载，当您选择一个选项值与该用户的信息，然后可以编辑和重新提交。我没有使用模板引擎，只有mod_python与Python服务器页面。 –

我会认真考虑迁移到使用客户端JavaScript库，例如jQuery。

您的代码将被简化为这样的事：

<script type="text/javascript"> 
$("#useruname").change = function() { 
    var selecteduname = this.value; 
} 


function updateAdduser() 
{ 
    var fields = null; 
    $.ajax(url: "ajaxuseradd.psp?=", 
      dataType = 'json', 
     success: function(data){ 
      fields = data; 
      Object.keys(fields).forEach(function (name) { 
       var input = $(name); 
       input.value = fields[name]; 
      }); 
     } 
    }); 
}  
</script> 

<form action="adduser.psp" method="get"> 
<fieldset> 
<label for="uname">Username:</label> 
<select name="uname" id="useruname" onChange="updateAdduser();"> 
<% 
import MySQLdb 

db = 
c = db.cursor() 

c.execute("""SELECT user from employees;""") 

tup = c.fetchall() 

tupstr = str(tup) 

tupstr = tupstr.replace("(", "").replace("'", "").replace(")", "").replace(",,", ",").replace("'", "").replace("' ", "'").replace(", ", ",") 

tupstr = tupstr.rstrip(",") 

numlist = tupstr.split(",") 

optionlist = ['<option value="%s">%s</option>' % (x, x) for x in numlist] 

options = "\n".join(optionlist) 

%> 


<%= options %> 

</select> 

</fieldset> 
<fieldset> 
    <label for="fname">First Name:</label> 
<input type="text" name="fname" /> 
</fieldset> 
<fieldset> 
    <label for="lname">Last Name:</label> 
<input type="text" name="lname" /> 
</fieldset> 
<fieldset> 
    <label for="email">Email:</label> 
    <input type="text" name="email"> 
</fieldset>

来源

2011-11-03 18:02:10

让Javascript插入我的文本框中的值（AJAX！）

回答

相关问题