मैं DjqueryUI संवाद बॉक्स के साथ Django को कैसे एकीकृत कर सकता हूं?

Question

मैं jQueryUI संवाद बॉक्स का उपयोग करके अपने Django प्रोजेक्ट पर एक सुविधा जोड़ना चाहता हूं, जहां आप किसी लिंक पर क्लिक करते हैं (जैसे "डिलीट" लिंक) एक jQueryUI संवाद बॉक्स आपको पूछेगा कि क्या आप वास्तव में उस आइटम को हटाना चाहते हैं। फिर यदि आप डिलीट बटन पर क्लिक करते हैं (jQuery संवाद बॉक्स मिला) एक Django फ़ंक्शन डिलीट जॉब करेगा।

तो मैं हटाए गए बटन को कैसे हटा सकता हूं (jQuery संवाद बॉक्स पाया) मेरे विचारों में मिले Django फ़ंक्शन में एक पोस्ट संदेश (संबंधित चर के साथ) भेजता है जो हटाए गए काम को करेगा?

मैं एक view.py फ़ाइल उपयोग कर रहा हूँ (Django में) नीचे के रूप में विचार करें

def deletebook(request,book_id): 
    books=Book.objects.get(pk=book_id) 
    books.delete() 
    return redirect('/index/') 

मेरे आवश्यकता अगर मैं विकल्प को हटाना दबाते हैं, तो immediatly एक पुष्टि डायलॉग इस प्रकार है "हाँ" 2 क्षेत्र के साथ दिखाया जाएगा याँ नहीं"।

कृपया मुझे इसके लिए jQuery के साथ विकसित करने के लिए एक HTML पृष्ठ और view.py पृष्ठ तैयार करने में सहायता करें।

मेरे HTML पेज है

<form action="/deletebook/{{ books.book_id}}/" method="POST"> {% csrf_token %} 
<table> 
    <tr> 
    <td align="right">Book Name :<br><br><br> </td> 
    <td align="left"><input type="text" name="book_name" value="{{books.book_name}}"></input><br><br><br></td> 
    </tr> 
    <tr> 
    <td align="right">Author Name :<br><br><br></td> 
    <td align="left"> <input type="text" name="author_name" value="{{books.author_name}}"></input><br><br><br></td> 
    </tr> 
    <tr> 
    <td align="right">Publisher Name : <br><br><br></td> 
    <td align="left"><input type="text" name="publisher_name" value="{{books.publisher_name}}"></input><br><br><br></td><br><br><br> 
    </tr> 
</table> 
<td><input type="submit" value="Delete"><td> 
</form> 

Answer 1

आप संवाद के लिए div तैयार करना चाहिए:

<div id="dialog"> 
    #some text here 
</div> 

और लिंक जो init खुला संवाद:

<a href='#' onclick='javascript:openDialog()'></a> 

और जे एस openDialog समारोह:

function openDialog(){ 
    $('#dialog').dialog('open'); 
} 

और संवाद परिभाषा:

$("#dialog-form-ajax").dialog({ 
    autoOpen: false, 
    buttons: { 
     "Delete": function() { 
      $.ajax({ 
       #ajax call for delete 
       #with url pointing to your delete function 
      }); 
      $(this).dialog("close"); 
     }, 
     "Cancel": function() { 
      $(this).dialog("close"); 
     } 
    } 
});