Bootstrap-Table Jquery how to individually edit a column in the event of loading table?

Navigation
-1

Bootstrap-Table Jquery how to individually edit a column in the event of loading table?

I've tried unsuccessfully using the all.bs.table and data-load-success events. 

for(i=0;i < data.length; i++) {
    total_media = parseFloat(total_media)  +  parseFloat(data[i].lucro);
    data[i].lucro = ' test ' + String(data[i].lucro);
    jQuery("#tabela").bootstrapTable('updateRow', {index: i, row:  data[i] });

I tried it too: 

jQuery(data).each(function(i){
    total_media = total_media + parseFloat(data[i].lucro);
    data[i].lucro = 'test ' + String(data[i].lucro);    
    jQuery("#tabela").bootstrapTable('updateRow', {index: i, row:  data[i] });

and so: 

var total_media = data.reduce(function(a, b){
    lucro = b.lucro;
    b.lucro = ' test ' + String(b.lucro);
    jQuery("#tabela").bootstrapTable('updateRow', {index: a, row:  b });
    return a + parseFloat(lucro);
}, 0);

Bootstrap-Table Jquery how to individually edit a column in the event of loading table?

I have tried without success using all.bs.table and data-load-success events. Can you help me?

    
asked by anonymous 23.09.2017 / 06:07

1 answer

0

Simple Rafael.

First you will do a function, which stylizes the column, which will be executed independently if there was a update , insert etc, so come on, I'll give you an example. Imagine that there is a table that lists web projects, and one of the information (columns) of these projects are the plans, and depending on the plan, it will have a different stylization.

First, let's say this column, it will have a function to execute, which will be executed when data is received, for this we use data-formatter="" of Bootstrap Table.

  

NOTE: The value of attr data-formatter will be the name of the function.

Well, after creating the reference in html , we go to Js . we will create a function that receives value, row e index , destá form: function myCustomPlans(value, row, index)

  

NOTE: The functions for formatting the columns should be outside the   function $(document).ready(function(){);

Well, now we just make the logic of styling plans. Something like: 

function myCustomPlans(value, row, index) {
  var content;
  if (value == "eco") {
    content = "<span style='color: #4caf50'>" + value + "</span>";
  } else if (value == "premium") {
    content = "<span style='color: #fbc02d'>" + value + "</span>";
  } else {
    content = "<span style='color: #03a9f4'>" + value + "</span>";
  }
  return content;
}

According to the value that the column will receive, it will be printed with a different color in a span .

With this function styling all the cells of a given column ready, we can perform several inserts and updates normally, because after executing these actions, at the time of printing the content, the data-formatter function will be executed.

I hope I have helped.

    
25.09.2017 / 13:45
C Sharp: error object reference not set to an instance of an object Code hangs the window