---
title: "How can I show Bootstrap modal when on click in individual bars in chart.js"  
description: "How can I show Bootstrap modal when on click in individual bars in chart.js"  
author: "Sunil Singh"  
published: 2017-12-01  
updated: 2017-12-04  
canonical: https://www.mindstick.com/forum/34372/how-can-i-show-bootstrap-modal-when-on-click-in-individual-bars-in-chart-js  
category: "jquery"  
tags: ["linq", "jquery", "bootstrap"]  
reading_time: 2 minutes  

---

# How can I show Bootstrap modal when on click in individual bars in chart.js

```
<script type="text/javascript">
    google.charts.load('current', { packages: ['corechart', 'bar'] });
    google.charts.setOnLoadCallback(drawChart);
    function drawChart() {
        var data = '@Html.Raw(Json.Encode(@ViewBag.user))';
        var dt = new google.visualization.DataTable();
        dt.addColumn('string', 'Date');
        dt.addColumn('number', 'User');
        var data = JSON.parse(data);
        $.each(data, function (i, v) {
            dt.addRow([v.Date, v.Total]);
        });
        var options = {
            chart: {
                title: 'Recently Registered User',
                subtitle: 'Count',
            }
        };
        var chart = new google.visualization.ColumnChart(document.getElementById('user'));
        google.visualization.events.addListener(chart, 'select', selectHandler);
        chart.draw(dt, options);
    }
</script>
```

## Replies

### Reply by Anonymous User

you can use this function

```
 function selectHandler() {
            var selectedItem = chart.getSelection()[0];
            if (selectedItem) {
                var val = dt.getValue(selectedItem.row, 0);
                $('#myModal').modal('show');
               // alert('The user selected ' + val);
            }
        }
```

hope this will helps you..


---

Original Source: https://www.mindstick.com/forum/34372/how-can-i-show-bootstrap-modal-when-on-click-in-individual-bars-in-chart-js

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.