当我从下拉列表中选择选项时,按钮应该自动触发并生成唯一的 Id



>我有一个下拉菜单,当我从下拉列表中选择一个选项时,按钮必须自动触发,并生成一些唯一的id。我不确定当我们从掉落的 dropdwon 中选择值时触发器是如何发生的。 我已经参考了这个链接 从下拉列表中选择时自动触发单击按钮

但它不起作用,也没有显示任何错误。我可以看到它不会进入按钮单击功能。有人可以帮助我如何在我们选择下拉选项时进行自动单击吗? 我在这里附加代码

<div id="dialog-form" title="Send Email Invite">
<form>
<fieldset>               
<label for="select1">Round Level</label>
<div class="col-md-4">
<select name="select1" class="form-control" id="select1" style="width:200px; height:30px;" required>
<option value="">Select the below option</option>
{% for each_round in round_names %}
<option value="{{each_round.round_id,each_round.round_name}}">{{each_round.round_name}}</option>
{% endfor %}
</select>
<div class="valid-feedback">Valid</div>
<div class="invalid-feedback">Please fill out this field</div>
<div class="col-md-4" id="generateButton" style="display:none;" required>
<input id="generateUrl" value="generate url" size="40%" readonly />
<input type="button" class="btn btn-info" value="Generate URL" id="urlbutton"></input>
</div>
<div id="result">
<textarea name="rdesc" id="rdesc" style="width:200px; height:300px; display:none;"
required></textarea>
</div>

</div>
<script>
$("#select1").on('change', function () {
$("[name='select1']:submit").trigger("#urlbutton")
var dropdownValue = document.getElementById("select1");
var roundName = dropdownValue.options[dropdownValue.selectedIndex].value;
$.ajax({
type: 'POST',
url: 'blah',
data: {
'blah': blah
},
success: function (results) {
$("#rdesc").show();
$("#rdesc").text(results.round_description);
}
})

})
</script>
<input type="submit" tabindex="-1" style="position:absolute; top:-1000px">
</fieldset>
</form>
</div>
<script>
$("#urlbutton").click(function () {
console.log("i am coming here");
$.ajax({
type: 'POST',
url: 'blah',
data: {
'blah':blah
},
success: function (data) {
var url_textbox = document.getElementById("generateUrl");
url_textbox.setAttribute('value', data.url);
}
})
})
</script>

您可以像这样以编程方式单击该按钮。

在选择更改时,单击按钮。

("#urlbutton").click()

最新更新