Create New Objects within container?

#1 · September 30, 2025, 7:22 pm

Need to start out with 2 side by side boxes and duplicate them under each other in a container with scroll bar. this is just not intuitive on how to accomplish this.

Need know how to do this for all objects. might want to have several containers doing this.

Thank you

Example .....

Uploaded files:

You need to login to have access to uploads.

#2 · September 30, 2025, 7:28 pm

@no1g8tor96 can you explain in detail?
Have you checked ng-repeat samples already?

Regards.

#3 · October 1, 2025, 1:22 am

sorry.

where would i find them. I looked at sample programs

#4 · October 1, 2025, 1:25 am

if you look at the first pic it has 2 squares. I want to push a button and have them copy and put under like pic 2. I will then need to put a different letter in them but this needs to repeat up to 80 Times for results. I also want the scroll to come in when it reaches bottom so we can see the past results.

So each time i push a button and do the calculations, it needs to put 2 more boxes under the previous set.

Hope this makes sense

#5 · October 1, 2025, 1:19 pm

@no1g8tor96 there are many different ways to achieve what you want, depending on the circumstances.
Please check the attached sample app.

Regards.

Uploaded files:

You need to login to have access to uploads.

Phil78 has reacted to this post.

#6 · October 1, 2025, 5:04 pm

Luis

I appreciate the sample. Is there a way of doing this with just the scripting language. I dont know HTML and I bought your program because it was supposed to be easy with the scripting language. Im coming from a background in VB6 and Livecode and I really am having a hard time learning this and its frustrating.

It seems if you don't know HTML or Javascript this wont do much more than basic beginner programs. Maybe im wrong.

I dont want to be "that guy" that causes headaches but this is a cool program and I was doing well with Visual Neo Windows but I want to put my programs into a browser and thought this would work for me.

Maybe you could point the newbies to a place on youtube to learn HTML easy.

Thanks so much

#7 · October 1, 2025, 5:36 pm

@no1g8tor96 if you want to create advanced applications you would need at least some knowledge of HTML and CSS (basic one).
JavaScript is useful also for advanced functionalities but not mandatory.
This is a good place to start (in just two or three days you will get the necessary background):

HTML:
https://www.w3schools.com/html/default.asp

CSS:
https://www.w3schools.com/css/default.asp

JavaScript:
https://www.w3schools.com/js/default.asp

Remember you don't need to know everything, just a little bit to understand how everything work together.
VisualNEO Web is much more powerful than VisualNEO Win because it can use most to web technologies.
Also note that AI is a great tool to generate HTML, CSS and JavaScript too.

Regards.

#8 · October 1, 2025, 6:48 pm

Thanks so much. I will start looking at them.

one last question??

[content]<div class='neo-col-6'><div class='blueSquare'>[letter]</div></div><div class='neo-col-6'><div class='redSquare'><div>[letter]</div></div></div>

This is what is being called from the button push. But where are the squares located in the program. Is there a place to define the class?

I guess what i am asking how does it know what squares to draw where? what if I want a small square?

Also...Is there a way to just copy a row of Items and just duplicate them below.

Here is an example. In this video, when you press a button it adds a row of boxes with the data inside and just keeps adding them below for the results. Is this an easy task? I want to create something similar with my own algorithm

https://www.instagram.com/reel/DEFottTPiIN/?igsh=MTNvbWQ3Nnl3cDdpYw==

Thanks so much.

Uploaded files:

You need to login to have access to uploads.

#9 · October 1, 2025, 7:50 pm

Quote from no1g8tor96 on October 1, 2025, 7:50 pm

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Aligned P and B Boxes with Result</title>
  <style>
    body {
      font-family: Arial, sans-serif;
      padding: 20px;
    }

    button {
      padding: 10px 20px;
      margin-right: 10px;
      font-size: 16px;
    }

    #output {
      margin-top: 20px;
    }

    .row {
      display: flex;
      margin-bottom: 8px;
    }

    .box {
      width: 50px;
      height: 40px;
      border: 1px solid #000;
      display: flex;
      align-items: center;
      justify-content: center;
      font-weight: bold;
      color: white;
    }

    .p-box {
      background-color: blue;
    }

    .b-box {
      background-color: red;
    }

    .spacer {
      width: 50px;
      height: 40px;
    }
  </style>
</head>
<body>

  <button onclick="addBox('P')">P</button>
  <button onclick="addBox('B')">B</button>

  <div id="output"></div>

  <script>
    // Declare result variable in global scope
    let result = '';

    function addBox(letter) {
      // Update result with the letter pressed
      result = letter;
      console.log('Result:', result); // You can remove or modify this as needed

      const output = document.getElementById('output');
      const row = document.createElement('div');
      row.className = 'row';

      const leftCell = document.createElement('div');
      const rightCell = document.createElement('div');

      if (letter === 'P') {
        leftCell.className = 'box p-box';
        leftCell.textContent = 'P';
        rightCell.className = 'spacer';
      } else if (letter === 'B') {
        leftCell.className = 'spacer';
        rightCell.className = 'box b-box';
        rightCell.textContent = 'B';
      }

      row.appendChild(leftCell);
      row.appendChild(rightCell);
      output.appendChild(row);
    }
  </script>

</body>
</html>

I created this with ChatGPT that does something similar to what i want. It creates a variable called results when i push the button. How can i assign the "results" variable (or any variable i use in a script) to a usable variable in Visual Neo.

I think im on the right track.

This is getting real cool fast.

Thanks again.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Aligned P and B Boxes with Result</title>
  <style>
    body {
      font-family: Arial, sans-serif;
      padding: 20px;
    }

    button {
      padding: 10px 20px;
      margin-right: 10px;
      font-size: 16px;
    }

    #output {
      margin-top: 20px;
    }

    .row {
      display: flex;
      margin-bottom: 8px;
    }

    .box {
      width: 50px;
      height: 40px;
      border: 1px solid #000;
      display: flex;
      align-items: center;
      justify-content: center;
      font-weight: bold;
      color: white;
    }

    .p-box {
      background-color: blue;
    }

    .b-box {
      background-color: red;
    }

    .spacer {
      width: 50px;
      height: 40px;
    }
  </style>
</head>
<body>

  <button onclick="addBox('P')">P</button>
  <button onclick="addBox('B')">B</button>

  <div id="output"></div>

  <script>
    // Declare result variable in global scope
    let result = '';

    function addBox(letter) {
      // Update result with the letter pressed
      result = letter;
      console.log('Result:', result); // You can remove or modify this as needed

      const output = document.getElementById('output');
      const row = document.createElement('div');
      row.className = 'row';

      const leftCell = document.createElement('div');
      const rightCell = document.createElement('div');

      if (letter === 'P') {
        leftCell.className = 'box p-box';
        leftCell.textContent = 'P';
        rightCell.className = 'spacer';
      } else if (letter === 'B') {
        leftCell.className = 'spacer';
        rightCell.className = 'box b-box';
        rightCell.textContent = 'B';
      }

      row.appendChild(leftCell);
      row.appendChild(rightCell);
      output.appendChild(row);
    }
  </script>

</body>
</html>

I created this with ChatGPT that does something similar to what i want. It creates a variable called results when i push the button. How can i assign the "results" variable (or any variable i use in a script) to a usable variable in Visual Neo.

I think im on the right track.

This is getting real cool fast.

Thanks again.

#10 · October 1, 2025, 8:33 pm

Also, Based on this sample code above. Can you show me how I can go the opposite way and PASS my variable to P and to B based on my own buttons

I think this will show me a lot of what i need to make this happen.

#11 · October 2, 2025, 12:58 pm

@no1g8tor96

But where are the squares located in the program. Is there a place to define the class?

Project > Properties > Styles
https://webhelp.visualneo.com/ProjectMenu.html

Can you show me how I can go the opposite way and PASS my variable to P and to B based on my own buttons

Not sure if I understand your question.
You can populate JavaScript variables from NeoScript and viceversa.

From NeoScript to Javascript:

SetVar [myvar] "Hi!"
BeginJS
  alert($App.myvar);
EndJS

From JavaScript to NeoScript:

BeginJS
   $App.myvar = "Hi!"
EndJS
JsAlert "myvar"

Please take a look at the manual for more information.

#12 · October 2, 2025, 3:39 pm

function addBox(letter) {
      // Update result with the letter pressed
      result = letter;
      console.log('Result:', result); // You can remove or modify this as needed

From above code. I have it create a variable called "Result". I want to use this to populate a variable in Neo (pass the variable from HTML/JS to NEO) so i can use it anywhere in the rest of the program.

Withe ChatGPT its opening my eyes wide. Scary like its reading my mind as im telling it what i want.

Thanks again.

#13 · October 3, 2025, 9:52 am

@no1g8tor96

function addBox(letter) {
      // Update result with the letter pressed
      result = letter;
      // This line will pass the value in JavaScript 'result' variable to NeoScript '[result]' variable.
      $App.result = result;
      console.log('Result:', result); // You can remove or modify this as needed

Also you can try asking to VisualNEO Web GPT:
https://chatgpt.com/g/g-sh4JYOhxx-visualneo-web-expert

Regards.

#14 · October 4, 2025, 5:12 am

well I tried it from the link and it said it knows VisualNeo Web but........you be the judge of that

Step-by-Step in VisualNEO Web

Open VisualNEO Web
- Start a new project (File → New) or open an existing one.
Insert a Text Input
- From the Tool Palette, click on Text Input.
- Draw it on your page.
- With the Text Input selected, go to the Properties Panel and set:
  - Id: test1
  - (Optional) Placeholder text: "Type something...".
Insert a Push Button
- From the Tool Palette, click Push Button.
- Draw it below the text input.
- In the Properties Panel, set:
  - Id: btnHello
  - Caption: "Say Hello".
Add Actions to the Button
- Double-click the button (or switch to the Code tab while it’s selected).
- In the Click event, type this NeoScript code:
  
  SetObjectValue "test1" "Hello World" GetObjectValue "test1" [result]
- This will:
  - Put "Hello World" into the input field.
  - Save the value into a variable named [result].
Test the App
- Click the Run in Browser button (green play icon).
- When you press the button, the text box will show "Hello World" and [result] will be updated.
- You can later use [result] anywhere in your app (for example, show it in an AlertBox, send it to another page, etc.).

Honestly. I told it what I wanted and it wrote a graphical Python App in 10 min with little tinkering and I wont need anything else. This is just taking too long to learn and I dont know HTML and CSS and JavaScript. I tried like hell to learn it. Thanks Luis. Good luck to you.

Create New Objects within container? - Forum

Create New Objects within container?

Step-by-Step in VisualNEO Web

Step-by-Step in VisualNEO Web