Categories
JavaScript Answers

How to match an empty dictionary in JavaScript?

Sometimes, we want to match an empty dictionary in JavaScript.

In this article, we’ll look at how to match an empty dictionary in JavaScript.

How to match an empty dictionary in JavaScript?

To match an empty dictionary in JavaScript, we can use the Object.keys method.

For instance, we write

const isEmpty = (obj) => {
  return Object.keys(obj).length === 0;
};

to define the isEmpty function.

In it, we call Object.keys on object obj to return an array of non-inherited string property keys.

Then we get the length of the array and check if it’s 0 to check if we have an empty object.

Conclusion

To match an empty dictionary in JavaScript, we can use the Object.keys method.

Categories
CSS

How to disable clicking inside div with CSS?

To disable clicking inside div with CSS, we set the pointer-events style to none.

For instance, we write

div#foo {
  pointer-events: none;
}

to set the pointer-events CSS property to none for the div with ID foo. to disable clicking on the div with ID foo.

Categories
JavaScript Answers

How to remove button from Highcharts and JavaScript?

Sometimes, we want to remove button from Highcharts and JavaScript.

In this article, we’ll look at how to remove button from Highcharts and JavaScript.

How to remove button from Highcharts and JavaScript?

To remove button from Highcharts and JavaScript, we can add new buttons.

For instance, we write

const chart = new Highcharts.Chart({
  chart: {
    renderTo: "container",
  },
  credits: {
    enabled: false,
  },
  xAxis: {
    categories: [
      "Jan",
      "Feb",
      "Mar",
      "Apr",
      "May",
      "Jun",
      "Jul",
      "Aug",
      "Sep",
      "Oct",
      "Nov",
      "Dec",
    ],
  },
  series: [
    {
      data: [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
    },
  ],
  exporting: {
    buttons: [
      {
        symbol: "diamond",
        x: -62,
        symbolFill: "#B5C9DF",
        hoverSymbolFill: "#779ABF",
        _titleKey: "printButtonTitle",
        onclick: () => {
          console.log("clicked");
        },
      },
    ],
  },
});

to add the exporting.buttons property to override the default buttons with our own button.

We set the fill with symbolFill and the fill on hover with hoverSymbolFill.

onclick is called when we click on the button.

Conclusion

To remove button from Highcharts and JavaScript, we can add new buttons.

Categories
JavaScript Answers

How to return an array of objects with the JavaScript array map method?

Sometimes, we want to return an array of objects with the JavaScript array map method.

In this article, we’ll look at how to return an array of objects with the JavaScript array map method.

How to return an array of objects with the JavaScript array map method?

To return an array of objects with the JavaScript array map method, we can return an object in the map callback.

For instance, we write

const rockets = [
  { country: "US", launches: 23 },
  { country: "China", launches: 16 },
  { country: "Europe", launches: 7 },
  { country: "India", launches: 4 },
  { country: "Japan", launches: 3 },
];

const launchOptimistic = rockets.map((elem) => {
  const { country, launches } = elem;
  return {
    country,
    launches: launches + 10,
  };
});

console.log(launchOptimistic);

to call rockets.map with a callback that returns an object with the new launches value and the same country value.

Conclusion

To return an array of objects with the JavaScript array map method, we can return an object in the map callback.

Categories
JavaScript Answers

How to disable submit button once it has been clicked with JavaScript?

Sometimes, we want to disable submit button once it has been clicked with JavaScript.

In this article, we’ll look at how to disable submit button once it has been clicked with JavaScript.

How to disable submit button once it has been clicked with JavaScript?

To disable submit button once it has been clicked with JavaScript, we set its disabled property to true.

For instance, we write

<form action="/" method="POST">
  <input name="txt" type="text" required />
  <button id="btn" type="submit">Post</button>
</form>

to add a form.

Then we write

const form = document.querySelector("form");

form.onsubmit = () => {
  const btn = document.getElementById("btn");
  btn.disabled = true;
  btn.innerText = "Posting...";
};

to select the form with querySelector.

Then we set its onsubmit property to a function that disables the button when we click the Post button.

In it, we select the button with getElementById.

Then we set its disabled property to true to disable the button.

Conclusion

To disable submit button once it has been clicked with JavaScript, we set its disabled property to true.