我正在尝试禁用jqgrid中的复选框输入。
我在字段的colModel数组上使用了这个自定义格式化程序
formatter: function (cellvalue, options, rowObject)
{
return '<input type="checkbox" value="' + cellvalue + '" ' + (rowObject.IsActive== true ? 'checked="checked"' : '') + ' ' + (rowObject.IsEnabled == false ? 'disabled="disable"' : '') + '/>';
}
这项工作是因为我希望可以在允许的情况下检查一些行，但是问题是当我检查了其中任何行并且得到了这样的值时：
$('#jqgTable').jqGrid('getCell', id, 'IsActive');
返回的HTML标签是<input type="checkbox" value="true" checked="checked">，但始终是true使用$($('#jqgTable').jqGrid('getCell', "idSelected", 'IsActive')).is(':checked')。
在使用formatter: "checkbox"和$('#jqgTable').jqGrid('getCell', id, 'IsActive');之前，我会得到Yes或No，因此我可以执行所需的操作，但是所有复选框都已启用。
我也尝试了其他解决方案
我使用了formatter: "checkbox"和函数
beforeSelectRow: function (rowid, e) {
var $target = $(e.target);
if ($target.is(":checkbox")) {
var canChange = $("#jqgTable").jqGrid('getRowData', rowid).IsEnabled == 'false' ? false : true;
if ($("#jqgTable").jqGrid('getRowData', rowid).IsEnabled == 'false' ? false : true) {
UpdateState(rowid);
}
else
{
e.preventDefault();
}
}
return true;
},
这有效，但是该复选框似乎可以更改。
所有使用第一个选项的代码
$("#jqgTable").jqGrid({
data: data,
datatype: "local",
colNames: [
'Checkbox'
,'Enable'
],
colModel: [
{
name: 'IsActive', label: "Active", width: 100,
//formatter: 'checkbox',
align: "center", stype: "select",
searchoptions: { sopt: ["eq", "ne"], value: "true:Si;false:No" },
editable: true, edittype: 'checkbox', formatoptions: { disabled: false },
formatter: function (cellvalue, options, rowObject)
{
return '<input type="checkbox" value="' + cellvalue + '" ' + (rowObject.IsActive == true ? 'checked="checked"' : '') + ' ' + (rowObject.IsEnable == false ? 'disabled="disable"' : '') + '/>';
}
},
{
name: 'IsEnable', label: '', width: 1, hidden: true
},
],
rowNum: 10,
mtype: 'GET',
loadonce: true,
rowList: [5, 10, 20, 30, 40, 50],
pager: '#jqgTablePager',
sortable: true,
multiselect: false,
pageable: true,
viewrecords: true,
sortorder: 'desc',
gridview: true,
autowidth: false,
width: 100,
shrinkToFit: false,
altRows: true,
altclass: "myAltRowClass",
gridComplete: function (){
//Second option
},
beforeSelectRow: function (rowid, e) {
var $target = $(e.target);
if ($target.is(":checkbox")) {
var canChange = $("#jqgTable").jqGrid('getRowData', rowid).IsEnabled == 'false' ? false : true;
if ($("#jqgTable").jqGrid('getRowData', rowid).IsEnabled == 'false' ? false : true) {
UpdateState(rowid);
}
else
{
e.preventDefault();
}
}
return true;
}
});
$('#jqgTable').jqGrid('navGrid', '#jqgTablePager',
{
edit: false,
add: false,
del: false,
search: true,
searchtext: "Search"
},
//Edit
{},
//Add
{},
//Delete
{},
//Search
{
closeAfterSearch: true,
closeAfterReset: true,
closeOnEscape: false,
searchOnEnter: true,
multipleSearch: true,
multipleGroup: false,
showQuery: false
}
).navButtonAdd('#jqgTablePager', { title: "Title", caption: "Caption", buttonicon: 'ui-icon-wrench', onClickButton: function () { ShowGroup(); }, position: "last" })
.navButtonAdd('#jqgTablePager', { title: "Delete", caption: "", buttonicon: 'ui-icon-close', onClickButton: function () { CleanGroup(); }, position: "last" });
$("#jqgTable").trigger("reloadGrid");
谢谢！
更新
我尝试了第二个选项，并在gridComplete函数中添加了此样式，以使用disabled来使用CSS样式cursor: not-allowed：
var ids = $("#jqgTable").jqGrid('getDataIDs');
for (var i = 0; i < ids.length; i++) {
var id = ids[i];
var isEditable = $("#jqgTable").jqGrid('getRowData', id).IsEnabled == 'false' ? false : true;
if (!isEditable)
$("#jqgTable").jqGrid('setCell', id, 'IsActive', '', 'disabled', {disabled : true});
}
工作正常。
更新
最后我做到了：
我在ColModel中为复选框保留了默认格式化程序 然后在gridComplete函数上添加：
var IsEnabled = $("#jqgTable").jqGrid('getRowData', id).IsEnabled == 'false' ? false : true;
var IsActive = $("#jqgTable").jqGrid('getRowData', id).IsActive == 'false' ? false : true;
if (!IsEnabled)
{
$("#jqgTable").jqGrid('setRowData', id, { IsActive: '<input type="checkbox" ' + (IsActive == true ? 'checked="checked"' : '') + ' disabled="disable/>'});
}
答案 0 :(得分：0)
为了解决您的问题，您应该使用再次定义unformat函数
var selectedFile;
$("#Image_1").on('change', function(event){ // Image 1 Input
selectedFile = event.target.files[0];
})
function insertData(fullName, inputPhone, inputEmail){
var filename = selectedFile.name;
var storeRef = firebase.storage().ref();
var storageRef = storeRef.child("files/"+ fullName + "/" + filename.name);
var uploadTask = storageRef.put(selectedFile);
uploadTask.on('state_changed',
function progress(snapshot){
var percentage = (snapshot.bytesTransferred / snapshot.totalBytes) * 100;
console.log('Upload is ' + percentage + '% done');
var html = "<div class='progress-bar' role='progressbar' aria-valuenow="+ percentage +" style='width:"+percentage+"%' aria-valuemin='0' aria-valuemax='100'></div>"
$(".progress").append(html);
},
function error(error){
console.log("Image not loaded. Check your internet connection.")
},
function(){
var postKey = firebase.database().ref("Users/").push().key;
uploadTask.snapshot.ref.getDownloadURL().then(function(downloadURL) {
console.log('File available at', downloadURL);
var updates = {}
var postData = {
Full_Name: fullName,
Phone: inputPhone,
Email: inputEmail,
Image_1: downloadURL
}
updates['/Users/' + postKey] = postData;
firebase.database().ref().update(updates);
});
});
}在colModel中定义以下格式：
custom formatter. so if your custom formatter is :
formatter: function (cellvalue, options, rowObject)
{
return '<input type="checkbox" value="' + cellvalue + '" ' + (rowObject.IsActive== true ? 'checked="checked"' : '') + ' ' + (rowObject.IsEnabled == false ? 'disabled="disable"' : '') + '/>';
}
请注意，我们分析的是单元格，而不是单元格值。
我们在Guriddo jqGrid中对此进行了测试，并且按预期运行。
现在使用getCell和getRowData将返回true或false，具体取决于是否选中了该复选框