Отображение документов без обновления страницы

Мне любопытно узнать, можно ли показать docx файл (который доступен на сервере) внутри div без обновления этой страницы (используя API Google Doc Viewer или любым другим возможным способом).

Позвольте мне очистить мое требование: —

HTML + JQUERY код:

  <div class="browse-flie col-md-7">
<div class="alert alert-danger" style = "display:none;"></div>
<input type="file" id="uploaddocfile">
<button name="upload" value="Upload" class="btn EditBtn uplaod_file">Upload</button>
</div>
<div id = "myid" style = "height:500px;width:600px;"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript">
$('.uplaod_file').on('click', function() {
var file_data = $('#uploaddocfile').prop('files')[0];
var ext = file_data.name.split('.').pop();
if(ext == 'docx'){
var form_data = new FormData();
form_data.append('file', file_data);
$.ajax({
url: 'upload.php', // point to server-side PHP script
dataType: 'text',  // what to expect back from the PHP script, if anything
cache: false,
contentType: false,
processData: false,
data: form_data,
type: 'post',
success: function(php_script_response){
var response = $.parseJSON(php_script_response);
if(response.status == 'error'){
$('.alert-danger').css({'display':'block'});
$('.alert-danger').html('file upload failed please try again');
}
if(response.status == 'success'){
$('#myid').html("http://docs.google.com/gview?url=http://loalhost:8888/Grade/uploads/IEP Form-1.docx&embedded=true");
}
}
});
}else{
$('.alert-danger').css({'display':'block'});
$('.alert-danger').html('file extension must be docx'); return false;
}
});
</script>

Код PHP:

<?php

// A list of permitted file extensions
$allowed = array('docx');

//echo "<pre/>";print_r($_FILES); die;

if(isset($_FILES['file']) && $_FILES['file']['error'] == 0){

$extension = pathinfo($_FILES['file']['name'], PATHINFO_EXTENSION);

if(!in_array(strtolower($extension), $allowed)){
echo '{"status":"error"}';
exit;
}

if(move_uploaded_file($_FILES['file']['tmp_name'], 'uploads/'.$_FILES['file']['name'])){
echo '{"status":"success"}';
exit;
}
}

echo '{"status":"error"}';
exit;

Сейчас:

У меня есть простой код загрузки файла через jquery а также php (работает отлично).

Теперь, что я хочу, после загрузки файла, когда он приходит в качестве ответа, я хочу показать документ с использованием API для моего <div id = "myid" style = "height:500px;width:600px;"></div> (без обновления)

Итак, что я попробовал:

$('#myid').html("http://docs.google.com/gview?url=http://loalhost:8888/Grade/uploads/IEP Form-1.docx&embedded=true");

(ссылка была изменена по соображениям безопасности, но на сервере доступен docx, и я могу открыть ее напрямую)

Но, очевидно, это не сработает.

Так как я могу это сделать?

полный код не нужен. Дайте мне знать, если это возможно, я попробую сам.

Примечание: пожалуйста, не предлагайте улучшение кодирования (не имеет значения сейчас, я улучшу это позже).