CodeIgniter + jQuery .ajax表單在表格行中提交返回結果

我認爲它應該相當容易，我根本無法找到答案。CodeIgniter + jQuery .ajax表單在表格行中提交返回結果

我正在使用Codeigniter進行簡單的CRUD應用程序。它在表格中顯示結果。我所做的是使用jQuery .ajax來提交表單。它工作（幾乎）完美。

我可以提交沒有重新加載的表單，但結果不會顯示，除非我重新加載頁面。現在我使用location.reload();，但它沒有任何意義，畢竟我的意圖是不重新加載頁面。

我知道我應該回顯數據，但不知道如何使用CI來完成。

一些內部：

jQuery的一部分

$("#add_form").submit(function(e) { 
    e.preventDefault(); 
    var dataString = $("#add_form").serialize(); 
    $.ajax({ 
     type: "POST", 
     url: "add", 
     data: dataString, 
     success: function() { 
      $("#lightbox").fadeIn(300).delay(1000).fadeOut(300); 
      $("#notification-box").show(); 
      $("#notification-box").html('<p>Saving</p>'); 
     $("#addrow").hide(); 

     location.reload(); 
     } 

    }); 
});

控制器部分

function add() 
{ 
    if(!$this->ion_auth->logged_in()) 
    { 
     redirect('auth/login', 'refresh'); 
    }else 
    { 
     // User ID 
     $user_data = $this->ion_auth->get_user(); 
     $user = $user_data->id; 

     // Prepare post data 
     $data['user'] = $user; 
     $data['cdate'] = date('Y-m-d'); 
     $data['ctime'] = date('H:i:s'); 
     $data['mdate'] = date('Y-m-d'); 
     $data['mtime'] = date('H:i:s'); 
     $pair_value = $this->input->post('vpair'); 
     if(empty($pair_value)) 
     { 
      $data['pair'] = "no pair"; 
     }else 
     { 
      $data['pair'] = $pair_value; 
     } 

     $reason_value = $this->input->post('reason'); 
     if(empty($reason_value)) 
     { 
      $data['reason'] = ""; 
     }else 
     { 
      $data['reason'] = $reason_value; 
     } 
     $comment_value = $this->input->post('comment'); 
     if(empty($comment_value)) 
     { 
      $data['comment'] = ""; 
     }else 
     { 
      $data['comment'] = $comment_value; 
     } 
     // Insert_data 
     $this->journal_model->add_trade($data); 
    } 
}

幫助？任何人？

乾杯，

來源

2010-09-11 Jacek Dominiak

對於初學者'網址：「添加」，'在你的JS是不是一個好的開始，請告訴我你的控制器名稱，如果你做了Ajax，你不能做重定向，不要這樣工作，請把你的完整控制器。 – RobertPitt 2010-09-11 15:02:13

好吧......它當然可以工作......因爲讀取和添加功能都在同一個控制器中。我用過很多次，從來沒有遇到過問題。 – 2010-09-11 15:08:03

我從來沒有說過它不工作，我指的是你的路徑結構，在你的頭部模板中你應該有一個包含你的site_root的JavaScript變量，然後在js文件中你應該使用'url：site_root +「控制器/ method/param「，」這會給你更多的穩定性。 – RobertPitt 2010-09-11 15:10:31

我不知道你是如何在實際的例子顯示的數據，我對錶其內部標準的HTML表格標記猜測。

我個人會在成功函數中追加一個新的表格行，這樣做（而不是調用reload）讓你的CI add控制器函數在add函數的末尾回顯表格行（這有點兒骯髒，更好的方法是獲得CI返回數據，然後使用視圖格式化 - 但這應該工作）

因此，在添加函數結束時，爲表格行回顯HTML，包括表單中的新值。

在JS更改成功函數將此：

success: function(data) { 
     $("#lightbox").fadeIn(300).delay(1000).fadeOut(300); 
     $("#notification-box").show(); 
     $("#notification-box").html('<p>Saving</p>'); 
     $("#addrow").hide(); 

     if (data != 'error') 
     { 
      $('#tableid').append(data); 
     } 
     else 
     { 
      //handle your error here 
     } 
    }

如果有一個錯誤處理您的形式，回聲「錯誤」和JS可以處理它，你怎麼想，否則將追加新的表格行放在表格上。

來源

2010-09-12 13:41:00

這裏的東西，我寫了一個開發票的應用程序，可以幫助你，而不是傳遞序列化的數據回頁面只是要麼通過使用顯示視圖或控制器功能的整個DOM元素（在我的情況）函數只返回一個數字，我建立了jQuery中HTML將追加到表體likeso：

/* user clicks the button */ 
$('#button_add_item_submit').click(function(event){ 

    /* prevent the page from scrolling to top via the # href */ 
    event.preventDefault(); 

    /* code to grab text input from the dom */ 

    /* ajax post */ 
    $.post('/invoice/index.php/create/add_item',{date:item_date,description:item_description,price:item_price,invoice_id:scraped_id},function(response){ 
     if(response!=''){ 
      /* inject response into the table, i named the table body #invoice_body */ 
      $('#invoice_body').append('<tr id="item_' + response + '"><td>' + item_date + '</td><td>' + item_description + '</td><td>$' + item_price + '.00</td></tr>'); 
     } 
    }); 

});

來源

2010-09-14 04:27:33 user446977

CodeIgniter + jQuery .ajax表單在表格行中提交返回結果

回答

相關問題