Question

在编辑/添加表单jqGrid中，一个字段必须上传文件。我第一次使用edittype = file。但我需要更改此元素的视图，这就是我通过此函数使用edittype = custom的原因

function myelem (value, options) {
                                      var el=$("<div class='type_file'>"+
                                        "<input type='file' class='inputFile' id='"+options.name+"' name='"+options.name+"'/>" +
                                        "<div class='fonTypeFile'><input type='text' class='inputFileVal' readonly='readonly' id='fileName'"+
                                        " /></div>"+
                                        "</div>");
                                        var g='',val_file;
                                       $('.inputFile').change(function () { 
                                            g=$('.inputFile').val();        alert(g);                                   
                                            $('.inputFileVal').val(g);                                              
                                        }); 

                                    return el;
                                    }
                                    function myvalue(elem, operation, value) {
                                         $('input',elem).val('');
                                    }

用户选择的文件必须在文本字段中显示。但这不起作用。怎么改变这个？

Answer 1

我在表单中添加元素，然后使用自定义元素的偏移量为图像创建偏移量（上传）。

的CSS：

.customelement { 
position: absolute; 
top: 0;
left: 0;
z-index: 2;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0); 
-moz-opacity: 0;
-khtml-opacity: 0;
opacity: 0;
width: 237px; }
.fonTypeFile { 
width: 237px; 
height: 23px;
background: url(images/inputFile.png); 
position: relative;
top: 0;
left: 22;
z-index: 1;}       

 .inputFileVal { 
position: relative;
top: 3px;
left: 5px;
z-index: 2;
width: 150px;
background: none;
border: none;}

脚本：

function myelem (value, options) {
                                        var st="<input type='file'/><div class='fonTypeFile'><input type='text' class='inputFileVal' readonly='readonly' id='fileName'/></div>";                                            
                                        var el=$(st);
                                            $(el).change(function () {                                                      
                                                    var val_f=$(el).val();
                                                    $('.inputFileVal').val(val_f);
                                            });
                                        return el;
                                }
                                    function myvalue(elem, operation, value) {
                                        return $(elem).find("input").val();
                                    }
function  for_file(){
                                        $(".fonTypeFile").removeClass("customelement");
                                        var form_offset=$('.FormGrid').offset();
                                        var offset=$('.fonTypeFile').offset();
                                        var left=offset.left-form_offset.left;
                                        var top=offset.top-form_offset.top;
                                        $('.customelement').css({'left':left, 'top':top});
                                    }
$('#words').jqGrid({...}).navGrid('#wordsPager',... {...afterShowForm: function (formid) for_file();    }...});

jqgrid edittype自定义文件

1 个答案: