我使用Ajax jQuery从我的Flask服务器获取id为“pSelId”和“pVim”的选择数据（请参阅下面的HTML代码）。这个工作正常。
现在我必须根据“pSelId”中的选定选项做出决定并在选择字段“pVim”中返回选项数据，为此我必须从我选中的值中获取Flask服务器上的“#p_name”值选择字段“pSelId”来做出这个决定。目前我在服务器端为p_name ='p15'分配静态值。
我不知道如何在
中发送所选选项的值服务器端代码：
@app.route('/listpopvim', methods=['POST','GET'])
def listpopvim():
#p_name=request.form['pName'];
p_name='p15'
p_dict1 = []
for p in load_p:
p_dict2={
'pop': p['fq_name'][1]
}
#pop_dict1.append(pop_dict2)
return json.dumps(p_dict1)
HTML / jQuery：
<div class="row">
<div class="col-xs-4">
<h6> P Name </h6>
<select id="pSelId" name="pName" class="form-control"> </option> </select>
</div>
<div class="col-xs-4">
<h6> VIM </h6>
<select id="pVim" name="pVim" class="form-control"> </select>
</div>
</div>
<script>
getdata()
function getdata(){
$.ajax({
url : '/listpv',
type : 'POST',
success: function(data){
var pretrun = JSON.parse(data);
console.log(data)
$( "select" ).change( displayVals );
var options = "";
for (var i = 0; i < pretrun.length; i++) {
if (pretrun[i].pop){
options += "<option>" + pretrun[i].pop + "</option>";
}
}
$("#pSelId").html(options);
},
error: function(error){
console.log(error);
}
});
}
function displayVals() {
var singleValues = $( "#pSelId" ).val();
console.log(singleValues)
}
$( "#pSelId" ).change( displayVals );
displayVals();
</script>
答案 0 :(得分：0)
我认为您在此处遗漏的所有内容都是您的帖子请求中的数据字段。你不得不在数据领域中弄清楚你真正想要的东西，因为我并不完全确定我完全理解你在那里寻找的东西，但是this site应该有所帮助。
的Python：
@app.route('/listpopvim', methods=['POST','GET'])
def listpopvim():
p_name=request.form['pName'];
p_dict1 = []
for p in load_p:
p_dict2={
'pop': p['fq_name'][1]
}
#pop_dict1.append(pop_dict2)
return json.dumps(p_dict1)
HTML：
<div class="row">
<div class="col-xs-4">
<h6> P Name </h6>
<select id="pSelId" name="pName" class="form-control"> </option> </select>
</div>
<div class="col-xs-4">
<h6> VIM </h6>
<select id="pVim" name="pVim" class="form-control"> </select>
</div>
</div>
JS：
<script>
getdata()
function getdata(){
$.ajax({
url : '/listpv',
type : 'POST',
data : {pName : $("pSelId").val()},
success: function(data){
var pretrun = JSON.parse(data);
console.log(data);
$( "select" ).change( displayVals );
var options = "";
for (var i = 0; i < pretrun.length; i++) {
if (pretrun[i].pop){
options += "<option>" + pretrun[i].pop + "</option>";
}
}
$("#pSelId").html(options);
},
error: function(error){
console.log(error);
}
});
}
function displayVals() {
var singleValues = $( "#pSelId" ).val();
console.log(singleValues)
}
$( "#pSelId" ).change( displayVals );
displayVals();
</script>
答案 1 :(得分：0)
感谢您的回复。 我做了一些修改，并能够将数据发送到服务器但是我无法使用request.form检索[＆＃39; pName＆＃39;]; 但是我可以使用下面的代码看到数据 SS =的request.form print ss
另一个问题是这个数据是一个ImmutableMultiDict，不知道为什么。 这是我服务器控制台上打印ss的输出：
ImmutableMultiDict（[（＆＃39; pName＆＃39;，u＆＃39; pop15＆＃39;）]）
以下是修改后的代码：
function getpop(){
$.ajax({
url : '/listpopvim',
type : 'GET',
success: function(data){
var pop = JSON.parse(data);
console.log(data)
var options = "";
for (var i = 0; i < pop.length; i++) {
if (pop[i].pop){
options += "<option>" + pop[i].pop + "</option>";
}
}
$("#popSelId").html(options);
$( "select" ).change( displayVals );
},
error: function(error){
console.log(error);
}
});
}
displayVals();
function displayVals() {
$.ajax({
url: "/listpopvim",
data: {pName: $( "#popSelId" ).val()},
ContentType : 'application/json',
dataType: "json",
//data: JSON.stringify(singleValues),
type:"POST",
success : function(response) {
//console.log(response)
},
error: function() {
alert('Error occured');
}
});
}