Upload image issue with use .NET ?

Syed Babar Ali

Html Code

<table cellpadding="0" cellspacing="0" border="0" class="table table-striped table-bordered" id="CR_AT_ATTACHMENT1" width="100%">
    <thead>
    <tr>
        <th>a</th>
        <th>b</th>
        <th>c</th>
        <th>d</th>
        <th>d</th> Image Column
    </tr>
    </thead>
</table>   

Contoller Code

 public class CR_AT_ATTACHMENT1Controller : ApiController
    {
        [Route("api/CR_AT_ATTACHMENT1")]
        [HttpGet]
        [HttpPost]
        public IHttpActionResult CR_AT_ATTACHMENT1()
        {
            var request = HttpContext.Current.Request;
            var settings = Properties.Settings.Default;
            string[] pk = new string[5];
            pk[0] = "CCT_COUNTRYCODE";
            pk[1] = "CCI_CITYCODE";
            pk[2] = "CBR_BRANCHCODE";
            pk[3] = "CSD_SLIPCODE";
            pk[4] = "CIM_IMAGECODE";


            using (var db = new Database(settings.DbType, settings.DbConnection))
            {
                var response = new Editor(db, "CR_AT_ATTACHMENT1", pk)
                     .Where("CCT_COUNTRYCODE", "0001")
                     .Where("CCI_CITYCODE", "0001")
                     .Where("CBR_BRANCHCODE", "0001")
                     .Where("CSD_SLIPCODE", "0000000001")
                    //.Where("CIM_IMAGECODE", "0000000001$1")

                    .Model<CR_AT_ATTACHMENT1>()
                    .Process(request)
                    .Data();

                return Json(response);
            }
        }

Javascript Code

var editor; // use a global for the submit and return data rendering in the CR_AT_ATTACHMENT1s

$(document).ready(function () {
    editor = new $.fn.dataTable.Editor({
        ajax: "/api/CR_AT_ATTACHMENT1",
        table: "#CR_AT_ATTACHMENT1",
        fields: [{
            label: "First name:",
            name: "CCT_COUNTRYCODE"
        }, {
            label: "Last name:",
            name: "CCI_CITYCODE"
        }, {
            label: "Phone #:",
            name: "CBR_BRANCHCODE"
        }, {
            label: "City:",
            name: "CSD_SLIPCODE"
        }
        ,
        {
            label: "Image:",
            name: "image",
            type: "upload",
            display: function (file_id) {
                debugger
                return '<img src="' + editor.file('files', file_id).web_path + '"/>';
            },
            clearText: "Clear",
            noImageText: 'No image'
        }
        ]
    });

    var table = $('#CR_AT_ATTACHMENT1').DataTable({
        dom: "Bfrtip",
        ajax: "/api/CR_AT_ATTACHMENT1",
        columns: [
            { data: "CCT_COUNTRYCODE" },
            { data: "CCI_CITYCODE" },
            { data: "CBR_BRANCHCODE" },
            { data: "CSD_SLIPCODE" }
            ,
            {
                data: "image",
                render: function (file_id) {
                    return file_id ?
                        '<img src="' + editor.file('files', file_id).web_path + '"/>' :
                        null;
                },
                defaultContent: "No image",
                title: "Image"
            }
        ],
        select: true,
        buttons: [
            { extend: "create", editor: editor },
            { extend: "edit", editor: editor },
            { extend: "remove", editor: editor }
        ]
    });
});

SQL Data Comes Single Record

CCT_COUNTRYCODE,CCI_CITYCODE,CBR_BRANCHCODE,CSD_SLIPCODE,image
0001    ,0001   ,0001,  0000000001  ,1

allan

Hi,

Thanks for the code and image. It looks like there isn't any use of the Upload class in the C# code, so the server-side isn't returning any information about the upload, nor does it know what to do with it if a file is uploaded. You need to attach the Upload class to the field you want to use.

Regards,
Allan

Syed Babar Ali

Hi allan thanks to replay

i am confuse how to use upload class
still error is occurring error attach in image file
whole code i have showed previous comments just change in c# code

[Route("api/CR_AT_ATTACHMENT1")]
        [HttpGet]
        [HttpPost]
        public IHttpActionResult CR_AT_ATTACHMENT1()
        {
            var request = HttpContext.Current.Request;
            var settings = Properties.Settings.Default;
            string[] pk = new string[5];
            pk[0] = "CCT_COUNTRYCODE";
            pk[1] = "CCI_CITYCODE";
            pk[2] = "CBR_BRANCHCODE";
            pk[3] = "CSD_SLIPCODE";
            pk[4] = "CIM_IMAGECODE";


            using (var db = new Database(settings.DbType, settings.DbConnection))
            {
                var Image = new Field("image")
                            .Upload(new Upload(request.PhysicalApplicationPath + @"upload\1.jpg"))
                            .SetFormatter(Format.NullEmpty());

                var response = new Editor(db, "CR_AT_ATTACHMENT1", pk)
                                .Field(Image)
                                .Where("CCT_COUNTRYCODE", "0001")
                                .Where("CCI_CITYCODE", "0001")
                                .Where("CBR_BRANCHCODE", "0001")
                                .Where("CSD_SLIPCODE", "0000000001")
                    .Model<CR_AT_ATTACHMENT1>()
                    .Process(request)
                    .Data();

                return Json(response);
            }
        }

allan

I believe that the issue there is that you haven't specified the Db method to get meta information about the file from the database. Therefore there is no way for the client-side to show any information about the class, since nothing has been read about it!

This section details how the upload interaction works.

You might also find the complete example that is available in the .NET download package useful:

            using (var db = new Database(settings.DbType, settings.DbConnection))
            {
                var response = new Editor(db, "users")
                    .Model<UploadModel>()
                    .Field(new Field("image")
                        .SetFormatter(Format.IfEmpty(null))
                        .Upload(new Upload(request.PhysicalApplicationPath + @"uploads\__ID____EXTN__")
                            .Db("files", "id", new Dictionary<string, object>
                            {
                                {"web_path", Upload.DbType.WebPath},
                                {"system_path", Upload.DbType.SystemPath},
                                {"filename", Upload.DbType.FileName},
                                {"filesize", Upload.DbType.FileSize}
                            })
                        )
                    )
                    .Process(request)
                    .Data();

                return Json(response);
            }

Allan

RongYao

Nice. Very nice.