问:
Search MYSQL database with Nodejs page
I´m trying to create a Search box in my website. But I cant get it to work.
I´m using Nodejs and EJS.

I have the HTML form with the action="" and method="" to get the text input email keyword.

Im passing that keyword to the POST route

Im doing the MYSQL query in that route, and Im bringing the result and passing it to the ejs view in the same POST route. (I couldnt find a way to do it in the GET route).

I get an error message saying "data is not defined" and it points to the EJS view. But I dont understand what the error is in the EJS view.

This is my code

perfil.ejs  (this is where the form is)

```<code><div class="cssshowlaptopcampanas" style="font-family: 'Raleway', sans-serif; ">
<div style="display: grid; grid-template-rows: 200px; margin-left: 400px; font-family: 'Raleway', sans-serif; ">
    <div class="" style=" padding-left: 20px; padding-top: 60px;">
        <h5 style="color: black; position: relative; top: 45px;">Busca tus anuncios</h5>
        <div class="container" style="position: relative; left: 20px;">
            <form action="/searchkeyemail" method="POST">
            <div class="search">
                <div class="row">
                    <div class="col-md-10">
                        <div class="search-1">
                            <i class='bx bx-search-alt'></i>
                            <input type="text" placeholder="Digita tu email" name="search" value= " " id="search"  autofocus>
                        </div>
                    </div>
                    <button class="col-md-2" type="submit" style="background-color: #6351ce; color: white; border: none;" >Buscar</button>
                </div>
            </div>
        </form>
        </div>
    </div>
</div>

</code>```

index.js (these are the routes)

```<code>
router.post('/searchkeyemail', async (req, res, next) => {
    const { search } = req.body;
    const newSearch = {
        search: search
     };

    await pool.query("SELECT * FROM clientes WHERE Email LIKE ?", [newSearch], (req, data) => {

    res.render('./perfil', { data: data});

    })
});

router.get('/perfil',  (req, res) => {
    res.render('perfil.ejs' )
});

</code>```

adcards.ejs (this is the EJS view where Im passing the data to)

```<code>
 <div class="cssshowlaptopcampanas">
    <%  if(data.lenght!=0) {
        var i=1;
        data.forEach(function(data) {

          %>
    <div style="display: flex; flex-direction: row;  max-width: 100%; flex-wrap: wrap; margin-left: 400px; font-family: 'Raleway', sans-serif; justify-content: space-around; margin-bottom: 30px; padding-bottom: 30px;">
        <div style="margin: 10px; margin-top: 30px; border-radius: 20px;">
            <span class="badge badge-success" style="width: 100px;"><%= req.data.status %></span>
            <div class="card" style="width: 19rem; border-radius: 20px;">
                <img src="/city2.png" class="card-img-top" alt="..." style=" border-bottom-left-radius: 0px; border-bottom-right-radius: 0px; border-top-right-radius: 20px; border-top-left-radius: 20px;">
                    <div class="card-body">
                            <h5 class="card-title" style="position: relative; top: 7px;"><%= req.data.titulo %></h5>
                    </div>
                        <ul class="list-group list-group-flush">
                            <li class="list-group-item">Fecha inicio: <span style="font-weight: bold;"><%= req.data.fechas %></span>
                            </li>
                            <li class="list-group-item">Mostrando en: <span style="font-weight: bold;"><%= req.data.zonas %></span>
                            </li>
                        </ul>
                        <div class="card-body" style="display: flex; flex-direction: row; justify-content: space-around; background-color: #6351ce; color: white; border-bottom-right-radius: 20px; border-bottom-left-radius: 20px;">
                            <a href="#" class="card-link" style="color: white;">Editar</a>
                        </div>
            </div>
        </div>
    </div>
    <% i++; }) %>
  <% } else { %>

<div class="card border-secondary mb-3" style="max-width: 18rem;">
    <div class="card-header">Oops</div>
    <div class="card-body text-secondary">
      <h5 class="card-title">No anuncios encontrados</h5>
      <p class="card-text">Busca tus anuncios digitando tu correo eletrónico</p>
    </div>
  </div>

    <% } %>

</div>

</code>```

The perfil.ejs file is where the form is and the adcards.ejs file is where Im passing the data to. Im using them as partials in the same main file main.ejs . Not sure if there's an issue with using them in the same file.

I'd appreciate if someone can help me!

Title: Search MYSQL database with Nodejs page

Body:
I´m trying to create a Search box in my website. But I cant get it to work.
I´m using Nodejs and EJS.

I have the HTML form with the action="" and method="" to get the text input email keyword.

Im passing that keyword to the POST route

Im doing the MYSQL query in that route, and Im bringing the result and passing it to the ejs view in the same POST route. (I couldnt find a way to do it in the GET route).

I get an error message saying "data is not defined" and it points to the EJS view. But I dont understand what the error is in the EJS view.

This is my code

perfil.ejs  (this is where the form is)

Busca tus anuncios

            <form action="/searchkeyemail" method="POST">

                            <input type="text" placeholder="Digita tu email" name="search" value= " " id="search"  autofocus>

                    <button class="col-md-2" type="submit" style="background-color: #6351ce; color: white; border: none;" >Buscar</button>

        </form>

index.js (these are the routes)

router.post('/searchkeyemail', async (req, res, next) => {
    const { search } = req.body;
    const newSearch = {
        search: search
     };

    await pool.query("SELECT * FROM clientes WHERE Email LIKE ?", [newSearch], (req, data) => {

    res.render('./perfil', { data: data});

    })
});

router.get('/perfil',  (req, res) => {
    res.render('perfil.ejs' )
});

adcards.ejs (this is the EJS view where Im passing the data to)

    <%  if(data.lenght!=0) {
        var i=1;
        data.forEach(function(data) {

          %>

            <%= req.data.status %>

<%= req.data.titulo %>

Fecha inicio: <%= req.data.fechas %>

Mostrando en: <%= req.data.zonas %>

                            Editar

    <% i++; }) %>
  <% } else { %>

Oops

No anuncios encontrados

Busca tus anuncios digitando tu correo eletrónico

    <% } %>

The perfil.ejs file is where the form is and the adcards.ejs file is where Im passing the data to. Im using them as partials in the same main file main.ejs . Not sure if there's an issue with using them in the same file.

I'd appreciate if someone can help me!


来源: stackexchange

问:
docker container does not have ansible installed as specified in Dockerfile
I am trying to build an image using a dockerfile that has ansible installed. However when I start the container and try to get Ansible verion I get bash: ansible: command not found.

This is my dockerfile

```<code>
FROM centos:centos7.7.1908

RUN  yum check-update; \
   yum install -y gcc libffi-devel python3 epel-release; \
   yum install -y openssh-clients; \
   yum install -y sshpass; \
   yum clean all; \
   pip3 install --upgrade pip

RUN pip3 install "ansible==2.9.12"; \
   pip3 install boto; \
   pip3 install boto3; \
   pip3 install "pywinrm>=0.3.0"

</code>```

I used docker build -t ansible:latest .
It does have pywinrm, boto and boto3

```<code>[root@7dbc2587a975 /]# pip3 list
Package            Version
------------------ ---------
boto               2.49.0
boto3              1.23.10
botocore           1.26.10
certifi            2022.9.24
cffi               1.15.1
charset-normalizer 2.0.12
cryptography       38.0.4
idna               3.4
jmespath           0.10.0
ntlm-auth          1.5.0
pip                21.3.1
pycparser          2.21
python-dateutil    2.8.2
pywinrm            0.4.3
requests           2.27.1
requests-ntlm      1.1.0
s3transfer         0.5.2
setuptools         39.2.0
six                1.16.0
urllib3            1.26.13
xmltodict          0.13.0

</code>```

I tried to remove all images
docker rmi ansible

Edit: final docker file which seems to work:

```<code>FROM centos:centos7.7.1908

ENV LANG=en_US.UTF-8
ENV LC_ALL=en_US.UTF-8

RUN  yum check-update; \
   yum install -y gcc libffi-devel python3 epel-release; \
   yum install -y openssh-clients; \
   yum install -y sshpass; \
   yum clean all; \
   pip3 install --upgrade pip

RUN pip3 install "ansible==2.9.12" && \
   pip3 install boto && pip3 install boto3 && pip3 install "pywinrm>=0.3.0"
</code>```

ContentLicense: CC BY-SA 4.0

Body:
I am trying to build an image using a dockerfile that has ansible installed. However when I start the container and try to get Ansible verion I get bash: ansible: command not found.

This is my dockerfile

FROM centos:centos7.7.1908

RUN  yum check-update; \
   yum install -y gcc libffi-devel python3 epel-release; \
   yum install -y openssh-clients; \
   yum install -y sshpass; \
   yum clean all; \
   pip3 install --upgrade pip

RUN pip3 install "ansible==2.9.12"; \
   pip3 install boto; \
   pip3 install boto3; \
   pip3 install "pywinrm>=0.3.0"

I used docker build -t ansible:latest .
It does have pywinrm, boto and boto3

[root@7dbc2587a975 /]# pip3 list
Package            Version
------------------ ---------
boto               2.49.0
boto3              1.23.10
botocore           1.26.10
certifi            2022.9.24
cffi               1.15.1
charset-normalizer 2.0.12
cryptography       38.0.4
idna               3.4
jmespath           0.10.0
ntlm-auth          1.5.0
pip                21.3.1
pycparser          2.21
python-dateutil    2.8.2
pywinrm            0.4.3
requests           2.27.1
requests-ntlm      1.1.0
s3transfer         0.5.2
setuptools         39.2.0
six                1.16.0
urllib3            1.26.13
xmltodict          0.13.0

I tried to remove all images
docker rmi ansible

Edit: final docker file which seems to work:

FROM centos:centos7.7.1908

ENV LANG=en_US.UTF-8
ENV LC_ALL=en_US.UTF-8

RUN  yum check-update; \
   yum install -y gcc libffi-devel python3 epel-release; \
   yum install -y openssh-clients; \
   yum install -y sshpass; \
   yum clean all; \
   pip3 install --upgrade pip

RUN pip3 install "ansible==2.9.12" && \
   pip3 install boto && pip3 install boto3 && pip3 install "pywinrm>=0.3.0"


问:
Limit items in a shopping list using malloc()?
I am struggling with the function that should add items to a shopping list. I wrote code that works, but I am wondering if there is another way to limit items to 5 by using malloc()?

The length field should always be containing the index to the last position of the array, so this is where the item should be placed. For instance, length is zero when the list is empty,

So the first time this function is called, the item should be placed at index zero in list->itemArray.

This function is also responsible for increasing the length of the list.

Since we just added one item, the list is now one item longer.

Just remember that it should not be possible to add more than 5 items to the list.

```<code>#ifndef SHOPPING_LIST_H
#define SHOPPING_LIST_H

// Struct definitions

struct GroceryItem
{
    char productName[20];
    float amount;
    char unit[10];
};

struct ShoppingList
{
    int length;
    struct GroceryItem itemList[5];
};

// Function declarations

void addItem(struct ShoppingList *list);
void printList(struct ShoppingList *list);
void editItem(struct ShoppingList *list);
void removeItem(struct ShoppingList *list);
void saveList(struct ShoppingList *list);
void loadList(struct ShoppingList* list);

#endif
</code>```
```<code>#define _CRT_SECURE_NO_WARNINGS
#include<stdio.h>
#include "ShoppingList.h"

int main(void)
{
    struct ShoppingList shoppingList;
    shoppingList.length = 0; // The shopping list is empty at the start

    int option;

    do
    {
        printf("\n\nWelcome to the shopping list manager!\n");
        printf("=====================================\n\n");

        printf("1. Add an item\n");
        printf("2. Display the shopping list\n");
        printf("3. Remove an item\n");
        printf("4. Change an item\n");
        printf("5. Save list\n");
        printf("6. Load list\n");
        printf("7. Exit\n");

        printf("What do you want to do? ");
        scanf("%d", &option);

        switch (option)
        {
        case 1: addItem(&shoppingList); break;
        case 2: printList(&shoppingList); break;
        case 3: removeItem(&shoppingList); break;
        case 4: editItem(&shoppingList); break;
        case 5: saveList(&shoppingList); break;
        case 6: loadList(&shoppingList); break;
        case 7: break;
        default:
            printf("Please enter a number between 1 and 7");
        }
    } while (option != 7);

    return 0;
}
</code>```
```<code>#define _CRT_SECURE_NO_WARNINGS
#include"ShoppingList.h"
#include<stdio.h>
#include<stdlib.h> // For malloc() and free()

/*

The “length” field should always be containing the index to the last position of the array,
so this is where the item should be placed. For instance, length is zero when the list is empty,
so the first time this function is called, the item should be placed at index zero in list->itemArray.

This function is also responsible for increasing the length of the list.
Since we just added one item, the list is now one item longer.
Just remember that it should not be possible to add more than 5 items to the list.

   */

void addItem(struct ShoppingList* list)
{
    if (list->length > 4)
    {
        return 0;
    }

    printf("Name for product: ");
    scanf("%s", list->itemList[list->length].productName);

    do
    {
        printf("Enter the amount: ");
        scanf("%f", &list->itemList[list->length].amount);

        if (list->itemList[list->length].amount <= 0.0)
        {
            printf("Input is invalid.\n");
        }

    } while (list->itemList[list->length].amount <= 0.0);

    printf("Enter unit of item: ");
    scanf("%s", list->itemList[list->length].unit);

    printf("%s was added to the shoppinglist.", list->itemList[list->length].productName);

    list->length++;
}

</code>```

Body:
I am struggling with the function that should add items to a shopping list. I wrote code that works, but I am wondering if there is another way to limit items to 5 by using malloc()?

The length field should always be containing the index to the last position of the array, so this is where the item should be placed. For instance, length is zero when the list is empty,

So the first time this function is called, the item should be placed at index zero in list->itemArray.

This function is also responsible for increasing the length of the list.

Since we just added one item, the list is now one item longer.

Just remember that it should not be possible to add more than 5 items to the list.

#ifndef SHOPPING_LIST_H
#define SHOPPING_LIST_H

// Struct definitions

struct GroceryItem
{
    char productName[20];
    float amount;
    char unit[10];
};

struct ShoppingList
{
    int length;
    struct GroceryItem itemList[5];
};

// Function declarations

void addItem(struct ShoppingList *list);
void printList(struct ShoppingList *list);
void editItem(struct ShoppingList *list);
void removeItem(struct ShoppingList *list);
void saveList(struct ShoppingList *list);
void loadList(struct ShoppingList* list);

#endif

#define _CRT_SECURE_NO_WARNINGS
#include<stdio.h>
#include "ShoppingList.h"

int main(void)
{
    struct ShoppingList shoppingList;
    shoppingList.length = 0; // The shopping list is empty at the start

    int option;

    do
    {
        printf("\n\nWelcome to the shopping list manager!\n");
        printf("=====================================\n\n");

        printf("1. Add an item\n");
        printf("2. Display the shopping list\n");
        printf("3. Remove an item\n");
        printf("4. Change an item\n");
        printf("5. Save list\n");
        printf("6. Load list\n");
        printf("7. Exit\n");

        printf("What do you want to do? ");
        scanf("%d", &option);

        switch (option)
        {
        case 1: addItem(&shoppingList); break;
        case 2: printList(&shoppingList); break;
        case 3: removeItem(&shoppingList); break;
        case 4: editItem(&shoppingList); break;
        case 5: saveList(&shoppingList); break;
        case 6: loadList(&shoppingList); break;
        case 7: break;
        default:
            printf("Please enter a number between 1 and 7");
        }
    } while (option != 7);

    return 0;
}

#define _CRT_SECURE_NO_WARNINGS
#include"ShoppingList.h"
#include<stdio.h>
#include<stdlib.h> // For malloc() and free()

/*

The “length” field should always be containing the index to the last position of the array,
so this is where the item should be placed. For instance, length is zero when the list is empty,
so the first time this function is called, the item should be placed at index zero in list->itemArray.

This function is also responsible for increasing the length of the list.
Since we just added one item, the list is now one item longer.
Just remember that it should not be possible to add more than 5 items to the list.

   */

void addItem(struct ShoppingList* list)
{
    if (list->length > 4)
    {
        return 0;
    }

    printf("Name for product: ");
    scanf("%s", list->itemList[list->length].productName);

    do
    {
        printf("Enter the amount: ");
        scanf("%f", &list->itemList[list->length].amount);

        if (list->itemList[list->length].amount <= 0.0)
        {
            printf("Input is invalid.\n");
        }

    } while (list->itemList[list->length].amount <= 0.0);

    printf("Enter unit of item: ");
    scanf("%s", list->itemList[list->length].unit);

    printf("%s was added to the shoppinglist.", list->itemList[list->length].productName);

    list->length++;
}


问:
Trying askopenfilename() inside button command results in either signal 5: SIGTRAP or signal 11: SIGSEGV
```<code>def efileinp(root):
    global inp
    global inp_text
    global key
    global keyinp
    global file_path
    inp_text = ""
    root.withdraw()
    file_path = askopenfilename(title="Select file", filetypes=(("Text files", ".txt"),))
    filetxt = open(file_path, 'rb')
    inp_text = filetxt.readlines()[0].decode("utf-8")
    key = keyinp.get()
    root.destroy()
    print(inp_text)
</code>```

I am calling efileinp with a button created outside which is packed in a Tkinter window called root which I am also passing in the same function but whenever i reach the askopenfile() it results in the above mentioned interrupts

Also, there is a 1 in 5 chance that the askopenfilename randomly works and code completes smoothly without any hitches. I have tried adding root.update() and parent=root parameter inside askopenfilename function but that has not solved it either. Also, I am using Pycharm with python 3.11 on macOS 13.0 (m1)

Body:
def efileinp(root):
    global inp
    global inp_text
    global key
    global keyinp
    global file_path
    inp_text = ""
    root.withdraw()
    file_path = askopenfilename(title="Select file", filetypes=(("Text files", ".txt"),))
    filetxt = open(file_path, 'rb')
    inp_text = filetxt.readlines()[0].decode("utf-8")
    key = keyinp.get()
    root.destroy()
    print(inp_text)

I am calling efileinp with a button created outside which is packed in a Tkinter window called root which I am also passing in the same function but whenever i reach the askopenfile() it results in the above mentioned interrupts

Also, there is a 1 in 5 chance that the askopenfilename randomly works and code completes smoothly without any hitches. I have tried adding root.update() and parent=root parameter inside askopenfilename function but that has not solved it either. Also, I am using Pycharm with python 3.11 on macOS 13.0 (m1)


问:
How to add Image where cursor is active inside React Quilbot
I'm using the very basic version of React quill bot like below

```<code>
import React,{useState} from 'react';
import TextEditor from '../common/TextEditor';

function PageEdit(props) {
    const [value, setValue] = useState('This is the value intially');

    console.log("value", value)

    return (
        <div className='horizontal--center' style={{width:"50vw"}}>

            <TextEditor value={value} setValue={setValue}/>
        </div>
    );
}

export default PageEdit;

</code>```
```<code>import React, { useState } from 'react';
import ReactQuill from 'react-quill';
import 'react-quill/dist/quill.snow.css';

function TextEditor({value, setValue}) {

    const modules = {
        // #3 Add "image" to the toolbar
        toolbar: [["bold", "italic", "image"]],
    }

    return (
     <ReactQuill theme="snow" value={value} onChange={setValue} modules={modules} />
      );
}

export default TextEditor;

</code>```

I want to add an image at a specific point(where the cursor is active), using a button that calls an external api. Any way to achieve this?

Body:
I'm using the very basic version of React quill bot like below

import React,{useState} from 'react';
import TextEditor from '../common/TextEditor';

function PageEdit(props) {
    const [value, setValue] = useState('This is the value intially');

    console.log("value", value)

    return (

            <TextEditor value={value} setValue={setValue}/>

    );
}

export default PageEdit;

import React, { useState } from 'react';
import ReactQuill from 'react-quill';
import 'react-quill/dist/quill.snow.css';

function TextEditor({value, setValue}) {

    const modules = {
        // #3 Add "image" to the toolbar
        toolbar: [["bold", "italic", "image"]],
    }

    return (
     <ReactQuill theme="snow" value={value} onChange={setValue} modules={modules} />
      );
}

export default TextEditor;

I want to add an image at a specific point(where the cursor is active), using a button that calls an external api. Any way to achieve this?


问:
How to make a modular, nested dropdown menu that can be added to?
I'm making a website from scratch and am trying to make a nested dropdown menu system.

But currently, it's very cobbled together and I can't add more menus to it without the entire thing falling apart. Is there some simple methodology to this that I'm missing?

In addition to "Armor, Harnesses, Fields" I want to add "Melee" and "Ranged" who, in turn, have their own submenus.

Here is my code. HTML, CSS, and Javascript.

        <button class="subnavbtn">Armor </button>

        <select name="lightArmor" id="lightArmor" onChange="createSelectEAL()">
        <option value=" ">Light Armor(select one)</option>
        <option value="1">Standard-Issue Combat Armour</option>
        <option value="2">Light-Weave Coat</option>
        <option value="3">Skirmisher Suit</option>
        <option value="4">Drakeling-Class Protector</option>
        <option value="5">Spectre Armour</option>
        <option value="6">Quicksilver Nanosuit</option>
        </select>
        <select name="mediumtArmor" id="mediumArmor" onChange="createSelectEAM()">
        <option value=" ">Medium Armor(select one)</option>
        <option value="7">Red Crystal Coat</option>
        <option value="8">Safetree-Core Suit</option>
        <option value="9">Basic Infantry Armour</option>
        <option value="10">GUTS Defender</option>
        <option value="11">Avenger Armour</option>
        <option value="12">Valkyrie Aerial Combat Suit</option>
        </select>
        <select name="heavyArmor" id="heavyArmor" onChange="createSelectEAH()">
        <option value=" ">Heavy Armor(select one)</option>
        <option value="13">Heavy-Duty Ceramic</option>
        <option value="14">Dragon Scale Mail</option>
        <option value="15">PRIDE Armour</option>
        <option value="16">Hao Reborn Exosuit</option>
        <option value="17">INVICTUS</option>
        <option value="18">Garm Infantry-Class Power Armor</option>
        </select>

        <button class="subnavbtn">Harnesses </button>

        <select name="harness" id="harness" onChange="createSelectEH()">
        <option value=" ">(select one)</option>
        <option value="bareeh">Bare Emitter Harness</option>
        <option value="threadedh">Threaded Harness</option>
        <option value="jacketede">Jacketed Emitter</option>
        <option value="emitterp">Emitter Prototype</option>
        <option value="portablesg">Portable Shield Generator</option>
        </select>

        <button class="subnavbtn">Fields </button>

        <select name="kineticS" id="kineticS" onChange="createSelectKF()">
        <option value=" ">Kinetic(select one)</option>
        <option value=1>"Vest" Low-Grade Force Field, Slots: 1</option>
        <option value=2>"Kite" Low-Grade Force Field, Slots: 1</option>
        <option value=3>"Warden" Standard-Grade Force Field, Slots: 2</option>
        <option value=4>"Target" Standard-Grade Force Field, Slots: 2</option>
        <option value=5>"Kevlar" Mid-Grade Force Field, Slots: 3</option>
        <option value=6>"Tower" Mid-Grade Force Field, Slots: 3</option>
        <option value=7>"Knight" High-Grade Force Field, Slots: 4</option>
        <option value=8>"Riot" High-Grade Force Field, Slots: 4</option>
        <option value=9>"Concrete" Great-Grade Force Field, Slots: 5</option>
        <option value=10>"Deflector" Great-Grade Force Field, Slots: 5</option>
        <option value=11>"Stonewall" Heavy-Grade Force Field, Slots: 6</option>
        <option value=12>"Aegis" Heavy-Grade Force Field, Slots: 6</option>
        </select>
        <select name="energyS" id="energyS" onChange="createSelectEF()">
        <option value=" ">Energy(select one)</option>
        <option value=1>"Curtain" Light Shield, Slots: 1</option>
        <option value=2>"Buckler" Light Shield, Slots: 1</option>
        <option value=3>"Trooper" Standard Shield, Slots: 2</option>
        <option value=4>"Disc" Standard Shield, Slots: 2</option>
        <option value=5>"Diversion" Medium Shield, Slots: 3</option>
        <option value=6>"Mirror" Medium Shield, Slots: 3</option>
        <option value=7>"Blank" High Shield, Slots: 4</option>
        <option value=8>"Pool" High Shield, Slots: 4</option>
        <option value=9>"Limiter" Great Shield, Slots: 5</option>
        <option value=10>"Sky Catcher" Great Shield, Slots: 5</option>
        <option value=11>"Fractal" Heavy Shield, Slots: 6</option>
        <option value=12>"Blast Barrier" Heavy Shield, Slots: 6</option>
        </select>

```
</div>
</div>
</p>
<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-css lang-css prettyprint-override"><code> /* The navigation menu */
  .navbar {
    overflow: hidden;
    background-color:#00008b;
    border-radius: 4px;
    width: 390px;
  }

  /* Navigation links */
  .navbar p {
    float: left;
    font-size: 16px;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    border-radius: 4px;
  }

  /* The subnavigation menu */
  .subnav {
    float: left;
    overflow: hidden;
    border-radius: 4px;
  }

  /* Subnav button */
  .subnav .subnavbtn {
    border: none;
    outline: none;
    padding: 14px 16px;
    background-color: inherit;
    font-family: inherit;
    margin: 0;
    border-radius: 4px;
  }

  /* Add a grey background color to navigation links on hover */
  .navbar p:hover, .subnav:hover, .subnavbtn {
    background-color: grey;
    border-radius: 4px;
  }

  /* Style the subnav content - positioned absolute */
  .subnav-content {
    display: none;
    position: absolute;
    left: 70px;
    background-color: grey;
    width: 25%;
    border-radius: 4px;
  }

  /* Style the subnav links */
  .subnav-content p {
    float: left;
    border-radius: 4px;
  }

  /* Add a grey background color on hover */
  .subnav-content p:hover {
    background-color: #eee;
    color: black;
  }

  /* When you move the mouse over the subnav container, open the subnav content */
  .subnav:hover .subnav-content {
    display: block;
  }</code>```

//EQUIPMENT
function createSelectEH() {
  var field = document.getElementById("harness");

  if (field.options[field.selectedIndex].text == "Bare Emitter Harness") {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nBare Emitter Harness - Passive(2), 4/4 HP, Heavy(4), Bubble/Directed Slot: 1\n`;
  } else if (field.options[field.selectedIndex].text == "Threaded Harness") {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nThreaded Harness - Passive(2), 4/4 HP, Heavy(8), Bubble/Directed Slot: 2\n`;
  } else if (field.options[field.selectedIndex].text == "Jacketed Emitter") {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nJacketed Emitter - Passive(2), 4/4 HP, Heavy(12), Bubble Slot: 3\n`;
  } else if (field.options[field.selectedIndex].text == "Emitter Prototype") {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nEmitter Prototype - Passive(2), 4/4 HP, Heavy(16), Bubble Slot: 4\n`;
  } else {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nPortable Shield Generator - Passive(2), 4/4 HP, Heavy(20), Bubble Slot: 5\n`;
  }
}

function createSelectEAL() {
  var larmor = document.getElementById("lightArmor");

  if (larmor.options[larmor.selectedIndex].value == 1) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nStandard-Issue Combat Armour:  Passive 4, 10/10 HP, Resist Energy (3)\n`;
  } else if (larmor.options[larmor.selectedIndex].value == 2) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nLight-Weave Coat: Passive 5,  12/12 HP, Resist Energy (3)\n`;
  } else if (larmor.options[larmor.selectedIndex].value == 3) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nSkirmisher Suit: Passive 6, 14/14 HP, Resist Energy (3)\n`;
  } else if (larmor.options[larmor.selectedIndex].value == 4) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nDrakeling-Class Protector: Passive 7, 16/16 HP, Energy Resist (4), Vacuum-Sealed\n`;
  } else if (larmor.options[larmor.selectedIndex].value == 5) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nSpectre Armour: Passive 8, 18/18 HP, Resist Energy (4),  Chameleon (4), Vacuum-Sealed\n`;
  } else {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nQuicksilver Nanosuit: Passive 9, 20/20 HP, Resist Energy (4), Healing (20),  Chameleon (4), Vacuum-Sealed\n`;
  }
}

function createSelectEAM() {
  var marmor = document.getElementById("mediumArmor");
  if (marmor.options[marmor.selectedIndex].value == 7) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nRed Crystal Coat : Passive 5, 16 / 16 HP, Resist Energy(3)\n`;
  } else if (marmor.options[marmor.selectedIndex].value == 8) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nSafetree - Core Suit : Passive 7, 17 / 17 HP, Resist Energy(3)\n`;
  } else if (marmor.options[marmor.selectedIndex].value == 9) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nBasic Infantry Armour : Passive 9, 18 / 18 HP, Resist Energy(2), Resist Kinetic(2)\n`;
  } else if (marmor.options[marmor.selectedIndex].value == 10) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nGUTS Defender : Passive 10, 20 / 20 HP, Resist Energy(3), Resist Kinetic(3), Heavy(4), Vacuum - Sealed\n`;
  } else if (marmor.options[marmor.selectedIndex].value == 11) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nAvenger Armour : Passive 10, 22 / 22 HP, Resist Energy(3), Resist Kinetic(3), Heavy(4), Plating, Vacuum - Sealed\n`;
  } else {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nValkyrie Aerial Combat Suit : Passive 10, 24 / 24, Winged(4), Resist Energy(3), Resist Kinetic(3), Heavy(4), Plating, Vacuum - Sealed\n`;
  }
}

function createSelectEAH() {
  var harmor = document.getElementById("heavyArmor");
  if (harmor.options[harmor.selectedIndex].value == 13) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nHeavy-Duty Ceramic: Passive 7, 10/10 HP, Resist Kinetic (5), Heavy (4), Plated, Vacuum-Sealed\n`;
  } else if (harmor.options[harmor.selectedIndex].value == 14) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nDragon Scale Mail: Passive 9, 15/15 HP, Resist Kinetic (5), Heavy (6), Plated, Vacuum-Sealed\n`;
  } else if (harmor.options[harmor.selectedIndex].value == 15) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nPRIDE Armour: Passive 11, 20/20 HP, Resist Kinetic (5), Heavy (8), Strength-Boost (3), Plated, Vacuum-Sealed\n`;
  } else if (harmor.options[harmor.selectedIndex].value == 16) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nHao Reborn Exosuit: Passive 13, 25/25 HP, Resist Kinetic (5), Heavy (10), Strength-Boost (6), Plated, Vacuum-Sealed\n`;
  } else if (harmor.options[harmor.selectedIndex].value == 17) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nINVICTUS: Passive 15, 30/30 HP, Resist Kinetic (5), Heavy (10), Strength-Boost (6), Plated, Vacuum-Sealed\n`;
  } else {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nGarm Infantry-Class Power Armor: Passive 17, 40/40, Resist Kinetic (5), Heavy(12), Plated, Strength-Boost(6), Vacuum-Sealed\n`;
  }
}

function createSelectKF() {
  var kfield = document.getElementById("kineticS");
  if (kfield.options[kfield.selectedIndex].value == 1) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Vest" Low-Grade Force Field - 10/10 KHP, Regeneration(10), Kinetic Resistance(5), Bubble, Slots: 1\n`;
  } else if (kfield.options[kfield.selectedIndex].value == 2) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Kite" Low-Grade Force Field - 14/14 KHP, Regeneration(14), Kinetic Resistance(7), Directed(Arm), Slots: 1`;
  } else if (kfield.options[kfield.selectedIndex].value == 3) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Warden" Standard-Grade Force Field - 14/14 KHP, Regeneration(26), Kinetic Resistance(5), Bubble, Slots: 2
\n`;
  } else if (kfield.options[kfield.selectedIndex].value == 4) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Target" Standard-Grade Force Field - 19/19 KHP, Regeneration(35), Kinetic Resistance(8), Directed(Arm), Slots: 2
\n`;
  } else if (kfield.options[kfield.selectedIndex].value == 5) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Kevlar" Mid-Grade Force Field - 18/18 KHP, Regeneration(42), Kinetic Resistance(6), Bubble, Slots: 3
\n`;
  } else if (kfield.options[kfield.selectedIndex].value == 6) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Tower" Mid-Grade Force Field - 24/24 KHP, Regeneration(56), Kinetic Resistance(8), Directed(Arm), Slots: 3
\n`;
  } else if (kfield.options[kfield.selectedIndex].value == 7) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Knight" High-Grade Force Field - 22/22 KHP, Regeneration(58), Kinetic Resistance(7), Bubble, Slots: 4\n`;
  } else if (kfield.options[kfield.selectedIndex].value == 8) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Riot" High-Grade Force Field - 29/29 KHP, Regeneration(77), Kinetic Resistance(8), Directed(Arm), Slots: 4\n`;
  } else if (kfield.options[kfield.selectedIndex].value == 9) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Concrete" Great-Grade Force Field - 26/26 KHP, Regeneration(74), Kinetic Resistance(8), Bubble, Slots: 5\n`;
  } else if (kfield.options[kfield.selectedIndex].value == 10) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Deflector" Great-Grade Force Field - 35/35 KHP, Regeneration(98), Kinetic Resistance(9), Directed(Arm), Slots: 5\n`;
  } else if (kfield.options[kfield.selectedIndex].value == 11) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Stonewall" Heavy-Grade Force Field - 30/30 KHP, Regeneration(90), Kinetic Resistance(8), Bubble, Slots: 6\n`;
  } else {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Aegis" Heavy-Grade Force Field - 40/40 KHP, Regeneration(120), Kinetic Resistance(10), Directed(Arm), Slots: 6\n`;
  }
}

function createSelectEF() {
  var efield = document.getElementById("energyS");
  if (efield.options[efield.selectedIndex].value == 1) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Curtain" Light Shield - 12/12 EHP, Regeneration(12), Energy Resistance(6), Bubble, Slots: 1\n`;
  } else if (efield.options[efield.selectedIndex].value == 2) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Buckler" Light Shield - 16/16 EHP, Regeneration(16), Energy Resistance(8), Directed(Arm), Slots: 1`;
  } else if (efield.options[efield.selectedIndex].value == 3) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Trooper" Standard Shield - 19/19 EHP, Regeneration(29), Energy Resistance(8), Bubble, Slots: 2\n`;
  } else if (efield.options[efield.selectedIndex].value == 4) {
    document.querySelector(".equipment").innerHTML += `\n"Disc" Standard Shield
- 24/24 EHP, Regeneration(36) Energy Resistance(10), Directed(Arm), Slots: 2\n`;
  } else if (efield.options[efield.selectedIndex].value == 5) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Diversion" Medium Shield - 26/26 EHP, Regeneration(46), Energy Resistance(10), Bubble, Slots: 3\n`;
  } else if (efield.options[efield.selectedIndex].value == 6) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Mirror" Medium Shield - 32/32 EHP, Regeneration(56), Energy Resistance(12), Directed(Arm), Slots: 3\n`;
  } else if (efield.options[efield.selectedIndex].value == 7) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Blank" High Shield - 33/33 EHP, Regeneration(63), Energy Resistance(10), Bubble, Slots: 4\n`;
  } else if (efield.options[efield.selectedIndex].value == 8) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Pool" High Shield- 40/40 EHP, Regeneration(76), Energy Resistance(14), Directed(Arm), Slots: 4\n`;
  } else if (efield.options[efield.selectedIndex].value == 9) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Limiter" Great Shield - 40/40 EHP, Regeneration(80), Energy Resistance(12), Bubble, Slots: 5\n`;
  } else if (efield.options[efield.selectedIndex].value == 10) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Sky Catcher" Great Shield - 60/60 EHP, Regeneration(100), Energy Resistance(15), Directed(Arm), Slots: 5\n`;
  } else if (efield.options[efield.selectedIndex].value == 11) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Fractal" Heavy Shield - 50/50 EHP, Regeneration(80), Energy Resistance(12), Bubble, Slots: 6\n`;
  } else {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Blast Barrier" Heavy Shield - 70/70 EHP, Regeneration(120), Energy Resistance(15), Directed(Arm), Slots: 6\n`;
  }
}```

Body:
I'm making a website from scratch and am trying to make a nested dropdown menu system.

But currently, it's very cobbled together and I can't add more menus to it without the entire thing falling apart. Is there some simple methodology to this that I'm missing?

In addition to "Armor, Harnesses, Fields" I want to add "Melee" and "Ranged" who, in turn, have their own submenus.

Here is my code. HTML, CSS, and Javascript.

        <button class="subnavbtn">Armor </button>

        <select name="lightArmor" id="lightArmor" onChange="createSelectEAL()">
        <option value=" ">Light Armor(select one)</option>
        <option value="1">Standard-Issue Combat Armour</option>
        <option value="2">Light-Weave Coat</option>
        <option value="3">Skirmisher Suit</option>
        <option value="4">Drakeling-Class Protector</option>
        <option value="5">Spectre Armour</option>
        <option value="6">Quicksilver Nanosuit</option>
        </select>
        <select name="mediumtArmor" id="mediumArmor" onChange="createSelectEAM()">
        <option value=" ">Medium Armor(select one)</option>
        <option value="7">Red Crystal Coat</option>
        <option value="8">Safetree-Core Suit</option>
        <option value="9">Basic Infantry Armour</option>
        <option value="10">GUTS Defender</option>
        <option value="11">Avenger Armour</option>
        <option value="12">Valkyrie Aerial Combat Suit</option>
        </select>
        <select name="heavyArmor" id="heavyArmor" onChange="createSelectEAH()">
        <option value=" ">Heavy Armor(select one)</option>
        <option value="13">Heavy-Duty Ceramic</option>
        <option value="14">Dragon Scale Mail</option>
        <option value="15">PRIDE Armour</option>
        <option value="16">Hao Reborn Exosuit</option>
        <option value="17">INVICTUS</option>
        <option value="18">Garm Infantry-Class Power Armor</option>
        </select>

        <button class="subnavbtn">Harnesses </button>

        <select name="harness" id="harness" onChange="createSelectEH()">
        <option value=" ">(select one)</option>
        <option value="bareeh">Bare Emitter Harness</option>
        <option value="threadedh">Threaded Harness</option>
        <option value="jacketede">Jacketed Emitter</option>
        <option value="emitterp">Emitter Prototype</option>
        <option value="portablesg">Portable Shield Generator</option>
        </select>

        <button class="subnavbtn">Fields </button>

        <select name="kineticS" id="kineticS" onChange="createSelectKF()">
        <option value=" ">Kinetic(select one)</option>
        <option value=1>"Vest" Low-Grade Force Field, Slots: 1</option>
        <option value=2>"Kite" Low-Grade Force Field, Slots: 1</option>
        <option value=3>"Warden" Standard-Grade Force Field, Slots: 2</option>
        <option value=4>"Target" Standard-Grade Force Field, Slots: 2</option>
        <option value=5>"Kevlar" Mid-Grade Force Field, Slots: 3</option>
        <option value=6>"Tower" Mid-Grade Force Field, Slots: 3</option>
        <option value=7>"Knight" High-Grade Force Field, Slots: 4</option>
        <option value=8>"Riot" High-Grade Force Field, Slots: 4</option>
        <option value=9>"Concrete" Great-Grade Force Field, Slots: 5</option>
        <option value=10>"Deflector" Great-Grade Force Field, Slots: 5</option>
        <option value=11>"Stonewall" Heavy-Grade Force Field, Slots: 6</option>
        <option value=12>"Aegis" Heavy-Grade Force Field, Slots: 6</option>
        </select>
        <select name="energyS" id="energyS" onChange="createSelectEF()">
        <option value=" ">Energy(select one)</option>
        <option value=1>"Curtain" Light Shield, Slots: 1</option>
        <option value=2>"Buckler" Light Shield, Slots: 1</option>
        <option value=3>"Trooper" Standard Shield, Slots: 2</option>
        <option value=4>"Disc" Standard Shield, Slots: 2</option>
        <option value=5>"Diversion" Medium Shield, Slots: 3</option>
        <option value=6>"Mirror" Medium Shield, Slots: 3</option>
        <option value=7>"Blank" High Shield, Slots: 4</option>
        <option value=8>"Pool" High Shield, Slots: 4</option>
        <option value=9>"Limiter" Great Shield, Slots: 5</option>
        <option value=10>"Sky Catcher" Great Shield, Slots: 5</option>
        <option value=11>"Fractal" Heavy Shield, Slots: 6</option>
        <option value=12>"Blast Barrier" Heavy Shield, Slots: 6</option>
        </select>

 /* The navigation menu */
  .navbar {
    overflow: hidden;
    background-color:#00008b;
    border-radius: 4px;
    width: 390px;
  }

  /* Navigation links */
  .navbar p {
    float: left;
    font-size: 16px;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    border-radius: 4px;
  }

  /* The subnavigation menu */
  .subnav {
    float: left;
    overflow: hidden;
    border-radius: 4px;
  }

  /* Subnav button */
  .subnav .subnavbtn {
    border: none;
    outline: none;
    padding: 14px 16px;
    background-color: inherit;
    font-family: inherit;
    margin: 0;
    border-radius: 4px;
  }

  /* Add a grey background color to navigation links on hover */
  .navbar p:hover, .subnav:hover, .subnavbtn {
    background-color: grey;
    border-radius: 4px;
  }

  /* Style the subnav content - positioned absolute */
  .subnav-content {
    display: none;
    position: absolute;
    left: 70px;
    background-color: grey;
    width: 25%;
    border-radius: 4px;
  }

  /* Style the subnav links */
  .subnav-content p {
    float: left;
    border-radius: 4px;
  }

  /* Add a grey background color on hover */
  .subnav-content p:hover {
    background-color: #eee;
    color: black;
  }

  /* When you move the mouse over the subnav container, open the subnav content */
  .subnav:hover .subnav-content {
    display: block;
  }

//EQUIPMENT
function createSelectEH() {
  var field = document.getElementById("harness");

  if (field.options[field.selectedIndex].text == "Bare Emitter Harness") {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nBare Emitter Harness - Passive(2), 4/4 HP, Heavy(4), Bubble/Directed Slot: 1\n`;
  } else if (field.options[field.selectedIndex].text == "Threaded Harness") {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nThreaded Harness - Passive(2), 4/4 HP, Heavy(8), Bubble/Directed Slot: 2\n`;
  } else if (field.options[field.selectedIndex].text == "Jacketed Emitter") {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nJacketed Emitter - Passive(2), 4/4 HP, Heavy(12), Bubble Slot: 3\n`;
  } else if (field.options[field.selectedIndex].text == "Emitter Prototype") {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nEmitter Prototype - Passive(2), 4/4 HP, Heavy(16), Bubble Slot: 4\n`;
  } else {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nPortable Shield Generator - Passive(2), 4/4 HP, Heavy(20), Bubble Slot: 5\n`;
  }
}

function createSelectEAL() {
  var larmor = document.getElementById("lightArmor");

  if (larmor.options[larmor.selectedIndex].value == 1) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nStandard-Issue Combat Armour:  Passive 4, 10/10 HP, Resist Energy (3)\n`;
  } else if (larmor.options[larmor.selectedIndex].value == 2) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nLight-Weave Coat: Passive 5,  12/12 HP, Resist Energy (3)\n`;
  } else if (larmor.options[larmor.selectedIndex].value == 3) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nSkirmisher Suit: Passive 6, 14/14 HP, Resist Energy (3)\n`;
  } else if (larmor.options[larmor.selectedIndex].value == 4) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nDrakeling-Class Protector: Passive 7, 16/16 HP, Energy Resist (4), Vacuum-Sealed\n`;
  } else if (larmor.options[larmor.selectedIndex].value == 5) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nSpectre Armour: Passive 8, 18/18 HP, Resist Energy (4),  Chameleon (4), Vacuum-Sealed\n`;
  } else {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nQuicksilver Nanosuit: Passive 9, 20/20 HP, Resist Energy (4), Healing (20),  Chameleon (4), Vacuum-Sealed\n`;
  }
}

function createSelectEAM() {
  var marmor = document.getElementById("mediumArmor");
  if (marmor.options[marmor.selectedIndex].value == 7) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nRed Crystal Coat : Passive 5, 16 / 16 HP, Resist Energy(3)\n`;
  } else if (marmor.options[marmor.selectedIndex].value == 8) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nSafetree - Core Suit : Passive 7, 17 / 17 HP, Resist Energy(3)\n`;
  } else if (marmor.options[marmor.selectedIndex].value == 9) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nBasic Infantry Armour : Passive 9, 18 / 18 HP, Resist Energy(2), Resist Kinetic(2)\n`;
  } else if (marmor.options[marmor.selectedIndex].value == 10) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nGUTS Defender : Passive 10, 20 / 20 HP, Resist Energy(3), Resist Kinetic(3), Heavy(4), Vacuum - Sealed\n`;
  } else if (marmor.options[marmor.selectedIndex].value == 11) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nAvenger Armour : Passive 10, 22 / 22 HP, Resist Energy(3), Resist Kinetic(3), Heavy(4), Plating, Vacuum - Sealed\n`;
  } else {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nValkyrie Aerial Combat Suit : Passive 10, 24 / 24, Winged(4), Resist Energy(3), Resist Kinetic(3), Heavy(4), Plating, Vacuum - Sealed\n`;
  }
}

function createSelectEAH() {
  var harmor = document.getElementById("heavyArmor");
  if (harmor.options[harmor.selectedIndex].value == 13) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nHeavy-Duty Ceramic: Passive 7, 10/10 HP, Resist Kinetic (5), Heavy (4), Plated, Vacuum-Sealed\n`;
  } else if (harmor.options[harmor.selectedIndex].value == 14) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nDragon Scale Mail: Passive 9, 15/15 HP, Resist Kinetic (5), Heavy (6), Plated, Vacuum-Sealed\n`;
  } else if (harmor.options[harmor.selectedIndex].value == 15) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nPRIDE Armour: Passive 11, 20/20 HP, Resist Kinetic (5), Heavy (8), Strength-Boost (3), Plated, Vacuum-Sealed\n`;
  } else if (harmor.options[harmor.selectedIndex].value == 16) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nHao Reborn Exosuit: Passive 13, 25/25 HP, Resist Kinetic (5), Heavy (10), Strength-Boost (6), Plated, Vacuum-Sealed\n`;
  } else if (harmor.options[harmor.selectedIndex].value == 17) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nINVICTUS: Passive 15, 30/30 HP, Resist Kinetic (5), Heavy (10), Strength-Boost (6), Plated, Vacuum-Sealed\n`;
  } else {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\nGarm Infantry-Class Power Armor: Passive 17, 40/40, Resist Kinetic (5), Heavy(12), Plated, Strength-Boost(6), Vacuum-Sealed\n`;
  }
}

function createSelectKF() {
  var kfield = document.getElementById("kineticS");
  if (kfield.options[kfield.selectedIndex].value == 1) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Vest" Low-Grade Force Field - 10/10 KHP, Regeneration(10), Kinetic Resistance(5), Bubble, Slots: 1\n`;
  } else if (kfield.options[kfield.selectedIndex].value == 2) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Kite" Low-Grade Force Field - 14/14 KHP, Regeneration(14), Kinetic Resistance(7), Directed(Arm), Slots: 1`;
  } else if (kfield.options[kfield.selectedIndex].value == 3) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Warden" Standard-Grade Force Field - 14/14 KHP, Regeneration(26), Kinetic Resistance(5), Bubble, Slots: 2
\n`;
  } else if (kfield.options[kfield.selectedIndex].value == 4) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Target" Standard-Grade Force Field - 19/19 KHP, Regeneration(35), Kinetic Resistance(8), Directed(Arm), Slots: 2
\n`;
  } else if (kfield.options[kfield.selectedIndex].value == 5) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Kevlar" Mid-Grade Force Field - 18/18 KHP, Regeneration(42), Kinetic Resistance(6), Bubble, Slots: 3
\n`;
  } else if (kfield.options[kfield.selectedIndex].value == 6) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Tower" Mid-Grade Force Field - 24/24 KHP, Regeneration(56), Kinetic Resistance(8), Directed(Arm), Slots: 3
\n`;
  } else if (kfield.options[kfield.selectedIndex].value == 7) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Knight" High-Grade Force Field - 22/22 KHP, Regeneration(58), Kinetic Resistance(7), Bubble, Slots: 4\n`;
  } else if (kfield.options[kfield.selectedIndex].value == 8) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Riot" High-Grade Force Field - 29/29 KHP, Regeneration(77), Kinetic Resistance(8), Directed(Arm), Slots: 4\n`;
  } else if (kfield.options[kfield.selectedIndex].value == 9) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Concrete" Great-Grade Force Field - 26/26 KHP, Regeneration(74), Kinetic Resistance(8), Bubble, Slots: 5\n`;
  } else if (kfield.options[kfield.selectedIndex].value == 10) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Deflector" Great-Grade Force Field - 35/35 KHP, Regeneration(98), Kinetic Resistance(9), Directed(Arm), Slots: 5\n`;
  } else if (kfield.options[kfield.selectedIndex].value == 11) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Stonewall" Heavy-Grade Force Field - 30/30 KHP, Regeneration(90), Kinetic Resistance(8), Bubble, Slots: 6\n`;
  } else {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Aegis" Heavy-Grade Force Field - 40/40 KHP, Regeneration(120), Kinetic Resistance(10), Directed(Arm), Slots: 6\n`;
  }
}

function createSelectEF() {
  var efield = document.getElementById("energyS");
  if (efield.options[efield.selectedIndex].value == 1) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Curtain" Light Shield - 12/12 EHP, Regeneration(12), Energy Resistance(6), Bubble, Slots: 1\n`;
  } else if (efield.options[efield.selectedIndex].value == 2) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Buckler" Light Shield - 16/16 EHP, Regeneration(16), Energy Resistance(8), Directed(Arm), Slots: 1`;
  } else if (efield.options[efield.selectedIndex].value == 3) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Trooper" Standard Shield - 19/19 EHP, Regeneration(29), Energy Resistance(8), Bubble, Slots: 2\n`;
  } else if (efield.options[efield.selectedIndex].value == 4) {
    document.querySelector(".equipment").innerHTML += `\n"Disc" Standard Shield
- 24/24 EHP, Regeneration(36) Energy Resistance(10), Directed(Arm), Slots: 2\n`;
  } else if (efield.options[efield.selectedIndex].value == 5) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Diversion" Medium Shield - 26/26 EHP, Regeneration(46), Energy Resistance(10), Bubble, Slots: 3\n`;
  } else if (efield.options[efield.selectedIndex].value == 6) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Mirror" Medium Shield - 32/32 EHP, Regeneration(56), Energy Resistance(12), Directed(Arm), Slots: 3\n`;
  } else if (efield.options[efield.selectedIndex].value == 7) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Blank" High Shield - 33/33 EHP, Regeneration(63), Energy Resistance(10), Bubble, Slots: 4\n`;
  } else if (efield.options[efield.selectedIndex].value == 8) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Pool" High Shield- 40/40 EHP, Regeneration(76), Energy Resistance(14), Directed(Arm), Slots: 4\n`;
  } else if (efield.options[efield.selectedIndex].value == 9) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Limiter" Great Shield - 40/40 EHP, Regeneration(80), Energy Resistance(12), Bubble, Slots: 5\n`;
  } else if (efield.options[efield.selectedIndex].value == 10) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Sky Catcher" Great Shield - 60/60 EHP, Regeneration(100), Energy Resistance(15), Directed(Arm), Slots: 5\n`;
  } else if (efield.options[efield.selectedIndex].value == 11) {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Fractal" Heavy Shield - 50/50 EHP, Regeneration(80), Energy Resistance(12), Bubble, Slots: 6\n`;
  } else {
    document.querySelector(
      ".equipment"
    ).innerHTML += `\n"Blast Barrier" Heavy Shield - 70/70 EHP, Regeneration(120), Energy Resistance(15), Directed(Arm), Slots: 6\n`;
  }
}


问:
Opt in/Opt out of google analytic based on cookie consent - Angular
I am trying to integrate Google Analytics with cookie consent. This means if a user gives his consent then the tracker will work else not.

I am using

window['ga-disable-${environment.gaTrackingId}'] = false;```
</div>
</div>
</p>
<p>to opt in google analytic and window['ga-disable-${environment.gaTrackingId}'] = true; to opt out of google analytic by default it will be opt out.</p>
<p>My app.component.ts looks like this</p>
<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="true">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>import {
  Component,
  HostListener,
  OnInit,
  OnDestroy
} from '@angular/core';
import {
  NgcCookieConsentService,
  NgcInitializeEvent,
  NgcNoCookieLawEvent,
  NgcStatusChangeEvent
} from 'ngx-cookieconsent';
import {
  Subscription
} from 'rxjs';
import {
  environment
} from 'src/environments/environment';
import {
  Title
} from '@angular/platform-browser';
import {
  ActivatedRoute
} from '@angular/router';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})

export class AppComponent implements OnInit, OnDestroy {
  isShow ? : boolean;
  topPosToStartShowing = 100;
  public consent!: string;
  notTrackScript!: any;
  trackScript!: any;

  //keep refs to subscriptions to be able to unsubscribe later
  private popupOpenSubscription!: Subscription;
  private popupCloseSubscription!: Subscription;
  private initializeSubscription!: Subscription;
  private statusChangeSubscription!: Subscription;
  private revokeChoiceSubscription!: Subscription;
  private noCookieLawSubscription!: Subscription;

  constructor(private ccService: NgcCookieConsentService, private title: Title) {

    if (environment.gaTrackingId) {
      // register google tag manager
      const gTagManagerScript = document.createElement('script');
      gTagManagerScript.async = true;
      gTagManagerScript.src = `https://www.googletagmanager.com/gtag/js?id=${environment.gaTrackingId}`;
      document.head.appendChild(gTagManagerScript);

      // register google analytics
      const gaScript = document.createElement('script');
      gaScript.innerHTML = `
        window.dataLayer = window.dataLayer || [];
        function gtag() { dataLayer.push(arguments); }
        gtag('js', new Date());
        gtag('config', '${environment.gaTrackingId}');
      `;
      document.head.appendChild(gaScript);

      this.notTrackScript = document.createElement('script');
      this.notTrackScript.innerHTML = `window['ga-disable-${environment.gaTrackingId}'] = true;`
      document.head.appendChild(this.notTrackScript)

      this.trackScript = document.createElement('script');
      this.trackScript.innerHTML = `window['ga-disable-${environment.gaTrackingId}'] = false;`
    }

  }

  ngOnInit(): void {

    this.statusChangeSubscription = this.ccService.statusChange$.subscribe(
      (event: NgcStatusChangeEvent) => {
        // you can use this.ccService.getConfig() to do stuff...
        console.log(`initialized: ${JSON.stringify(event)}`);
        if (event.status === 'allow') {
          document.head.removeChild(this.notTrackScript)
          document.head.appendChild(this.trackScript)
          location.reload()
        }

      });

  }
  ngOnDestroy(): void {
    // unsubscribe to cookieconsent observables to prevent memory leaks
    this.popupOpenSubscription.unsubscribe();
    this.popupCloseSubscription.unsubscribe();
    this.initializeSubscription.unsubscribe();
    this.statusChangeSubscription.unsubscribe();
    this.revokeChoiceSubscription.unsubscribe();
    this.noCookieLawSubscription.unsubscribe();
  }

}</code>```

Now with this code, I can make google analytic off by default. But it is not starting if I give consent as allow.

Body:
I am trying to integrate Google Analytics with cookie consent. This means if a user gives his consent then the tracker will work else not.

I am using

window['ga-disable-${environment.gaTrackingId}'] = false;

to opt in google analytic and window['ga-disable-${environment.gaTrackingId}'] = true; to opt out of google analytic by default it will be opt out.

My app.component.ts looks like this

import {
  Component,
  HostListener,
  OnInit,
  OnDestroy
} from '@angular/core';
import {
  NgcCookieConsentService,
  NgcInitializeEvent,
  NgcNoCookieLawEvent,
  NgcStatusChangeEvent
} from 'ngx-cookieconsent';
import {
  Subscription
} from 'rxjs';
import {
  environment
} from 'src/environments/environment';
import {
  Title
} from '@angular/platform-browser';
import {
  ActivatedRoute
} from '@angular/router';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})

export class AppComponent implements OnInit, OnDestroy {
  isShow ? : boolean;
  topPosToStartShowing = 100;
  public consent!: string;
  notTrackScript!: any;
  trackScript!: any;

  //keep refs to subscriptions to be able to unsubscribe later
  private popupOpenSubscription!: Subscription;
  private popupCloseSubscription!: Subscription;
  private initializeSubscription!: Subscription;
  private statusChangeSubscription!: Subscription;
  private revokeChoiceSubscription!: Subscription;
  private noCookieLawSubscription!: Subscription;

  constructor(private ccService: NgcCookieConsentService, private title: Title) {

    if (environment.gaTrackingId) {
      // register google tag manager
      const gTagManagerScript = document.createElement('script');
      gTagManagerScript.async = true;
      gTagManagerScript.src = `https://www.googletagmanager.com/gtag/js?id=${environment.gaTrackingId}`;
      document.head.appendChild(gTagManagerScript);

      // register google analytics
      const gaScript = document.createElement('script');
      gaScript.innerHTML = `
        window.dataLayer = window.dataLayer || [];
        function gtag() { dataLayer.push(arguments); }
        gtag('js', new Date());
        gtag('config', '${environment.gaTrackingId}');
      `;
      document.head.appendChild(gaScript);

      this.notTrackScript = document.createElement('script');
      this.notTrackScript.innerHTML = `window['ga-disable-${environment.gaTrackingId}'] = true;`
      document.head.appendChild(this.notTrackScript)

      this.trackScript = document.createElement('script');
      this.trackScript.innerHTML = `window['ga-disable-${environment.gaTrackingId}'] = false;`
    }

  }

  ngOnInit(): void {

    this.statusChangeSubscription = this.ccService.statusChange$.subscribe(
      (event: NgcStatusChangeEvent) => {
        // you can use this.ccService.getConfig() to do stuff...
        console.log(`initialized: ${JSON.stringify(event)}`);
        if (event.status === 'allow') {
          document.head.removeChild(this.notTrackScript)
          document.head.appendChild(this.trackScript)
          location.reload()
        }

      });

  }
  ngOnDestroy(): void {
    // unsubscribe to cookieconsent observables to prevent memory leaks
    this.popupOpenSubscription.unsubscribe();
    this.popupCloseSubscription.unsubscribe();
    this.initializeSubscription.unsubscribe();
    this.statusChangeSubscription.unsubscribe();
    this.revokeChoiceSubscription.unsubscribe();
    this.noCookieLawSubscription.unsubscribe();
  }

}

Now with this code, I can make google analytic off by default. But it is not starting if I give consent as allow.


问:
How to use Provider with a Model that requires parameters on its constructor?
I have a progress bar that shows milestones. On the click of the marker, I want it to open a container showing a brief description of the milestone.

I am showing the Container using Visibility, and I would like to change the value of the visible: parameter on onPressed on the marker. These are sibling widgets so I am doing it using the Riverpod package. However, I want to use the provider with data of my instances. I have different instances of a button, and each button should open a different pop up.

```<code>class Milestone {
  late final String _name;
  late final DateTime _date;
  late final String? _description;
  bool isVisible = false;

  get name => _name;
  get date => _date;
  get description => _description;
  get isPassed => _date.isBefore(DateTime.now());

  /// Constructor for [Milestone].
  ///
  /// It's called from [MilestoneRepository] when the data is retrieved from
  /// Firebase.
  Milestone(this._name, this._date, this._description);
}
</code>```

With Provider I would just implement the model with ChangeNotifier, listen from the MilestonePopup widget and notifyListeners() when the value isVisible updates. But in Riverpod I can't create a provider with Milestone() because I need to listen to those specific object instances that were already created in the build method at the start.

How can I do this? Do I have to create one StateProvider for each milestone? In that case, how? because I create the milestones with a for loop.

Body:
I have a progress bar that shows milestones. On the click of the marker, I want it to open a container showing a brief description of the milestone.

I am showing the Container using Visibility, and I would like to change the value of the visible: parameter on onPressed on the marker. These are sibling widgets so I am doing it using the Riverpod package. However, I want to use the provider with data of my instances. I have different instances of a button, and each button should open a different pop up.

class Milestone {
  late final String _name;
  late final DateTime _date;
  late final String? _description;
  bool isVisible = false;

  get name => _name;
  get date => _date;
  get description => _description;
  get isPassed => _date.isBefore(DateTime.now());

  /// Constructor for [Milestone].
  ///
  /// It's called from [MilestoneRepository] when the data is retrieved from
  /// Firebase.
  Milestone(this._name, this._date, this._description);
}

With Provider I would just implement the model with ChangeNotifier, listen from the MilestonePopup widget and notifyListeners() when the value isVisible updates. But in Riverpod I can't create a provider with Milestone() because I need to listen to those specific object instances that were already created in the build method at the start.

How can I do this? Do I have to create one StateProvider for each milestone? In that case, how? because I create the milestones with a for loop.


问:
How to Run an Exclusive SPLIT in PIG?
I'm wondering: since the default behavior of the SPLIT relational operator in PIG is to split relations non-exclusively (i.e. if a row fits conditions for 2 or more relations, it will be put into all of them), is there a way to split exclusively instead? What I mean, is I'd like to run a SPLIT statement that would put a row into the first relation whose condition(s) it fits, and then puts it in no other relation, even if it fits a later specified conditions relations.

An example under a normal split:

A=

```<code><1, 2, 3>
<4, 2, 1>
<8, 3, 4>
<4, 3, 3>
<7, 2, 5>
<8, 4, 3>
</code>```

then

```<code>SPLIT A INTO X IF $0 < 7, Y IF ($0 > 2 AND $0<> 7);
</code>```

Gives:

X =

```<code><1, 2, 3>
<4, 2, 1>
<4, 3, 3>
</code>```

and

Y =

```<code><4, 2, 1>
<8, 3, 4>
<4, 3, 3>
<8, 4, 3>
</code>```

In this case <4,2,1> and <4,3,3> go in both relations. I'd like each to go only into the first relation (A) whose conditions they fit.

NOTE: I know I can do this in two steps by first splitting the first condition off along with it's complement and then splitting the second condition off only the complement, but I'm hoping for a one step solution (or one that at least scales better to many splits) if one exists.

ContentLicense: CC BY-SA 3.0

Title: How to Run an Exclusive SPLIT in PIG?

Body:
I'm wondering: since the default behavior of the SPLIT relational operator in PIG is to split relations non-exclusively (i.e. if a row fits conditions for 2 or more relations, it will be put into all of them), is there a way to split exclusively instead? What I mean, is I'd like to run a SPLIT statement that would put a row into the first relation whose condition(s) it fits, and then puts it in no other relation, even if it fits a later specified conditions relations.

An example under a normal split:

A=

<1, 2, 3>
<4, 2, 1>
<8, 3, 4>
<4, 3, 3>
<7, 2, 5>
<8, 4, 3>

then

SPLIT A INTO X IF $0 < 7, Y IF ($0 > 2 AND $0<> 7);

Gives:

X =

<1, 2, 3>
<4, 2, 1>
<4, 3, 3>

and

Y =

<4, 2, 1>
<8, 3, 4>
<4, 3, 3>
<8, 4, 3>

In this case <4,2,1> and <4,3,3> go in both relations. I'd like each to go only into the first relation (A) whose conditions they fit.

NOTE: I know I can do this in two steps by first splitting the first condition off along with it's complement and then splitting the second condition off only the complement, but I'm hoping for a one step solution (or one that at least scales better to many splits) if one exists.


问:
"qt.qpa.plugin: Could not load the Qt platform plugin "xcb" in "" even though it was found" and "not symbolic link" error when reinstalling xcb
I'm attempting to install RStudio in WSL2. R itself works just fine, however when I install and try to run RStudio I get the following error:

qt.qpa.xcb: could not connect to display
qt.qpa.plugin: Could not load the Qt platform plugin "xcb" in "" even though it was found.
This application failed to start because no Qt platform plugin could be initialized. Reinstalling the application may fix this problem.

I've seen that other people have solved this problem by:

Installing libqt5x11extras5 and running the following command:

sudo ln -sf /usr/lib/x86_64-linux-gnu/qt5/plugins/platforms/ /usr/bin/

Attempting to reinstall libqt5x11extras5 and other xcb related libraries I get the following message at the end and rstudio still doesn't work:

/sbin/ldconfig.real: /usr/lib/wsl/lib/libcuda.so.1 is not a symbolic link

In the /wsl/lib/ folder there are what I believe are a few duplicate files of libcuda.so libcuda.so.1 and libcuda.so.1.1. This folder is read only and it seems like it's that way for a reason.

I'm assuming the solution involves making libcuda.so.1 a symbolic link but I'm not quite sure where I should be pointing it given wsl's slightly different file structure than regular ubuntu.

edit: for example I've tried

 sudo ln -sf  /usr/lib/wsl/lib/libcuda.so.1 /usr/bin

however it doesn't fix the issue with rstudio, and when I reinstall the xcb libraries I still get the same error about it not being a symbolic link.

edit 2: solved it! I needed to install windows 11 for the gui to work. I had read somewhere it would also work with the latest version of windows 10 but I guess not.


问:
Azure-aks: programatically watch AKS creation status using Java
I am writing test cases for an IaaC project. The use case is like the following:

```<code>Given I do not have a AKS cluster
And I call an api to create a cluster
Then I have a cluster up and running
</code>```

In the above scenario for 3rd step, I would like to implement two things, which are as follows:

First wait for the AKS resource to be created and

Once the resource is created, wait for the its provisioning state to be success

I searched the Azure documentation to see if there are any out of the box Watchers that azure provides as a part of it's azure-sdk-for-java. But did not find any. Could somebody share your knowledge or experience is solving such a problem statement?

Body:
I am writing test cases for an IaaC project. The use case is like the following:

Given I do not have a AKS cluster
And I call an api to create a cluster
Then I have a cluster up and running

In the above scenario for 3rd step, I would like to implement two things, which are as follows:

First wait for the AKS resource to be created and

Once the resource is created, wait for the its provisioning state to be success

I searched the Azure documentation to see if there are any out of the box Watchers that azure provides as a part of it's azure-sdk-for-java. But did not find any. Could somebody share your knowledge or experience is solving such a problem statement?


问:
Change field value in clean() after negative validation
I have a problem that I don't know how to solve. I don't know if that's even possible :(

I have a form that has four fields for simplicity (check, select, time1, time2). When the checkbox is active, the time field is displayed, otherwise select (using JS).

```<code>class Form(forms.Form):
    check = forms.BooleanField(required=False, initial=False, widget=forms.CheckboxInput(attrs={'style':'width:20px;height:20px;'}))
    select = forms.ChoiceField(choices=[], required=False)
    time1 = forms.TimeField(required=False)
    time2 = forms.TimeField(required=False)

    def __init__(self, *args, **kwargs):
        select = kwargs.pop('select', None)
        super(Form, self).__init__(*args, **kwargs)
        self.fields['select'].choices = select

    def clean(self):
        cleaned_data = super(Form, self).clean()
        time1 = cleaned_data.get("time1")
        time2 = cleaned_data.get("time2")
        select = cleaned_data.get("select")
        check = cleaned_data.get("check")
        if check:
            if time1 is None or time2 is None:
                raise forms.ValidationError(
                    {'time1': ["error!", ], 'time2': ["error!", ]}
                )
        else:
            if select is None:
                raise forms.ValidationError(
                    {'select': ["error!", ]}
                )
</code>```

I don't know how to change the value of the check field to True when the time fields are not filled.I can't use cleaned_data["check"] = True with return because it won't throw an exception

Body:
I have a problem that I don't know how to solve. I don't know if that's even possible :(

I have a form that has four fields for simplicity (check, select, time1, time2). When the checkbox is active, the time field is displayed, otherwise select (using JS).

class Form(forms.Form):
    check = forms.BooleanField(required=False, initial=False, widget=forms.CheckboxInput(attrs={'style':'width:20px;height:20px;'}))
    select = forms.ChoiceField(choices=[], required=False)
    time1 = forms.TimeField(required=False)
    time2 = forms.TimeField(required=False)

    def __init__(self, *args, **kwargs):
        select = kwargs.pop('select', None)
        super(Form, self).__init__(*args, **kwargs)
        self.fields['select'].choices = select

    def clean(self):
        cleaned_data = super(Form, self).clean()
        time1 = cleaned_data.get("time1")
        time2 = cleaned_data.get("time2")
        select = cleaned_data.get("select")
        check = cleaned_data.get("check")
        if check:
            if time1 is None or time2 is None:
                raise forms.ValidationError(
                    {'time1': ["error!", ], 'time2': ["error!", ]}
                )
        else:
            if select is None:
                raise forms.ValidationError(
                    {'select': ["error!", ]}
                )

I don't know how to change the value of the check field to True when the time fields are not filled.I can't use cleaned_data["check"] = True with return because it won't throw an exception


问:
SSIS trigger file is open in dtsdebughost.exe
SSIS package creates a sql server replication snapshot trigger file but while the ssis package is still running, the file can't be opened. is it possible to stop DtsDebughost.exe locking the file?

The plan is to unlock the file and move to different folder.


问:
dart SDK version doesn't seem to change
I had Dart SDK with version 2.16 installed and worked fine on my machine.

I tried to install the Dart with version 3 which is currently in development (3.0.0-0.0.dev), so in order to try it, I replaced the path of the Dart sdk in the environment variables with the path of the new dart with version 3, Then I created a new project on VScode, and this showed up:

Here I am writing code with the Records feature ( Which exists only in that Dart 3 dev version), and this error shows up:

```<code>This requires the 'records' language feature to be enabled.
Try updating your pubspec.yaml to set the minimum SDK constraint to 3.0.0 or higher, and running 'pub get'.
</code>```

But on my pubspec.yaml:

```<code>  environment:
  sdk: '>=3.0.0-0.0.dev <3.0.0'
</code>```

but that error is thrown, and I have no idea what cause it and how I can fix it and run the code successfully.

Thank you.

Title: dart SDK version doesn't seem to change

Body:
I had Dart SDK with version 2.16 installed and worked fine on my machine.

I tried to install the Dart with version 3 which is currently in development (3.0.0-0.0.dev), so in order to try it, I replaced the path of the Dart sdk in the environment variables with the path of the new dart with version 3, Then I created a new project on VScode, and this showed up:

Here I am writing code with the Records feature ( Which exists only in that Dart 3 dev version), and this error shows up:

This requires the 'records' language feature to be enabled.
Try updating your pubspec.yaml to set the minimum SDK constraint to 3.0.0 or higher, and running 'pub get'.

But on my pubspec.yaml:

  environment:
  sdk: '>=3.0.0-0.0.dev <3.0.0'

but that error is thrown, and I have no idea what cause it and how I can fix it and run the code successfully.

Thank you.


问:
E966 `nlp.add_pipe` now takes the string name of the registered component factory, not a callable component
```<code>nlp = spacy.blank('en')

def train_model(train_data):
    if 'ner' not in nlp.pipe_names:
        ner = nlp.create_pipe('ner')
        nlp.add_pipe(ner, last = True)

    for _, annotation in train_data:
        for ent in annotation['entities']:
            ner.add_label(ent[2])

    other_pipes = [pipe for pipe in nlp.pipe_names if pipe != 'ner']
    with nlp.disable_pipes(*other_pipes):  # only train NER
        optimizer = nlp.begin_training()
        for itn in range(10):
            print("Statring iteration " + str(itn))
            random.shuffle(train_data)
            losses = {}
            index = 0
            for text, annotations in train_data:
                try:
                    nlp.update(
                        [text],
                        [annotations],
                        drop=0.2,
                        sgd=optimizer,
                        losses=losses)
                except Exception as e:
                    pass

            print(losses)

</code>```
```<code>train_model(train_data)
</code>```

Error:

[E966] `nlp.add_pipe` now takes the string name of the registered component factory, not a callable component. Expected string, but got <spacy.pipeline.ner.EntityRecognizer object at 0x7ff8f26c3a50> (name: 'None').

If you created your component with `nlp.create_pipe('name')`: remove nlp.create_pipe and call `nlp.add_pipe('name')` instead.

If you passed in a component like `TextCategorizer()`: call `nlp.add_pipe` with the string name instead, e.g. `nlp.add_pipe('textcat')`.

If you're using a custom component: Add the decorator `@Language.component` (for function components) or `@Language.factory` (for class components / factories) to your custom component and assign it a name, e.g. `@Language.component('your_name')`. You can then run `nlp.add_pipe('your_name')` to add it to the pipeline.

How do I train the model?

Body:
nlp = spacy.blank('en')

def train_model(train_data):
    if 'ner' not in nlp.pipe_names:
        ner = nlp.create_pipe('ner')
        nlp.add_pipe(ner, last = True)

    for _, annotation in train_data:
        for ent in annotation['entities']:
            ner.add_label(ent[2])

    other_pipes = [pipe for pipe in nlp.pipe_names if pipe != 'ner']
    with nlp.disable_pipes(*other_pipes):  # only train NER
        optimizer = nlp.begin_training()
        for itn in range(10):
            print("Statring iteration " + str(itn))
            random.shuffle(train_data)
            losses = {}
            index = 0
            for text, annotations in train_data:
                try:
                    nlp.update(
                        [text],
                        [annotations],
                        drop=0.2,
                        sgd=optimizer,
                        losses=losses)
                except Exception as e:
                    pass

            print(losses)

train_model(train_data)

Error:

[E966] `nlp.add_pipe` now takes the string name of the registered component factory, not a callable component. Expected string, but got <spacy.pipeline.ner.EntityRecognizer object at 0x7ff8f26c3a50> (name: 'None').

If you created your component with `nlp.create_pipe('name')`: remove nlp.create_pipe and call `nlp.add_pipe('name')` instead.

If you passed in a component like `TextCategorizer()`: call `nlp.add_pipe` with the string name instead, e.g. `nlp.add_pipe('textcat')`.

If you're using a custom component: Add the decorator `@Language.component` (for function components) or `@Language.factory` (for class components / factories) to your custom component and assign it a name, e.g. `@Language.component('your_name')`. You can then run `nlp.add_pipe('your_name')` to add it to the pipeline.

How do I train the model?


问:
Makefile not creating objects with multiple sources
I'm triying to write a makefile that can take any amount of sources dirs and create their object files in a tidy way. I found this post that tries more or less the same, I'm at the point that the object dirs are created correctly. But getting the make: *** No rule to make target error when triying to create the objects.

This is my makefile at the moment

```<code>INCLUDES =  -I includes/    \
            -I  mlx

EXECPT_DIRS =   /mlx

OBJDIR      =   objs
SRCDIR      =   src

SRCDIRS     :=  $(shell find . -name '*.c'  -exec dirname {} \;| uniq | sed 's/\/$(SRCDIR)//g' | sed 's/\$(EXECPT_DIRS)//g' | cut -d . -f 2)
SRCS        :=  $(shell find $(SRCDIR) -name '*.c')
OBJS        :=  $(patsubst $(SRCDIR)%.c,$(OBJDIR)%.o, $(SRCS))

#############################################

#.SILENT:
all: $(NAME)

$(NAME) : buildtree $(OBJS)
    $(CC) $(OBJS) $(CFLAGS) $(INCLUDES) libraries/*

$(OBJDIR)%.o: $(SRCDIR)%.c
    $(CC) $(CFLAGS) $(INCLUDES) -c $< -o $@
clean:
    rm -rf $(OBJDIR)

fclean: clean
    $(RM) $(NAME)

re: fclean all

buildtree:
    @$(call mk_dir)

define mk_dir
    mkdir -p $(OBJDIR)/;        \
    for dir in $(SRCDIRS);  \
    do  \
        mkdir -p $(OBJDIR)/$$dir;   \
    done
endef

.PHONY: all clean fclean re bonus ext

</code>```

My tree before make
looks like this:

```<code>├── includes
├── libraries
├── mlx
│   └── man
│       └── man3
└── src
    ├── 42lib
    └── cub3d

</code>```

after

```<code>.
├── includes
├── libraries
├── mlx
│   └── man
│       └── man3
├── objs
│   ├── 42lib
│   └── cub3d
└── src
    ├── 42lib
    └── cub3d
</code>```

I did manage to get the object created using this makefile from the post:

```<code>APP     = Hello

SRCDIR  = Sources
OBJDIR  = Objects

SRCS    := $(shell find $(SRCDIR) -name '*.c')
SRCDIRS := $(shell find . -name '*.c' -exec dirname {} \; | uniq)
OBJS    := $(patsubst %.c,$(OBJDIR)/%.o,$(SRCS))

CFLAGS  = -Wall -pedantic -ansi
LDFLAGS =

all: $(APP)

$(APP) : buildrepo $(OBJS)
    $(CC) $(OBJS) $(LDFLAGS) -o $@

$(OBJDIR)/%.o: %.c
    $(CC) $(CFLAGS) -c $< -o $@

clean:
    $(RM) $(OBJS)

distclean: clean
    $(RM) $(APP)

buildrepo:
    @$(call make-repo)

define make-repo
   for dir in $(SRCDIRS); \
   do \
    mkdir -p $(OBJDIR)/$$dir; \
   done
endef
</code>```

But the objects got created in the objs/src/dir instead of objs/dir and it relinked too.
Some help with the relink would be really appreciated :)

Body:
I'm triying to write a makefile that can take any amount of sources dirs and create their object files in a tidy way. I found this post that tries more or less the same, I'm at the point that the object dirs are created correctly. But getting the make: *** No rule to make target error when triying to create the objects.

This is my makefile at the moment

INCLUDES =  -I includes/    \
            -I  mlx

EXECPT_DIRS =   /mlx

OBJDIR      =   objs
SRCDIR      =   src

SRCDIRS     :=  $(shell find . -name '*.c'  -exec dirname {} \;| uniq | sed 's/\/$(SRCDIR)//g' | sed 's/\$(EXECPT_DIRS)//g' | cut -d . -f 2)
SRCS        :=  $(shell find $(SRCDIR) -name '*.c')
OBJS        :=  $(patsubst $(SRCDIR)%.c,$(OBJDIR)%.o, $(SRCS))

#############################################

#.SILENT:
all: $(NAME)

$(NAME) : buildtree $(OBJS)
    $(CC) $(OBJS) $(CFLAGS) $(INCLUDES) libraries/*

$(OBJDIR)%.o: $(SRCDIR)%.c
    $(CC) $(CFLAGS) $(INCLUDES) -c $< -o $@
clean:
    rm -rf $(OBJDIR)

fclean: clean
    $(RM) $(NAME)

re: fclean all

buildtree:
    @$(call mk_dir)

define mk_dir
    mkdir -p $(OBJDIR)/;        \
    for dir in $(SRCDIRS);  \
    do  \
        mkdir -p $(OBJDIR)/$$dir;   \
    done
endef

.PHONY: all clean fclean re bonus ext

My tree before make
looks like this:

├── includes
├── libraries
├── mlx
│   └── man
│       └── man3
└── src
    ├── 42lib
    └── cub3d

after

.
├── includes
├── libraries
├── mlx
│   └── man
│       └── man3
├── objs
│   ├── 42lib
│   └── cub3d
└── src
    ├── 42lib
    └── cub3d

I did manage to get the object created using this makefile from the post:

APP     = Hello

SRCDIR  = Sources
OBJDIR  = Objects

SRCS    := $(shell find $(SRCDIR) -name '*.c')
SRCDIRS := $(shell find . -name '*.c' -exec dirname {} \; | uniq)
OBJS    := $(patsubst %.c,$(OBJDIR)/%.o,$(SRCS))

CFLAGS  = -Wall -pedantic -ansi
LDFLAGS =

all: $(APP)

$(APP) : buildrepo $(OBJS)
    $(CC) $(OBJS) $(LDFLAGS) -o $@

$(OBJDIR)/%.o: %.c
    $(CC) $(CFLAGS) -c $< -o $@

clean:
    $(RM) $(OBJS)

distclean: clean
    $(RM) $(APP)

buildrepo:
    @$(call make-repo)

define make-repo
   for dir in $(SRCDIRS); \
   do \
    mkdir -p $(OBJDIR)/$$dir; \
   done
endef

But the objects got created in the objs/src/dir instead of objs/dir and it relinked too.
Some help with the relink would be really appreciated :)


问:
Unable to login to VSCode Liveshare - other threads not working
Having the same issue described in this thread. However, the solution described involves getting a User Code from Microsoft. The link that would be used to get that code is now dead.

I'm wondering if there's another way to get access to this Usercode.


问:
Why does this code only work intermittently? Sometimes I get an error that I can't find on Google
I'm using the below code to connect to the Google BigQuery API. It only works intermittently. After this part, I attempt to send a dataframe to a BQ table via the "to_gbq" function. That part also only sometimes works, and other times fails due to the same error message.

Code:

```<code>from google.cloud import bigquery
from google.oauth2 import service_account

path_to_json = 'gbq_key.json'
my_credentials = service_account.Credentials.from_service_account_file(path_to_json)

my_project = 'myprojectnameishere'
client = bigquery.Client(credentials=my_credentials, project=my_project)
print('connected')
</code>```

AttributeError: module 'google.api_core' has no attribute 'client_options'

Detailed error:

```<code>  File "/home/my_user_name/get_mini_bq_helper.py", line 8, in <module>
    client = bigquery.Client(credentials=my_credentials, project=my_project)
  File "/home/my_user_name/.local/lib/python3.10/site-packages/google/cloud/bigquery/client.py", line 226, in __init__
    super(Client, self).__init__(
  File "/home/my_user_name/.local/lib/python3.10/site-packages/google/cloud/client/__init__.py", line 321, in __init__
    Client.__init__(
  File "/home/my_user_name/.local/lib/python3.10/site-packages/google/cloud/client/__init__.py", line 157, in __init__
    client_options = google.api_core.client_options.ClientOptions()
AttributeError: module 'google.api_core' has no attribute 'client_options'
</code>```

I am hosting this on PythonAnywhere but I randomly get this error locally as well. Sometimes it connects with no issue, but most of the time I get this error. Also, I couldn't find this error anywhere on Google/Stack Overflow. Any ideas what it might be?

Body:
I'm using the below code to connect to the Google BigQuery API. It only works intermittently. After this part, I attempt to send a dataframe to a BQ table via the "to_gbq" function. That part also only sometimes works, and other times fails due to the same error message.

Code:

from google.cloud import bigquery
from google.oauth2 import service_account

path_to_json = 'gbq_key.json'
my_credentials = service_account.Credentials.from_service_account_file(path_to_json)

my_project = 'myprojectnameishere'
client = bigquery.Client(credentials=my_credentials, project=my_project)
print('connected')

AttributeError: module 'google.api_core' has no attribute 'client_options'

Detailed error:

  File "/home/my_user_name/get_mini_bq_helper.py", line 8, in <module>
    client = bigquery.Client(credentials=my_credentials, project=my_project)
  File "/home/my_user_name/.local/lib/python3.10/site-packages/google/cloud/bigquery/client.py", line 226, in __init__
    super(Client, self).__init__(
  File "/home/my_user_name/.local/lib/python3.10/site-packages/google/cloud/client/__init__.py", line 321, in __init__
    Client.__init__(
  File "/home/my_user_name/.local/lib/python3.10/site-packages/google/cloud/client/__init__.py", line 157, in __init__
    client_options = google.api_core.client_options.ClientOptions()
AttributeError: module 'google.api_core' has no attribute 'client_options'

I am hosting this on PythonAnywhere but I randomly get this error locally as well. Sometimes it connects with no issue, but most of the time I get this error. Also, I couldn't find this error anywhere on Google/Stack Overflow. Any ideas what it might be?


问:
How can I run nginx on project files on windows?
I am trying to run NGINX locally on my windows computer.

```<code>I installed the pkg from https://nginx.org/en/download.html & un zipped it to my c drive and tried to run nginx -v and i got this err
</code>```

**nginx : The term 'nginx' is not recognized as the name of a cmdlet, function, script file, or operable program. Check the spelling of the name, or if a path was included, verify that the
path is correct and try again.
At line:1 char:1

nginx -v

```<code>  + CategoryInfo          : ObjectNotFound: (nginx:String) [], CommandNotFoundException
  + FullyQualifiedErrorId : CommandNotFoundException
</code>```

```<code>
I am using html css and js and like to use nginx for static content.

I really dont understand what I am doing wrong..
</code>```

Body:
I am trying to run NGINX locally on my windows computer.

I installed the pkg from https://nginx.org/en/download.html & un zipped it to my c drive and tried to run nginx -v and i got this err

**nginx : The term 'nginx' is not recognized as the name of a cmdlet, function, script file, or operable program. Check the spelling of the name, or if a path was included, verify that the
path is correct and try again.
At line:1 char:1

nginx -v

  + CategoryInfo          : ObjectNotFound: (nginx:String) [], CommandNotFoundException
  + FullyQualifiedErrorId : CommandNotFoundException

I am using html css and js and like to use nginx for static content.

I really dont understand what I am doing wrong..


问:
Having trouble with Amplitude Modulation and creating proper graphs to go with it
I am a college student working on a Amplitude Modulator that switches modulation constants every so often. The problem I am running into is when I plot my carrier signal graph I get this weird line plotted on the graph that I am unsure of where it comes from.

Can anyone help me understand where this is coming from?

The code is calling 5 seconds of audio I have loaded on my computer, loading the data and sampling rate, taking said data and making an array of nparrays that are 8 bits long. I then am modulating the signal with a carrier frequency to have a Modulated signal at the end. Or this is what I think im doing, because I'm a novice python coder.

Also any suggestions on how I building my code, I am still learning python and consider myself a novice at best, any helpful hints, recommendations, or tips help me greatly. Thank you for the time and help you offer me.

```<code>import numpy as np
import matplotlib.pyplot as plt
from scipy import signal
import librosa as lib
from math import trunc
#rewriting pi into a easy to use variable
pi = np.pi

myaudio, sr = lib.load("C:/Users/kaczm/Documents/Downloads/summer-bensound-royalty-free-music-
no-copyright-music_UpIcRKDG.mp3")
duration = len(myaudio)/sr
#print(trunc(len(myaudio) / 8))

time = np.arange(0,duration,1/sr)

plt.plot(time,myaudio)
plt.title('Signal original')
plt.xlabel('signal in time domain')
plt.ylabel('amplitude of signal')
plt.show()

#____________________________________________________________________________________________

arr1 = []
for i in range(0, (8 - (len(myaudio) % 8))):
   arr1.append([0])

#print(len(arr1))

#adds zeros to the end of myaudio,and time so it is easisly dvisble by 8 no matter the size
myaudio = np.append(myaudio,arr1)
time = np.append(time,arr1)

#variable for how many frames needed to be modulated, and spliting the exact time frames with
it
frame_num = trunc(len(myaudio) / 8)

#an array of numpy arrays of each individual byte in order
Split_audio = np.split(myaudio,frame_num)
Split_time = np.split(time,frame_num)

#___________________________________________________________________________________________

#A = int()
carrier = []
modulator = []
envelope = []
Mod_sig = []

#needs 8 different variables to work, designed this way for ease of coding
k = [1,.5,2,1.5,.3,2,1,2]

for x , y  in zip(Split_audio,Split_time):
    for Val, T, con in zip(x,y,k):
        modulator.append(float(Val * np.cos((2 * pi * T * 5 / sr))))
        carrier.append(float(signal.square(2 * pi * T )))
        envelope.append(float((1 + con * np.cos(2 * pi * T ))))

#        A = A + 1
#        print(con)
#    print(A)

for x,y  in zip(envelope,modulator):
    Mod_sig.append(float(x * y))

#plt.plot(time,modulator)
#plt.title('Signal modulator')
#plt.xlabel('signal in time domain')
#plt.ylabel('amplitude of signal')
#plt.show()

plt.plot(time,carrier)
plt.title('Signal carrier wave')
plt.xlabel('signal in time domain')
plt.ylabel('amplitude of signal')
plt.show()

plt.plot(time,Mod_sig)
plt.title('Signal Modulated signal')
plt.xlabel('signal in time domain')
plt.ylabel('amplitude of signal')
plt.show()
</code>```

All the commented out lines of code are ways for me to test and view what is happening with the code. It looks like everything is going fine when referencing the plotted graphs but the carrier graph has that strange line going through it. I have a feeling it could be, because I am implementing the math wrong, but I am unsure. Any help given is always greatly appreciated

Body:
I am a college student working on a Amplitude Modulator that switches modulation constants every so often. The problem I am running into is when I plot my carrier signal graph I get this weird line plotted on the graph that I am unsure of where it comes from.

Can anyone help me understand where this is coming from?

The code is calling 5 seconds of audio I have loaded on my computer, loading the data and sampling rate, taking said data and making an array of nparrays that are 8 bits long. I then am modulating the signal with a carrier frequency to have a Modulated signal at the end. Or this is what I think im doing, because I'm a novice python coder.

Also any suggestions on how I building my code, I am still learning python and consider myself a novice at best, any helpful hints, recommendations, or tips help me greatly. Thank you for the time and help you offer me.

import numpy as np
import matplotlib.pyplot as plt
from scipy import signal
import librosa as lib
from math import trunc
#rewriting pi into a easy to use variable
pi = np.pi

myaudio, sr = lib.load("C:/Users/kaczm/Documents/Downloads/summer-bensound-royalty-free-music-
no-copyright-music_UpIcRKDG.mp3")
duration = len(myaudio)/sr
#print(trunc(len(myaudio) / 8))

time = np.arange(0,duration,1/sr)

plt.plot(time,myaudio)
plt.title('Signal original')
plt.xlabel('signal in time domain')
plt.ylabel('amplitude of signal')
plt.show()

#____________________________________________________________________________________________

arr1 = []
for i in range(0, (8 - (len(myaudio) % 8))):
   arr1.append([0])

#print(len(arr1))

#adds zeros to the end of myaudio,and time so it is easisly dvisble by 8 no matter the size
myaudio = np.append(myaudio,arr1)
time = np.append(time,arr1)

#variable for how many frames needed to be modulated, and spliting the exact time frames with
it
frame_num = trunc(len(myaudio) / 8)

#an array of numpy arrays of each individual byte in order
Split_audio = np.split(myaudio,frame_num)
Split_time = np.split(time,frame_num)

#___________________________________________________________________________________________

#A = int()
carrier = []
modulator = []
envelope = []
Mod_sig = []

#needs 8 different variables to work, designed this way for ease of coding
k = [1,.5,2,1.5,.3,2,1,2]

for x , y  in zip(Split_audio,Split_time):
    for Val, T, con in zip(x,y,k):
        modulator.append(float(Val * np.cos((2 * pi * T * 5 / sr))))
        carrier.append(float(signal.square(2 * pi * T )))
        envelope.append(float((1 + con * np.cos(2 * pi * T ))))

#        A = A + 1
#        print(con)
#    print(A)

for x,y  in zip(envelope,modulator):
    Mod_sig.append(float(x * y))

#plt.plot(time,modulator)
#plt.title('Signal modulator')
#plt.xlabel('signal in time domain')
#plt.ylabel('amplitude of signal')
#plt.show()

plt.plot(time,carrier)
plt.title('Signal carrier wave')
plt.xlabel('signal in time domain')
plt.ylabel('amplitude of signal')
plt.show()

plt.plot(time,Mod_sig)
plt.title('Signal Modulated signal')
plt.xlabel('signal in time domain')
plt.ylabel('amplitude of signal')
plt.show()

All the commented out lines of code are ways for me to test and view what is happening with the code. It looks like everything is going fine when referencing the plotted graphs but the carrier graph has that strange line going through it. I have a feeling it could be, because I am implementing the math wrong, but I am unsure. Any help given is always greatly appreciated