Question

我正在使用jTable进行CRUD操作。但现在我想使用jTable创建对话框窗体上传文件

How do i upload file using jTable create dialog?

<div id="PersonTable" style="width: 580px; margin: auto;"></div>

<script type="text/javascript">

    $(document).ready(function () {

        //Prepare jtable plugin
        $('#PersonTable').jtable({
            title: 'The Campus List',
            actions: {
                listAction: '/Home/CampusList',
                deleteAction: '/Home/DeletePerson',
                updateAction: '/Home/UpdatePerson',
                createAction: '/Home/CreatePerson'
            },
            paging: true,
            fields: {
                CampusId: {
                    key: true,
                    create: false,
                    edit: false,
                    list: true
                },
                CampusName: {
                    title: 'CampusName',
                    width: '15%'
                },
                CampusCode: {
                    title: 'CampusCode',
                    list: true
                },Image: { } // for uploading file
            }
        });

        //Load person list from server
        $('#PersonTable').jtable('load');
    });

</script>

Answer 1

默认情况下，Jquery-JTable没有文件上传字段，但您可以这样使用：

在jtable的字段范围内使用“输入”属性，返回“Div”或fileupload控件

如：

 fields: {
           ,
            Attach: {
               input : function (data){
                return "<input type='file' ...  >"; // OR----->
                return "<asp:FileUpload ....    >" ;// or----->   
               }
          },

但文件上传需要完整回发，文件上传后回复后页面上的所有文本区域都已清理，因此您需要Jquery和iframe用于Ajax上传文件或 jquery插件才能上传它们。你可以使用这个地址来完成它：

How to display an IFRAME inside a jQuery UI dialog

How to make Asynchronous(AJAX) File Upload using iframe?

Issue with jQuery / iframe File Uploading Solution

如何使用Asp.Net MVC中的jTable Create Dialog上传文件？

1 个答案: