i want display .html and .docx file from database into view using mvc

Question

sorry for my english

i am able to retreive the data from in controller and data its on array or binary format; so how can i convert that to recreate html view using ajax

//controller
[HttpPost]
public JsonResult gethtml(int fileId)
{
byte[] bytes;
string fileName, contentType;
string constr = ConfigurationManager.ConnectionStrings["ConString"].ConnectionString;
using (SqlConnection con = new SqlConnection(constr))
{
using (SqlCommand cmd = new SqlCommand())
{
cmd.CommandText = "SELECT Name, Data, ContentType FROM tblFiles WHERE Id=@Id";
cmd.Parameters.AddWithValue("@Id", fileId);
cmd.Connection = con;
con.Open();
using (SqlDataReader sdr = cmd.ExecuteReader())
{
sdr.Read();
bytes = (byte[])sdr["Data"];
contentType = sdr["ContentType"].ToString();
fileName = sdr["Name"].ToString();
}
con.Close();
}
}
JsonResult jsonResult = Json(new { FileName = fileName, ContentType = contentType, Data = bytes });
jsonResult.MaxJsonLength = int.MaxValue;
//here in json result i get data in binary or array for
return jsonResult;
}

/////ajax
function Viewhtml(fileId) {
// console.log(fileId)
$.ajax({
url: '/Home/gethtml',
type: 'POST',
data: { fileId: fileId },
contentType: "application/json; charset=utf-8",
dataType: 'json',
success: function (result) {
console.log(result.data);
question: what code should i write here to display the data on vi9ew

            }  

        });  
    }

Answer 1

Hi @mazhar shaikh ,
From your description, I think you should want to render your word document as html in your browser.
No browser currently has the code needed to render a Word document, depending on your code you need to use the js plugin: docx-preview.js
To implement docx-preview.js, you need a JavaScript file that extends the docx-preview.js JavaScript plugin.
In the Success event handler of the jQuery AJAX function, convert the binary data obtained from the Word file (that is, the BLOB object) into an HTML5 File object.
Finally, initialize the docx-preview.js library options and use the renderAsync function to render the Word file in a Container DIV.

success: function (r) {  
                        //Convert BLOB to File object.  
                        var doc = new File([new Uint8Array(r.Data)], r.ContentType);  
   
                        //If Document not NULL, render it.  
                        if (doc != null) {  
                            //Set the Document options.  
                            var docxOptions = Object.assign(docx.defaultOptions, {  
                                useMathMLPolyfill: true  
                            });  
                            //Reference the Container DIV.  
                            var container = document.querySelector("#word-container");  
   
                            //Render the Word Document.  
                            docx.renderAsync(doc, container, null, docxOptions);  
                        }  
                    }  

Best regards,
Lan Huang

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.