I newbie here, I try to do some projects on Django (sqlite). In this project, I try to do drag and drop on a webpage. The drag and drop card was made. Then I do with jquery and jquery ui but it doesn't work. I want to drag the card to the zone that I made from . In the have an of building blueprint. the card will drop in the room direction and they stay in the position after drop even though refresh. How should I do?

I have been looking for its solutions but didn't find any help.

Thank you

loop for build card

{% for x in Showinventory%}
            {% if x.Type == 'COMPUTER' and x.current == 'inventory'%}
             <div draggable="true" class="draggable card {% if Current_year|sub:x.comStart < 4 %} bg-success {% elif Current_year|sub:x.comStart == 4%} bg-warning {% else %} bg-danger {% endif %}"  style = " height: 60px; width: 50px" >
                <div>
                      <img src={% static 'img\computer.png'%} width=" 80%" height="80%" data-toggle="popover" data-trigger="hover" title={{x.Type}}  data-content="Number:{{x.comNum}} || S/N:{{x.comSerial}} || Abstract:{{x.comAbsNum}} || Brand:{{x.comBrand}} || Model:{{x.comModel}} || Budget:{{x.comBudget}} || Room:{{x.comRoom}} || Table:{{x.comTable}} || Equip:{{x.upsEquip}} || UPS Number:{{x.upsNum}} || UPS Serial:{{x.upsSerial}} || UPS Abstract:{{x.upsAbsNum}} || UPS Brand:{{x.upsBrand}} || UPS Model:{{x.upeModel}} || UPS Budget:{{x.upsBudget}} || {{x.affair}}">                  
                </div>
             </div>

for dropzone

<div id="blab" class="stabcontent dropzone">
            <div>
              <img src="{% static 'img\floor1\Blabnlift.png' %}" alt="blood" height="100%" width="100%">
            </div>
          </div>