Code Monkey home page Code Monkey logo

Comments (3)

rstaib avatar rstaib commented on May 24, 2024

How does your table configuration look like?

from jquery-bootgrid.

wintermute2014 avatar wintermute2014 commented on May 24, 2024

Hi Rafael,

Table is initialized as follows:

<table id="rc-grid" class="table table-condensed table-hover table-striped">
  <thead>
    <tr>
      <th data-column-id="id" data-type="numeric" data-identifier="true" data-visible="false">ID</th>
      <th data-column-id="customer">Customer</th>
      <th data-column-id="contract">Contract</th>
      <th data-column-id="contract-status">Contract Status</th>
      <th data-column-id="order-type">Order Type</th>
      <th data-column-id="connection">Connection</th>
      <th data-column-id="address">Address</th>
      <th data-column-id="service-type">Service Type</th>
      <th data-column-id="supplier-reference">Supplier Reference</th>
      <th data-column-id="supplier-actual-monthly-cost" data-formatter="samc-link">Supplier Actual Monthly Cost</th>
      <th data-column-id="invoice-amount">Invoice Amount</th>
    </tr>
  </thead>
</table>

In a separate javascript file I have:

$("#rc-grid").bootgrid({
    formatters: {
        "samc-link": function (column, row) {
            return "<a href=\"#\" data-toggle=\"modal\" data-target=\"#reports-contract-modal\" onclick=\"populateReportContractModalFields(" + row["id"] + ")\">" + row["supplier-actual-monthly-cost"] + "</a>";
        }
    }
});

$("#rc-grid").bootgrid("append", [{
    "id": 1,
    "customer": "test customer",
    "contract": "test contract",
    "contract-status": "test status",
    "order-type": "test order type",
    "connection": "test connection",
    "address": "test address",
    "service-type": "test service",
    "supplier-reference": "test supplier reference",
    "supplier-actual-monthly-cost": "$0.00",
    "invoice-amount": "$0.00"
}])

{{ctx.content}}.00 is also displayed in IE when you don't use the append method and just add a row in html for example:

<table id="rc-grid" class="table table-condensed table-hover table-striped">
  <thead>
    <tr>
      <th data-column-id="id" data-type="numeric" data-identifier="true" data-visible="false">ID</th>
      <th data-column-id="customer">Customer</th>
      <th data-column-id="contract">Contract</th>
      <th data-column-id="contract-status">Contract Status</th>
      <th data-column-id="order-type">Order Type</th>
      <th data-column-id="connection">Connection</th>
      <th data-column-id="address">Address</th>
      <th data-column-id="service-type">Service Type</th>
      <th data-column-id="supplier-reference">Supplier Reference</th>
      <th data-column-id="supplier-actual-monthly-cost" data-formatter="samc-link">Supplier Actual Monthly Cost</th>
      <th data-column-id="invoice-amount">Invoice Amount</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>1</td>
      <td>test customer</td>
      <td>test contract</td>
      <td>test status</td>
      <td>test order type</td>
      <td>test connection</td>
      <td>test address</td>
      <td>test service</td>
      <td>test supllier reference</td>
      <td>$0.00</td>
      <td>$0.00</td>
    </tr>
  </tbody>
</table>

In IE
cap

In Chrome
cap2

Hope this was what you're after. Please let me know if you require further information.

Regards,
Ali

from jquery-bootgrid.

rstaib avatar rstaib commented on May 24, 2024

Fixed it!

from jquery-bootgrid.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.