如何使用jQuery / ajax调用更新在DIV标记内包装的表单

时间:2014-06-24 12:30:38

标签: jquery ajax

我可以使用jQuery / Ajax请求更新完整表单但是如何更新div中包含的某些字段。

例如:

<!------------------------------------------------------------------------->
<div class="update_certain_fields"> 
<table>
<tr>
    <td>Family name</td>
    <td><input type="text" name="fname" id="fname"/></td>
</tr> 
<tr>
    <td>given name</td>
    <td><input type="text" name="gname" id="gname"/></td>
</tr> 
</div>
<!-------------------------------------------------------------------------> 
<tr>
    <td>Email</td>
    <td><input type="text" name="email" id="email"/></td>
</tr> 
<tr>
    <td>Email private</td>
    <td><input type="text" name="pemail" id="pemail"/></td>
</tr>
<tr>
    <td></td>
    <td><input type="submit" name="submit" value="Save Change" id="upload"/></td>
</tr>  
</table>

jQuery的:

$('body').on('click', '#upload', function(e){
    e.preventDefault();
    var formData = new FormData($(this).parents('form')[0]);

    var cid=$('#cdid').val();
    $("#loading-image").show();


    $.ajax({
        url: 'editContactDetails2.php',
        type: 'POST',
        xhr: function() {
            var myXhr = $.ajaxSettings.xhr();
            return myXhr;
        },
        success: function(data){                    
          getDetails(cid);  
          $("#loading-image").hide(); //hide loading          
          $("#success").html(data);
            document.getElementById("all_contact_details").reset();


        },

    //  complete: function(){
     // $("#loading-image").hide(); //hide loading here
    //},

        data: formData,
        cache: false,
        contentType: false,
        processData: false
    });
});    

那么只能更新那些用class=update换行的字段吗?你能举个例子吗?

谢谢。

1 个答案:

答案 0 :(得分:0)

标记存在一些问题:

首先,你的div嵌套是不合适的。

其次,事件,如果您要使用正确的嵌套,div不能在table中,除非它位于td或{{{} 1}}。

第三,请准确定义您的意思&#34;我想更新&#34;否则您在这一代中没有答案。

因此我建议取消div并使用遍历。

th