Блог

У меня есть asp.net приложение webforms в нем У меня есть HTML-таблица, которая заполняется с помощью ajax-вызова, полученного службой, я хочу преобразовать таблицу в jQuery DataTable и передать данные в datatable, но не смог это сделать, и по щелчку он выдает 2 ошибки в предупреждении (1)является ли «Предупреждение о таблицах данных: идентификатор таблицы = tblnotificationlogHistory — ошибка Ajax. Для получения дополнительной информации об этой ошибке, пожалуйста, смотрите http://datatables.net/tn/7 « и (2) — это «DataTables предупреждение: идентификатор таблицы = tblnotificationlogHistory — невозможно повторно инициализировать DataTable. Для получения дополнительной информации об этой ошибке, пожалуйста, смотрите http://datatables.net/tn/3 «.

Html-код Aspx:

 
    <table id="tblnotificationlogHistory" class="tblnotificationlogHistory table table-bordered"
                                            style="margin: 10px auto; width: 90%;">
                                            <thead>
                                                <tr>
                                                    <th>
                                                        Date
                                                    </th>
                                                    <th class='mainCol'>
                                                        Status
                                                    </th>
                                                    <th>
                                                        Updated By
                                                    </th>
                                                </tr>
                                            </thead>
                                        </table>
    
    <asp:TemplateField HeaderText="Comments" HeaderStyle-CssClass="table-header-repeat">
                                                <ItemTemplate>
                                                    <asp:Label ID="additionalcomments" runat="server" Text='<%# DataBinder.Eval(Container.DataItem,"comments") %>'
                                                        CssClass="commentsHistory"></asp:Label>

JS Code: 
  

 jQuery(".statusname, .commentsHistory").click(function (event) {
                    debugger;
                    var callForCommHistory = (jQuery(this).attr("class") == 'commentsHistory');
                    var ccrsflattenId = jQuery(this).next('._ccrsflattenId').text();
                    var FlattenExtID = jQuery(this).next('._ccrsflattenId').next('._FlattenExtID').text();
                    var webMethod = '/Service/CRService.asmx/GetUnmatchedHistoryStatuses'
                    var parameters = "{ccrsflattenId: "   ccrsflattenId   " , FlattenExtID: "   FlattenExtID   " , isCallForCommHistory: "   callForCommHistory   "}";
                    console.log('parameters: '   parameters);
                    showLoader();
                    jQuery.noConflict();
                    jQuery(".tblnotificationlogHistory").DataTable({
                        paging: false,
                        searching: false,
                        info: false,
                        processing: true,
                        serverside: true,
                        "ajax": {
                        "type": "POST",
                        "url":  "webMethod",
                        "data": "parameters",
                        "contentType": "application/json; charset=utf-8",
                        "dataType" : "json"
                        },
 "columns": [
                    { "data": "createdDate" },
                    { "data": "comments" },
                    { "data": "updatedby" }
                    ]
                    });
                }); 
  

/Service/CRService.asmx/GetUnmatchedHistoryStatuses Код службы:

 
    [WebMethod(EnableSession = true)]
            public string GetUnmatchedHistoryStatuses(string ccrsflattenId, string FlattenExtID, bool isCallForCommHistory = true)
            {
                string daresult = string.Empty;
                try
                {
                    DataSet dataSet = new DataSet();
                    SqlParameterCollection sqlParameterCollection = ClientSessions.GetParameterCollectionConstructor();
    
                    sqlParameterCollection.AddWithValue("@isCommHistory", isCallForCommHistory);
                    if (!string.IsNullOrEmpty(FlattenExtID))
                        sqlParameterCollection.AddWithValue("@rqFlattenExtID", Convert.ToInt32(FlattenExtID));
    
                    if (!string.IsNullOrEmpty(ccrsflattenId))
                        sqlParameterCollection.AddWithValue("@ccrsFlattenExtID", Convert.ToInt32(ccrsflattenId));
    
                    dataSet = CommissionHandler.GetUnmatchedHistory_Statuses(sqlParameterCollection);
    
                    if (dataSet.Tables.Count > 0)
                    {
    
                        daresult = JsonConvert.SerializeObject(dataSet, Formatting.Indented);
                    }
                }
                catch (Exception ex)
                {
                    throw ex;
                }
                return daresu<
            }

Csharp code to hit the stored procedure with parameters passed with the ajax call:

  

 public static DataSet GetUnmatchedHistory_Statuses(SqlParameterCollection collection)
        {
            DataSet ds = new DataSet();
            try
            {
                ds = SqlHelper.ExecuteDataset(ClientSessions.ConnectionString, "CR_GetUnmatchedHistory_Statuses", collection);
            }
            catch (Exception)
            {
                throw;
            }
            if (ds.Tables.Count < 1)
                ds.Tables.Add(new DataTable());

            return ds;
        }
  

Привет, похоже, форматирование в вашем инициализации DataTable неверно, оно должно быть что-то вроде :

 $('#example').DataTable( {
    serverSide: true,
    ajax: {
        url: '/data-source',
        type: 'POST'
    }
} );
  

У вас есть ajax в кавычках, а ваш URL и данные указаны в кавычках, поэтому они не будут ссылаться на переменные JS..

т.е.

  jQuery(".tblnotificationlogHistory").DataTable({
                        paging: false,
                        searching: false,
                        info: false,
                        processing: true,
                        serverside: true,
                        ajax: {
                        type: POST,
                        url:  webMethod,
                        data: parameters,
                        contentType: 'application/json; charset=utf-8',
                        dataType : 'json'
                        },