Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
G1K777

[Javascript] Why I can't insert the Form element?

Recommended Posts

Posted · Original PosterOP

Hello,

I'm making a small project something like a lib/framework or what ever it might be called.
 

I'm using only Javascript to create HTML objects.

This here creates the whole body.
 

// Create Objects
  const
  header = new Nav("header"),
  nav = new Nav("nav"),
  main = new Element("main"),
  aside = new Element("aside"),
  footer = new Nav("footer");

  // Add nodes to the body element.
  header.init(document.body);
  nav.init(document.body);
  main.init(document.body);
  aside.init(document.body);
  footer.init(document.body);

init() is just an appendChild function with some things...

This here adds a div element into the main element and then adds a span element into the div.
main -> div -> span
 

  // Testing div insert.
  const div = new Element("div");
  div.init(main.node)
  div.add(["span",{class:"hi"}, "hello"]);

So far everything is working.
But now the issue, when I do:
 

  // Testing form
  const signupForm = new Form("signup");
  signupForm.init(main.node);
  // Maybe create labels if first param = "input" ?
  signupForm.add([ ["username"], ["password"], ["email"] ]);

it's not working for some reason. After checking, it says that "this" is not a type of node.

All the code is here:
https://github.com/damiantoczek/frontend/tree/master/main/js

Can anyone help me with it? 


I'm here because Stackoverflow is trash.  ¯\_(ツ)_/¯ Github

Link to post
Share on other sites
Posted · Original PosterOP

Hold on, I'm confused, for some magic reason, it's working ??
I'm SOO CONFUSED why didn't it work before?! what the heck?!


I'm here because Stackoverflow is trash.  ¯\_(ツ)_/¯ Github

Link to post
Share on other sites
Posted · Original PosterOP

#NewProblem

I have a function that creates element nodes by using arrays.
 

// Create a JS element.
// create(["a", { href: "#"}, "myLink"]);
function create(x){
  let element = x[0],
      child = x[1],
      node = document.createElement(element),
      i = 1;

  if (typeof child === "object" && child !== null && !isArray(child)){
    for (let attr in child) node[attr] = child[attr];
    i = 2;
  }

  let l = x.length;
  for (; i < l; i++){
    if( isArray(x[i]) ) node.appendChild( create(x[i]) );
    else node.appendChild( document.createTextNode(x[i]) );
  }

  return node;
}

Everything is working except I can't create an element with a class name.
Like for example:

create(["p", { class: "info" }]);

I can use any attribute, except this class attribute :( How can I fix that ?


I'm here because Stackoverflow is trash.  ¯\_(ツ)_/¯ Github

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now


×