0

JavaScript:

$('.follower_name').click(function () {              
      var id = $(this).attr('id');  
      var csrf_token = $("#csrf_token").val();
      $.ajax({ 
       data:{
            csrfmiddlewaretoken: ('{{csrf_token}}'),                          
            id:id,  
            edit_followup:true              
            },
      type:'POST',
      url: '/setting/edit_follower/',
      success: function(data) {    
      $('#add_form').show();
      $('#add_form').html(data);
     alert(data);
     }
    });
   });

html:

<div id="add_form"  style="display:none" class="edit_follow">
    <form id="form"  method="post" action="edit_follower/{{follower.id}}/"  onsubmit="return form_validate()">
        {% csrf_token %}
        <h2> Follow-up details</h2>
        <br />
        <table  width="100%">
            <tr>
                <td style="width:100px;">First name:</td><td>{{ form.firstname}}</td>
            </tr>
            <tr>
                <td style="width:100px;">Last name:</td><td>{{ form.lastname}}</td>
            </tr>
            <tr>
                <td>Email:</td><td>{{ form.email}}</td>
            </tr>
          </table>
          <div style="width:180px;margin:20px 5px 0 10px" align="right">

            <button style="margin-right:10px;" type="button" class="close" name="cancel" class="forward backicon">                
            Cancel</button>   {% include "buttons/add.html" %}
        </div>
    </form>
</div>

ビュー.py

def edit_follower(request):  
    if request.method == 'POST':
    """"""'
    return HttpResponse(form)

現在、ポップアップは次のように表示されています。

ここに画像の説明を入力

以下のように表示したい

ここに画像の説明を入力

データベースからポップアップ div にデータをロードしています。問題は、ポップアップの html ではなく、フォーム データのみを表示しているだけです。たとえば、ボタンが表示されていません。名フィールドの。

4

2 に答える 2

1

たぶん、このようにしてみてください。PS私はこの分野の専門家ではありません:)

$('.follower_name').click(function () {              
  var id = $(this).attr('id');  
  var csrf_token = $("#csrf_token").val();
  $.ajax({ 
   data:{
        csrfmiddlewaretoken: ('{{csrf_token}}'),                          
        id:id,  
        edit_followup:true              
        },
  type:'POST',
  url: '/setting/edit_follower/',
  success: function(data) {    
  $('#add_form').show();
  $('#add_form').html(
    '<div id="add_form" style="display:none" class="edit_follow">' +
    '<form id="form"  method="post" action="edit_follower/{{follower.id}}/" onsubmit="return form_validate()">' + '{% csrf_token %}' +
    '<h2> Follow-up details</h2>' +
    '<br />' +
    '<table  width="100%">' +
        '<tr>' +
            '<td style="width:100px;">First name:</td><td>{{ form.firstname}}</td>' +
        '</tr>' +
        '<tr>' +
            '<td style="width:100px;">Last name:</td><td>{{ form.lastname}}</td>' +
        '</tr>' +
        '<tr>' +
            '<td>Email:</td><td>{{ form.email}}</td>' +
        '</tr>' +
     '</table>' +
     '<div style="width:180px;margin:20px 5px 0 10px" align="right">' +

     '<button style="margin-right:10px;" type="button" class="close" name="cancel" class="forward backicon">Cancel</button>' +  '{% include "buttons/add.html" %}' +
     '</div>' +
 '</form>' +
'</div>');

 alert(data);
 }
});
});
于 2013-09-07T15:56:30.707 に答える
0

それは以下の行のためです...

$('#add_form').html(data);

この行は、データを HTML として div 内に配置するだけadd_formです。そのため、以前にその div 内にあったものはすべてデータに置き換えられます。

于 2013-09-07T16:00:40.873 に答える