[英]how can I pass php variable from my select to jquery?
我有下一个代码来加载我网站中的所有国家:
$(document).ready(function() {
$.ajax({
type: 'GET',
url: '/comunidades',
success: function(response) {
$("#cbx_comunidad").empty();
// console.log(response);
$("#cbx_comunidad").prepend("<option value='' selected='selected'>Seleccione Comunidad</option>");
for (i = 0; i < response.length; i++) {
$("#cbx_comunidad").append("<option value='" + "rellena una opcion" + "</option>");
//console.log('response' + response[i].id);
$("#cbx_comunidad").append("<option value='" + response[i].id + "'>" + response[i].comunidad + "</option>");
}
}
});
});
并在我的网站上加载我所有的省份:
$('#cbx_comunidad').on('change', function(event) {
$.ajax({
type: 'GET',
url: '/provincias/' + event.target.value,
success: function(response) {
$("#cbx_provincia").empty();
// console.log(response);
$("#cbx_provincia").prepend("<option value='' selected='selected'>Seleccione Provincia</option>");
for (i = 0; i < response.length; i++) {
$("#cbx_provincia").append("<option value='" + "rellena una opcion" + "</option>");
$("#cbx_provincia").append("<option value='" + response[i].id + "'>" + response[i].provincia + "</option>");
}
}
});
});
我想从 select 中设置默认值,如下所示:
function setDefault(defValue) {
alert(defValue);
$('#cbx_comunidad option').each(function () {
if (($(this).attr('value')) === defValue) {
$(this).attr('selected', 'selected');
}
});
}
在我的 php 代码中,我需要类似于下一个的内容:
<label for="cbx_comunidad">Seleccione Comunidad:</label>
$usercomunidad = $user->comunidad_id
<select onload="setDefault($user->comunidad_id)"
class="form-control @error('cbx_comunidad') is-invalid @enderror"
name="cbx_comunidad"
id="cbx_comunidad"
required></select>
这可能有一个触发器将我的 php 变量传递给我的 jquery 代码? 如何选择我的默认值来更新视图?
如果您打算将它们作为 JS 参数传递,则需要回显 php 变量。 ( onload="setDefault({{ $user->comunidad_id }})"
)
您也可以在您的选择中使用data-*
属性。
<label for="cbx_comunidad">Seleccione Comunidad:</label>
<select class="form-control @error('cbx_comunidad') is-invalid @enderror"
name="cbx_comunidad"
id="cbx_comunidad"
data-id="{{ $user->comunidad_id ?: '' }}"
required></select>
$('#cbx_comunidad').on('change', function(event) {
$.ajax({
type: 'GET',
url: '/provincias/' + event.target.value,
success: function(response) {
let value = $("#cbx_provincia").attr('data-id');
$("#cbx_provincia").empty();
$("#cbx_provincia").prepend("<option disabled "+(value ? '' : 'selected')+">Seleccione Provincia</option>");
for (i = 0; i < response.length; i++) {
$("#cbx_provincia").append("<option value='" + response[i].id + "'" + (value == response[i].id ? 'selected' : '') + ">" + response[i].provincia + "</option>");
}
}
});
});
我应该能够在标记中打印经过消毒的 PHP 数据,如下所示。
<label for="cbx_comunidad">Seleccione Comunidad:</label>
<select onload="setDefault('<?php echo htmlentities($user->comunidad_id, ENT_QUOTES, 'UTF-8'); ?>')" class="form-control @error('cbx_comunidad') is-invalid @enderror" name="cbx_comunidad" id="cbx_comunidad" required>
</select>
您在文档加载时从 ajax 填充选择,但尝试在加载选择元素后立即设置所选值。 这意味着选择是空的,当时没有匹配的选项。 您应该尝试在添加/附加所有选项后进行选择。 所以在 select 中使用 data-id 来存储选定的值并读取此值以在附加所有选项后预先选择该选项。
$(document).ready(function() {
$.ajax({
type: 'GET',
url: '/comunidades',
success: function(response) {
$("#cbx_comunidad").empty();
// console.log(response);
$("#cbx_comunidad").prepend("<option value='' selected='selected'>Seleccione Comunidad</option>");
for (i = 0; i < response.length; i++) {
$("#cbx_comunidad").append("<option value='" + "rellena una opcion" + "</option>");
//console.log('response' + response[i].id);
$("#cbx_comunidad").append("<option value='" + response[i].id + "'>" + response[i].comunidad + "</option>");
}
$("#cbx_comunidad").val($("#cbx_comunidad").data('id'));
}
});
});
在你的 html 中:
<select data-id="$user->comunidad_id"
class="form-control @error('cbx_comunidad') is-invalid @enderror"
name="cbx_comunidad"
id="cbx_comunidad"
required>
</select>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.