0

Hey so I'm making some software that will have 4 different steps.

  1. load
  2. edit item 1
  3. edit item 2
  4. submit to an online storage

Since item 1 and item 2 are large items to be edited I wanted a separate page. I also wanted a separate page to submit both items so they know it's being submitted and user receives further instructions.

I used to just let it just redirect the user to the next page, but I found it took 2-5 seconds to load each page, and I rather have it a fluid process.

Since Im using electron.js I am using require to load the JS part of the webpages.
But cant find a way to load the HTML and load the JS parts that effect the HTML (JS needs the webpage's DOM).

I've attempted using Jquery but all I accomplished was getting the html in a string format.
Been trying to find a way to use ajax, but so far everywhere I've looked its for including the html into a different html page.

I am new to both Jquery and ajax and just looked at them today. So maybe I am missing something about them. But cannot find any tutorials/documentary for loading another page.

Frustrated programmer
  • 680
  • 8
  • 24
  • Why not load all the html on the first page, but include it in a `
    ` element, and just hide the first page/show the second page when they hit next/submit?
     – Blue Jul 25 '18 at 22:38
  • thats what I am about todo... SO was a last resort for me... I wish I don't have to tho. so I can have seperate css/html files for each "section". (for readability) – Frustrated programmer Jul 25 '18 at 22:42
  • You said you're using `electron.js` right? Why not just use local files, instead of pulling them from a remote server? – Blue Jul 25 '18 at 22:43
  • they are local files. Tho the files are mildly large so it takes a bit to load. – Frustrated programmer Jul 25 '18 at 22:44
  • 2
    How big are these forms? Seems like something crazy if it's taking that long to load a form LOCALLY – Blue Jul 25 '18 at 22:45
  • Well the form is about 30 items to fill. But the JS file attached to it does a lot of `.append`ing As it has a lot of repetition – Frustrated programmer Jul 25 '18 at 22:48
  • There are ***quite a few*** ways to handle this kind of situation. It's not really clear what you have tried, or what your HTML / JavaScript looks like, which makes it hard to offer specific optimizations. Also, if your goal is to get a link to some offsite tutorial, those kind of responses are *strictly off topic*. – Claies Jul 25 '18 at 22:49
  • That's your main issue. You could probably heavily optimize the `.append()` by building it all, and then adding it to the DOM with far less iterations. – Blue Jul 25 '18 at 22:49
  • @Claies yea I know. one of the reasons why SO is a last resort for me. I do not understand why my JS/HTML is important if all I want to do is to run any html file (aka load it) yet not display it. And what I have tried is displayed above (Jquery: string format) (Ajax: appends the html to the current html) – Frustrated programmer Jul 25 '18 at 22:54
  • First of all, JQuery is a DOM Framework, it doesn't "get" data, unless you use it's helper AJAX function, so you are using AJAX in both cases. Secondly, of course JQuery gets a string back from the server, if that's what the server is sending. Thirdly, if your "AJAX without JQuery" solution is appending directly to the HTML, that has to do with the code you wrote (which you seem reluctant to provide an example of). All of this leaves us guessing not just at what you are trying to do, but what might be wrong with your chosen tactic. Making a random guess without enough info isn't helpful. – Claies Jul 25 '18 at 22:59
  • Put another way, an HTML document is just a long string of characters. Browsers see it and handle it in a specific way, but if you are expecting to just receive data that you can manipulate, then you need an API that returns data, not an HTML document. – Claies Jul 25 '18 at 23:03
  • And these comments shouldn't lead you to SO being a last resort. The point here is that creating a clear question is just as important as creating a clear and functional answer. In this case, there is information that you can provide to make the problem you are encountering clearer, and thus easier to answer. We want to help you to help us understand your problem to find a good solution. – Claies Jul 25 '18 at 23:09
  • if all you are trying to do is "preload" the HTML so that it's available when the user clicks a link, have you tried to use `rel="prefetch"`? https://stackoverflow.com/questions/7830675/how-can-i-preload-a-page-using-html5 – Claies Jul 25 '18 at 23:13
  • I think you need to focus on optimizing your website instead of you're current problem so you don't have to go through sketchy workarounds like loading a page within a div – Amit Jul 25 '18 at 23:53

0 Answers0