2014-10-15 3 views
0

Я хотел бы задать вопрос, и мне нужна небольшая помощь от вас, ребята. Я хотел бы использовать jquery Datatable плагин в моем проекте, но что-то не так. Таблица отображается правильно, но ни одна из функций данных не работает.Функции JQuery datatables не работают

Вот мой код:

function get_answer(get_date, get_id) { 
    var ajaxurl = '<?php echo admin_url('admin-ajax.php'); ?>'; 
    var date = get_date; 
    var id = get_id; 
    var data = { 
     'action': 'get_answers_ajax', 
     'date': date, 
     'id': id 
    }; 

    var table_structure = '<table id="result-' + id + '" class="table table-striped table-hover table-dynamic display"><thead class="result_head"><tr><th></th></tr></thead><tbody class="result_body"><tr><td></td></tr></tbody></table>'; 
    jQuery('#tabs-' + id).append(table_structure); 


    jQuery.post(ajaxurl, data, function (response) { 
     if (response) { 
      var obj = JSON.parse(response); 
      var heads = []; 
      var results = []; 

      jQuery.each(obj, function (key, res) { 
       if (jQuery.inArray(res.label, heads) == '-1') 
       { 
        heads.push(res.label); 
       } 
       results.push(res.value); 
      }); 


      var head = jQuery('#tabs-' + id + ' .result_head tr'); 
      head.empty(); 
      jQuery.each(heads, function (key, value) { 
       head.append('<th>' + value + '</th>'); 
      }); 


      var body = jQuery('#tabs-' + id + ' .result_body'); 
      body.empty(); 
      if (results.length > 0) { 
       body.append('<tr role="row" class="odd">'); // Open tr 
       var count_heads = heads.length; 
       var count_answ = 0; 

       jQuery.each(results, function (key, value) { 
        if (value.substring(0, 4) == 'http') { 
         body.find('tr').last().append('<td><img src="' + value + '" alt="none" width="200px" height="200px" /></td>'); 
        } else { 
         body.find('tr').last().append('<td>' + value + '</td>'); 
        } 

        count_answ++; 
        if ((count_answ % count_heads) == 0) { 
         body.find('tr').last().find('td').last().after('</tr>'); 
         body.find('tr').last().after('<tr role="row" class="even">'); 
        } 
       }); 

       body.find('tr').last().after('</tr>'); // Close tr 
      } 
     } 
    }); 


    jQuery('#result-' + id).dataTable(
      { 
       "ordering": true, 
       "searching": true 
      } 
    ); 

Головы и массив reults выглядит следующим образом:

  • Heads => [ "Eredmény", "Felhasználó", "Datum"]
  • Результаты => ["666", "Wathfea", "2014-10-14 12:55:12", "hdjjdbkudbh", "Zsolti", "2014-10-14 16:44:55", "kfhkfvjhdgh" , "Zsolti", "2014-10-14 17:16:29"]

Моя функция PHP, которая одна возвращает данные, это:

 function get_answers() { 
     global $wpdb; 
     $date = $_POST['date']; 
     $form_id = $_POST['id']; 

     $date_pice = explode(' - ', $date); 
     $question = array(); 
     $answer = array(); 


     $sql_answers = "SELECT lead.date_created, detail.field_number, detail.value, detail.form_id, meta.display_meta FROM wp_rg_lead_detail AS detail INNER JOIN wp_rg_lead AS lead ON detail.lead_id = lead.id INNER JOIN wp_rg_form_meta AS meta ON detail.form_id = meta.form_id WHERE lead.date_created BETWEEN '{$date_pice[0]}' AND '{$date_pice[1]}' AND detail.form_id = '{$form_id}' "; 
     $answers = $wpdb->get_results($sql_answers); 
     foreach ($answers as $ans_info) { 
      $meta = self::bsp_unserialize($ans_info->display_meta); 
      foreach ($meta[fields] as $fields) { 
       if ($fields["id"] == $ans_info->field_number) { 
        $question["kerdes"] = $fields["label"]; 
        $answer["valasz"] = $ans_info->value; 
       } 
      } 
      $toJSON[] = array("label" => $question["kerdes"], "value" => $answer["valasz"]); 
     } 
     echo json_encode($toJSON); 
     die(); 
    } 

Таким образом, таблица показывает все данные в ней, но если я хотел бы найти или заказать или постраничного Nothings работы.

Любой намек на это?

Thx много

+0

Ошибка в консоли? Любой минималистический онлайн-образец, который повторяет вашу проблему? –

+0

К сожалению, я не могу показать полный проект, но я пытаюсь сделать скрипку для него http://jsfiddle.net/075rnzey/ Таким образом, ни одна из функций не работает. – Wathfea

+0

И никаких ошибок в консоли вообще нет. – Wathfea

ответ

0

Я мог бы решить проблему. Я только что модифицировал метод append, и теперь я делаю строку html с готовым элементом html, и я добавляю, что в конце процесса.

jQuery(document).ready(function() { 
var table_structure = '<table id="result" class="table table-striped table-hover table-dynamic display"><thead class="result_head"><tr><th></th></tr></thead><tbody class="result_body"><tr><td></td></tr></tbody></table>'; 

jQuery('#table').append(table_structure); 

var heads = ["Result", "User", "Date"]; 
var results = ["666", "Wathfea", "2014-10-14 12:55:12", "hdjjdbkudbh", "Zsolti", "2014-10-14 16:44:55", "kfhkfvjhdgh", "Zsolti", "2014-10-14 17:16:29"]; 

      jQuery('.result_head tr').empty(); 
      jQuery.each(heads, function (key, value) { 
       jQuery('.result_head tr').append('<th>' + value + '</th>'); 
      }); 


      var body = jQuery('.result_body'); 
      body.empty(); 
      if (results.length > 0) { 
       var count_heads = heads.length; 
       var count_answ = 0; 
       var html = ""; 

       jQuery.each(results, function (key, value) { 

        if ((count_answ % count_heads) === 0) { 
         html += '<tr>'; 
        } 

        if (value.substring(0, 4) == 'http') { 
         html += '<td><img src="' + value + '" alt="none" width="200px" height="200px"/></td>'; 
        } else { 
         html += '<td>' + value + '</td>'; 
        } 
        count_answ++; 

        if ((count_answ % count_heads) === 0) { 
         html += '</tr>'; 
         body.append(html); 
         html = ''; 
        } 

       }); 

      } 


    jQuery('#result').dataTable(
      { 
       "ordering": true, 
       "searching": true 
      } 
    ); 
}); 
Смежные вопросы