用jquery ajax將數據發佈到JSON數組中？

我甚至不知道我的ajax中的錯誤代碼在哪裏，我從互聯網上學習，但仍然無法發佈POST數據。我的html代碼：用jquery ajax將數據發佈到JSON數組中？

<h3>Input new data</h3> 
<form name="contact"> 
    <input type="text" placeholder="id berita" id="idberita" /> 
    <input type="text" placeholder="title berita" id="titleberita" /> 
    <input type="text" placeholder="content berita" id="contentberita" /> 
    <input id="create_at" type="datetime-local"> 
    <button type="submit" id="add-data">add</button> 
</form>

這是我的Ajax代碼：

$('#add-data').on('click', function() { 
    var order = { 
     id  : $idberita.val(), 
     title  : $titleberita.val(), 
     content : $contentberita.val(), 
     create_at : $create_at.val() 
    }; 
    $.ajax({ 
     type : 'POST', 
     url : 'json/student.json', 
     data : order, 
     success: function(newContent) { 
      $orders.append('<li>dataid: '+newData.id+', title:'+newData.title+', content:'+newData.content+', create_at: '+newData.create_at+'</li>'); 
     }, 
     error: function() { 
      alert('error saving data'); 
     } 
    }); 
});

來源

2017-08-29 indodev28

頁面重新加載是因爲表單提交？ – guradio

使用newContent代替newData！成功後 –

頁面重新加載，數據無法輸入，我看着控制檯不顯示任何東西.. @guradio – indodev28

默認情況下，提交表單刷新頁面。 jQuery的event object您的事件處理程序的第一個參數總是通過，所以用它來防止這種行爲：

 $('#add-data').on('click', function(event) { 
      event.preventDefault(); 

       var order = { 
       id: $('#idberita').val(), 
       title: $('#titleberita').val(), 
       content: $('#contentberita').val(), 
       create_at: $('#create_at').val(), 
      }; 


      $.ajax({ 
       type: 'POST', 
       url: 'json/student.json', 
       data: order, 
       success: function(newContent) {  
        $orders.append('<li>dataid: '+newContent.id+', title:'+newContent.title+', content:'+newData.content+', create_at: '+newData.create_at+'</li>'); 
       }, 
       error: function(){ 
        alert('error saving data'); 
       } 
      }); 

     });

來源

2017-08-29 04:09:07

我試過你的建議昂然後頁面不重新加載，但是當輸入數據，我看看控制檯顯示「無法加載資源：服務器響應狀態405（方法不允許）」 – indodev28

您正在使用哪種瀏覽器？ –

谷歌鉻爲瀏覽器 – indodev28

使用.serialize()它會收集表格中的所有數據輸入單元爲一組排列的，你不需要由一個定義

$.ajax({ 
    type: "POST", 
    data: $("#formid").serialize(), 
    url : "your/post/url", 
    success: function(callback){ 
    // success handler 
    }, 
    error: function(){ 
    // error handler 
    } 
})

來源

2017-08-29 04:19:48

用jquery ajax將數據發佈到JSON數組中？

回答

相關問題