Преобразуйте HTML-таблицу в данные Json и передайте данные вызову ajax в jquery. - PullRequest
Новая
       1

Преобразуйте HTML-таблицу в данные Json и передайте данные вызову ajax в jquery.

0 голосов
/ 25 августа 2018

Я должен преобразовать свою таблицу HTML в данные json и передать ее вызову ajax. Как передать данные json в качестве параметра в ajax. Данные передаются, если значение равнострока не передается, когда она находится в формате json. 

<script type="text/javascript">  
$(document).ready(function () {
            $('#btnSumbitTime').click(function () {        
              $('#result').append(JSON.stringify(makeJsonFromTable('tblSelectTime')))
                $('#result').show()
                alert(JSON.stringify(makeJsonFromTable('tblSelectTime')));
   This is my json data after converting from html table           
var selectedTime = "{[{\"Select\":\"\",\"FromTime\":\"\",\"ToTime\":\"\"},{\"Select\":\"\",\"FromTime\":\"11:02\",\"ToTime\":\"15:02\"}]}";

                $.ajax({
                    type: "POST",
                    url: '../AotuComplete.asmx/GetSeletedTime',
                    data: {SelectedTime: JSON.stringify(selectedTime) },
                    contentType: "application/j-son;charset=UTF-8",
                    dataType: "json",
                    success: function (response) {
                        alert(response.d);
                    }
                })
            })
        });
 </script>

1 Ответ

0 голосов
/ 25 августа 2018

Проверьте следующий фрагмент кода 

function submit(){
  var keys=[], arrayObj=[];
  $("#table thead tr th").each(function(){
    keys.push($(this).html());
  });
  
  $("#table tbody tr").each(function(){
    var obj={}, i=0;
    $(this).children("td").each(function(){
      obj[keys[i]]=$(this).html();
      i++;
    })
    arrayObj.push(obj);
  });
  $('body').append(JSON.stringify({yourObj: arrayObj}));
  return;//remove this line
  $.ajax({
    type: "POST",
    url: your_url,
    data: JSON.stringify({yourObj: arrayObj}),
    contentType: "application/j-son;charset=UTF-8",
    dataType: "json",
    success: function (response) {
       alert(response.d);
    }
  })
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html>
<html>
<head>
</head>

<body>

<table id="table">
  <thead>
    <tr>
      <th>Month</th>
      <th>Savings</th>
      <th>Expence</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>January</td>
      <td>$100</td>
      <td>$100</td>
    </tr>
    <tr>
      <td>February</td>
      <td>$80</td>
      <td>$100</td>
    </tr>
  </tbody>
  <tfoot>
  	<tr>
    	<td colspan="3">
        <button onclick="submit()"> Submit</button>
      </td>
    </tr>
  </tfoot>
</table>
</body>
</html>

Удалите оператор return перед вызовом ajax и измените ajax заявления. Значение json, отображаемое при нажатии кнопки отправки, будет передается как jsonstring в вызове ajax. Вы можете изменить ключ и значения.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...