Insert data using Jquery

Insert data using Jquery

I try to insert data using Jquery and I textbox and select options
Html

  1. <input type="text" class="input-sm" id="txt_repeat" />
  2. <select id="dura_values">
  3. <option>da(s)</option>
  4. <option>We(s)</option>
  5. </select>


JQUERY

  1. <script type="text/javascript">
  2. $(function () {
  3. $('[ID*=btn_Add]').on('click', function () {
  4. debugger;
  5. var frequency = $('#txt_repeat').val();
  6. var duration = $('#dura_values').val();
  7. debugger;
  8. var obj = {};
  9. obj. frequency= frequency;
  10. obj. duration= duration;
  11. insert(obj);
  12. });
  13. });
  14. });
  15. $(function insert(obj) {
  16. $.ajax({
  17. type: "POST",
  18. url: "Maintenance.aspx/Insert_master_services",
  19. contentType: "application/json;charset=utf-8",
  20. data: "{ frequency:'" + obj. frequency + "', duration:'" + obj. duration+"'}",
  21. success: function (result) {
  22. var insert = JSON.parse(result.d).response;
  23. },
  24. error: function (Error) {
  25. alert(Error);
  26. }
  27. }); 
  28. });
  29. </script>
But problem is how when I insert data successfully then how I display that data in table

  1. <table id="master_table" class="table table-striped table-bordered" style="width: 100%;" cellspacing="0">
  2. <thead></thead>
  3. <tbody></tbody>
  4. </table>
First I manually enter data in datatabse table and I generate table through jquery like this

  1. <script type="text/javascript">
  2. $(function () {
  3. $.ajax({
  4. type: "POST",
  5. url: "Maintenance.aspx/master_Services",
  6. contentType: "application/json;charset=utf-8",
  7. dataType: "json",
  8. success: function (result) {
  9. debugger;
  10. var m = JSON.parse(result.d).response;
  11. debugger;
  12. var master = $('#master_table').DataTable({
  13. "dom": 'Blfrtip',
  14. "columns": [
  15. {
  16. "title": "Frequency",
  17. "title": "Frequency",
  18. "visible":false
  19. },
  20. {
  21. "title": "Freq_Du",
  22. "data": "Freq_Du",
  23. "visible":false,
  24. "render":function(data,type,row)
  25. {
  26. return row.frequency+row.Freq_Du+row.Freq_Mil
  27. }
  28. },
  29. ]
  30. });
  31. debugger;
  32. for(var i=0;i<m.length;i++)
  33. {
  34. if (m[i] !== null)
  35. {
  36. master.row.add({
  37. "frequency": m[i][1],
  38. "Freq_Du": m[i][2],
  39. })
  40. }
  41. }
  42. master.draw();
  43. },
  44. error: function (error) {
  45. debugger;
  46. var r = error.responseText;
  47. var errorMessage = r.Message;
  48. alert(errorMessage);
  49. alert(r);
  50. alert(Error);
  51. }
  52. });
  53. });
  54. </script>