[英]cannot display the pre-filled input values on Chrome - FF works fine
我有一个表格,用户可以在开始时输入一些值,然后从此以后,只要用户返回现场,所有值都将预先填写。 输入值在FF上正常显示。 但是,如果使用Chrome,则看不到这些值。
JS(我已经包含了所有代码,但是有问题的部分在(为输入元素代码添加值)
function drawPaymentDetailsTab(bankInfoMap, playerDetailsMap) {
// Clear the bank_ul
$.each(bankInfoMap, function(index, value) {
var provider = value.provider,
methodId = value.method;
// Appending select option
var option = document.createElement("option");
option.text = getPaymentDetailsSelection(provider, methodId);
option.value = provider + '_' + methodId;
document.getElementById("selectedBankAccountType").appendChild(option);
// Stylize bank account type dropdown (if needed)
if(styledInputs) {
setTimeout(function() {
stylizeDropdown("#selectedBankAccountType",10);
}, 10);
}
// Appending div element
var selectionDiv = document.createElement('div');
selectionDiv.id = provider + '_' + methodId;
selectionDiv.style = "display:none";
document.getElementById("bank_ul").appendChild(selectionDiv);
// Appending li elements to div
$.each(value.fields, function(index, fieldsMap) {
var mainFieldName = fieldsMap.field,
maxLength = fieldsMap.maxLength;
var fieldLi = document.createElement('li');
fieldLi.id = provider + '_' + methodId + '_' + mainFieldName + '_li';
fieldLi.className = 'form-group has-feedback';
document.getElementById(provider + '_' + methodId).appendChild(fieldLi);
// Appending label for the input field
var inputLabel = document.createElement('label');
inputLabel.id = mainFieldName + '_label';
inputLabel.className = 'control-label col-sm-3';
inputLabel.for = mainFieldName;
inputLabel.innerHTML = getProviderExtraInfo(provider, methodId, mainFieldName);
if (!fieldsMap.optional) {
inputLabel.innerHTML += (fieldsMap.dependent == null) ? ' *' : ' (*)';
}
document.getElementById(provider + '_' + methodId + '_' + mainFieldName + '_li').appendChild(inputLabel);
// Appending wrapper for the input field (bootstrap)
var inputWrapper = document.createElement('div');
inputWrapper.id = mainFieldName + '_wrapper';
inputWrapper.className = 'col-sm-9';
document.getElementById(provider + '_' + methodId + '_' + mainFieldName + '_li').appendChild(inputWrapper);
// Appending input element to wrapper
if (fieldsMap.fieldType == "text") {
var fieldInput = document.createElement('input');
fieldInput.type = "text";
fieldInput.id = mainFieldName;
fieldInput.className = 'form-control';
if (maxLength != null) fieldInput.maxLength = maxLength;
// Uppercase for bic and account fields
if (mainFieldName == "ibanAccount" || mainFieldName == "ibanBic" || mainFieldName == "bankBic") fieldInput.style.textTransform = "uppercase";
document.getElementById(mainFieldName + '_wrapper').appendChild(fieldInput);
// Adding value to the input element
if(playerDetailsMap[mainFieldName] != null) $("#"+mainFieldName).val(playerDetailsMap[mainFieldName]);
// Assigning default value
if ($("#"+mainFieldName).val().length == 0 && fieldsMap.defaultValue != null) $("#"+mainFieldName).val(fieldsMap.defaultValue);
}
// Appending wrapper for the feedback (bootstrap)
var feedbackWrapper = document.createElement('div');
feedbackWrapper.id = mainFieldName + '_feedback_wrapper';
feedbackWrapper.className = 'form-control-feedback';
document.getElementById(mainFieldName + '_wrapper').appendChild(feedbackWrapper);
// Appending additional elements for feedback wrapper
var hintImg = document.createElement('img');
hintImg.title = getProviderHintInfo(provider, methodId, mainFieldName);
hintImg.alt = '?';
hintImg.src = '/cms/images/icons/what.png';
document.getElementById(mainFieldName + '_feedback_wrapper').appendChild(hintImg);
var spanOk = document.createElement('span');
spanOk.id = mainFieldName + '_validOK';
document.getElementById(mainFieldName + '_feedback_wrapper').appendChild(spanOk);
// Appending error div element to wrapper
var errorDiv = document.createElement('div');
errorDiv.className = "bankFieldError help-block error-field";
errorDiv.id = mainFieldName + "_errorMess";
document.getElementById(mainFieldName + '_wrapper').appendChild(errorDiv);
});
});
HTML标记
<ul id="bank_ul" class="list-unstyled">
<!-- Dynamically populated in myaccOnLoad(); -->
</ul>
Chrome显示问题的根本问题是由于同步AJAX调用。
从JSON提取详细信息时,我正在使用同步AJAX调用。 由于我有多个标签,在所有标签下,我都有不同的表格。 我在问题中张贴的内容位于另一个选项卡中,并且由于Sync ajax调用,仅第一个选项卡的输入值被填充/显示在页面上。
在AJAX调用中将同步更改为异步解决了该问题。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.