I'm still learning Django and there is still a lot of unknown to me.
The problem is that I can't pull the .pdf (or any other format) to be sent by ajax post method to external API. So on the reciving side I only get the string location of the file not the actual file.
I have put the following javascript code in the generic_list_items_subtemplate.html
{% load i18n %}
{% load static %}
{% load common_tags %}
{% load navigation_tags %}
<div class="row">
<div class="col-xs-12">
<h4>
{% if page_obj %}
{% if page_obj.paginator.num_pages != 1 %}
{% blocktrans with page_obj.start_index as start and page_obj.end_index as end and page_obj.paginator.object_list|length as total and page_obj.number as page_number and page_obj.paginator.num_pages as total_pages %}Total ({{ start }} - {{ end }} out of {{ total }}) (Page {{ page_number }} of {{ total_pages }}){% endblocktrans %}
{% else %}
{% blocktrans with page_obj.paginator.object_list|length as total %}Total: {{ total }}{% endblocktrans %}
{% endif %}
{% else %}
{% blocktrans with object_list|length as total %}Total: {{ total }}{% endblocktrans %}
{% endif %}
</h4>
<hr>
<div class="well center-block">
<div class="clearfix">
<div class="pull-right">
<form action="{% url 'common:multi_object_action_view' %}" class="form-multi-object-action" method="get">
{% if object_list %}
{% if not hide_multi_item_actions %}
{% get_multi_item_links_form object_list %}
{% endif %}
{% if multi_item_actions %}
<fieldset style="margin-top: -10px;">
<input class="check-all" type="checkbox"/>
{{ multi_item_form }}
</fieldset>
{% endif %}
{% endif %}
</form>
</div>
</div>
{% if object_list %}
<hr style="border-bottom: 1px solid lightgrey;">
{% endif %}
<div class="row row-items">
{% for object in object_list %}
<div class="{{ column_class|default:'col-xs-12 col-sm-4 col-md-3 col-lg-2' }}">
<div class="panel panel-primary panel-item">
<div class="panel-heading">
<div class="form-group" id="myform">
<div class="checkbox">
<label for="id_indexes_0">
{% if multi_item_actions %}
{% if multi_select_item_properties %}
<input class="form-multi-object-action-checkbox check-all-slave checkbox" type="checkbox" name="properties_{{ object|get_encoded_parameter:multi_select_item_properties }}" />
{% else %}
<input class="form-multi-object-action-checkbox check-all-slave checkbox" type="checkbox" name="{{ object.get_absolute_url }}" />
{% endif %}
{% endif %}
<span style="color: white; word-break: break-all; overflow-wrap: break-word;">
{% if not hide_object %}
{% if main_object %}
{% with object|object_property:main_object as object %}
{% if not hide_link %}<a name="test" href="{{ object.get_absolute_url }}">{{ object }}</a>{% else %}{{ object }}{% endif %}
{% endwith %}
{% else %}
{% if not hide_link %}<a href="{{ object.get_absolute_url }}">{{ object }}</a>{% else %}{{ object }}{% endif %}
{% endif %}
{% endif %}
</span>
</label>
</div>
</div>
</div>
<div class="panel-body">
{% if not hide_columns %}
{% for column in object|get_source_columns %}
<div class="text-center" style="">{% source_column_resolve column=column %}{{ column_result }}</div>
{% endfor %}
{% endif %}
{% for column in extra_columns %}
<div class="text-center"><span class="list-extra-column-label">{{ column.name }}</span>: {{ object|object_property:column.attribute }}</div>
{% endfor %}
{% if not hide_links %}
<p class="text-center">
{% get_menu_links 'object menu' source=object as resolved_links %}
{% for object_navigation_links in resolved_links %}
{% with 'true' as as_dropdown %}
{% include 'navigation/generic_navigation.html' %}
{% endwith %}
{% endfor %}
</p>
{% endif %}
</div>
</div>
</div>
{% empty %}
<div class="col-xs-12">
{% include 'appearance/no_results.html' %}
</div>
{% endfor %}
</div>
<!--</form>-->
{% include 'pagination/pagination.html' %}
</div>
</div>
</div>
<!--{% if object_list %}-->
<form method="post">
{% csrf_token %}
<input type="hidden" name="csrf-token" value="nc98P987bcpncYhoadjoiydc9ajD1cn">
<div class="row">
<div class="col-md-3"></div>
<div class="col-md-3">
<button id="sendBTN" class="btn btn-success" type="submit">Send checked documents to another database</button>
</div>
<div class="col-md-3"></div>
</div>
</form>
<br>
<br>
<br>
<!--{% endif %}-->
<script type="text/javascript">
'use strict';
var $data = [];
$(document).on("click", "input[type='checkbox']", (e) => {
var name = $(e.target).attr("name");
if($(e.target).prop("checked")){
$data.push(name);
}else{
$data = jQuery.grep($data, function(value) {
return value != name;
});
}
console.log($data);
});
function csrfSafeMethod(method)
{
return (/^(GET|HEAD|OPTIONS|TRACE)$/.test(method));
}
$.ajaxSetup({
beforeSend: function (xhr, settings) {
if(!csrfSafeMethod(settings.type) && !this.crossDomain)
{
xhr.setRequestHeader("X-CSRFToken", csrftoken);
}
}
});
document.getElementById("sendBTN").onclick = function() {
var form_data = new FormData();
// form_data.append('file', $('#myform').get(0));
form_data.append('file', $data);
console.log(form_data);
$.ajax({
type: "POST",
// contentType: "application/x-www-form-urlencoded",
contentType : false,
processData: false,
url: "http://192.168.10.22:5000/api/FileRecive/GetDocument",
dataType: "json",
data: form_data,
success: function (data) {
data = $.parseJSON(data);
alert("success");
},
error: function (xhr) {
alert("error - " + xhr.statusText);
}
});
};
$(function() {
$('.row-items > [class*="col"] .panel-item .panel-heading').matchHeight();
$('.row-items > [class*="col"] .panel-item .panel-body').matchHeight();
$('.row-items > [class*="col"] .panel-item').matchHeight();
});
</script>
On the reciving side I am getting
name = "file"
value = "/documents/12/preview/"
But I want to get the file not this string. I have no idea how to target file to send it dirrectly.
