Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Cannot read property 'insertBefore' of undefined #24

Closed
Meaxis opened this issue Aug 17, 2020 · 9 comments
Closed

Cannot read property 'insertBefore' of undefined #24

Meaxis opened this issue Aug 17, 2020 · 9 comments

Comments

@Meaxis
Copy link

Meaxis commented Aug 17, 2020 •
edited

I wanted to use Sticky Alerts, but I got an error. Here's what I got:
Cannot read property 'insertBefore' of undefined TypeError: Cannot read property 'insertBefore' of undefined
at Object.initStickyAlert

My code:

halfmoon.initStickyAlert({
	content: 'Eeee'+result['message'],
	title: "Error "+result['code']+"!",
	alertType: "alert-danger",
	fillType: "filled-lm",
	hasDismissButton: false,
	timeShown: 10000
});

In my HTML, I have the StickyAlerts.

<!-- Page wrapper -->
	<div class="page-wrapper text-center">
		<!-- This parent container is required -->
  		<div class="sticky-alerts"></div>
@halfmoonui
Copy link
Owner

halfmoonui commented Aug 17, 2020 •
edited

I went over to www.gethalfmoon.com/docs and pasted your code in the browser console. This code:

result = { 'message': 'Not found', 'code': '404' }; halfmoon.initStickyAlert({ content: 'Eeee'+result['message'], title: "Error "+result['code']+"!", alertType: "alert-danger", fillType: "filled-lm", hasDismissButton: false, timeShown: 10000 });

The code worked and a toast was generated. Are you sure you are importing halfmoon.js properly in a script tag?

@ranabirbasu12
Copy link

Could you, maybe share a link of your website (if it has been hosted anywhere)?

@Meaxis
Copy link
Author

Meaxis commented Aug 18, 2020 •
edited

@halfmoonui Yes, I referenced halfmoon.js in the tag of my website. It is correctly loaded as it changes to dark theme on load.
@ranabirbasu12 No, it's still an HTML file. I could put it online if needed.

@Meaxis
Copy link
Author

Meaxis commented Aug 18, 2020

Fixed by referencing Halfmoon at the bottom of the <body> tag.

@Meaxis Meaxis closed this as completed Aug 18, 2020
@MuhsinFatih
Copy link

@Meaxis I tried referencing Halfmoon at the bottom of the tag but I'm still getting the same error. Can you elaborate? I feel like I'm missing something

@Meaxis
Copy link
Author

Meaxis commented Sep 19, 2020

GitHub removed bare HTML tags I think. I referenced halfmoon.js in the <head> element and in the bottom of the body element.

@MuhsinFatih
Copy link

Nevermind! I am incapable of reading the docs! :D
A quick debugging made me realize I'm missing the required sticky-alerts div:

<div class="sticky-alerts"></div>

@Meaxis
Copy link
Author

Meaxis commented Sep 19, 2020

Oh, thought you didn't understand what I said because I mostly read replies in email and comment back on GitHub (so no markdown).

Glad I may have helped!

@MuhsinFatih
Copy link

Ah, hahah no you are right. Initially I was asking for clarification, but turns out I was just missing that div

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@MuhsinFatih @Meaxis @ranabirbasu12 @halfmoonui