CODEWITHSUNDEEP
javascripthtmlinternet-explorercanvasjs
shv22
shv22

Reputation: 690

IE opening file explorer on href =""

I just ask a question which was basically I was having a problem of z-index which got resolved now. But there is now another problem which I am facing as when I am clicking back button it is working in IE rather it is opening location of the folder where the particular file exists. Is there a special way to go back to an initial position in IE.

My fiddle is at this location - fiddle link

Anyway I posting my code -

<!DOCTYPE HTML>
<html>
<head>
<script src="http://canvasjs.com/assets/script/canvasjs.min.js"></script> 
<!-- <link type='text/css' rel="stylesheet" href='style.css' /> -->
<style>
#chartContainerpie{
  position: absolute;
  top: 130px;
  left: 0px;
}
#chartContainer{
  position: absolute;
  top: 0px;
  left: 0px;
}
#link {
visibility : hidden;
top : 0px;
left : 0px;
 position:relative;
 z-index:100;
}
</style>
<script type="text/javascript">

window.onload = function () {
    var chart = new CanvasJS.Chart("chartContainer", {
  title: {
    text: "My First Chart in CanvasJS"
  },
  backgroundColor: "transparent",
  data: [{
    click: function(e){
       anotherchart();
   },
    // Change type to "doughnut", "line", "splineArea", etc.
    type: "doughnut",
    dataPoints: [{
      label: "apple",
      y: 10
    }, {
      label: "orange",
      y: 15
    }, {
      label: "banana",
      y: 25
    }, {
      label: "mango",
      y: 30
    }, {
      label: "grape",
      y: 28
    }]
  }]
});
chart.render();
var chart = new CanvasJS.Chart("chartContainerpie", {
    backgroundColor: "transparent",
  data: [{
    // Change type to "doughnut", "line", "splineArea", etc.
    indexLabelPlacement: "inside",
    indexLabelFontColor: "white",
    indexLabelFontSize: "14px",
    type: "pie",
    dataPoints: [{
      label: "apple",
      y: 10
    }, {
      label: "orange",
      y: 15
    }, {
      label: "banana",
      y: 25
    }, {
      label: "mango",
      y: 30
    }, {
      label: "grape",
      y: 28
    }]
  }]
});
chart.render();
}
function anotherchart () {
 document.getElementById("chartContainerpie").innerHTML = "";
  document.getElementById("chartContainer").innerHTML = "";
  document.getElementById("link").style.visibility = "visible";
 // alert(  e.dataSeries.type+ ", dataPoint { x:" + e.dataPoint.x + ", y: "+ e.dataPoint.y + " }" );
   var chart = new CanvasJS.Chart("chartContainernew", {
    backgroundColor: "transparent",
  data: [{
    // Change type to "doughnut", "line", "splineArea", etc.
    indexLabelPlacement: "inside",
    indexLabelFontColor: "white",
    indexLabelFontSize: "14px",
    type: "doughnut",
    dataPoints: [{
      label: "apple",
      y: 10
    }, {
      label: "orange",
      y: 15
    }, {
      label: "banana",
      y: 25
    }, {
      label: "mango",
      y: 30
    }, {
      label: "grape",
      y: 28
    }]
  }]
});
chart.render();
}

</script>
</head>
<body>
<div>
  <div id="chartContainerpie" style="height: 188px; width: 100%;"></div>
  <div id="chartContainer" style="height: 400px; width: 100%; "></div>
</div>
<div>
  <a id="link" href="">Back</a>
  <div id="chartContainernew" style="height: 400px; width: 100%; "></div>
</div>
<div>

</div>
</body>
</html>

Upvotes: 0

Views: 87

Answers (1)

Bivek
Bivek

Reputation: 1398

In IE, empty HTML HREF leads to directory listing. For further information, you can refer this link.

Meanwhile you can use

<a id="link" href='#' onclick='location.reload(true); return false;'>Back</a>

This will refresh the page and you will get your old chart back. But there are better ways to do this. Since you are placing one div on another, you can always place one more hidden div which you can show on click while hiding original 2 div.

Upvotes: 2

Related Questions