RISOLTO Formattazione inputbox

Stato
Discussione chiusa ad ulteriori risposte.

Zio_Sporko

Utente Attivo
179
26
CPU
AMD Ryzen 5 3600
Dissipatore
Corsair Hydro H100i Pro RGB
Scheda Madre
ASUS TUF B450M PRO Gaming
HDD
Samsung 970 EVO Plus NVMe M.2 250 GB; Seagate Barracuda 1TB HDD
RAM
Patriot Viper Steel 16 GB 3200 MHz
GPU
Zotac RTX 2060 Super Mini
Audio
Focusrite Scarlett 2i2 2nd Generation
Monitor
Samsung 24F390 Curved Monitor FHD da 24"
PSU
EVGA Supernova 650 G3
Case
Corsair Carbide 275Q
Periferiche
Kit Devastator 2; 2x KRK Rokit 6 G3
Net
FTTC 100Mbps
OS
Windows 10 Home x64
Ciao a tutti,
è da un pò che lavoro con Javascript ma non riesco a risolvere questo problema: devo creare una inputbox che possa far inserire all'utente del testo, il quale viene salvato in una variabile globale dopo che si preme un bottone; una volta premuto questo bottone scompare rivelando una select con menù a tendina che consente di scegliere tra 3 opzioni riguardanti lo status dell'inputbox; la select gestisce l'evento onchange che va a richiamare una funzione che aggiunge il testo dell'opzione desiderata formattato secondo appositi criteri.
Il problema è che anziché cambiare solo il colore del testo dell'opzione mi cambia proprio tutto il colore dell'inputbox.
Spero di essermi spiegato al meglio. Lascio in seguito il codice che ho scritto.

HTML:
<!DOCTYPE html>

<html>

<head>

    <script type="text/Javascript">

        var Y;

        function changeConstValue(){

            Y = document.getElementById("subject").value;

            document.getElementById("btnSend").style.display = "none";

            document.getElementById("status").style.display = "block";

        }

        function myFunction(){

            document.getElementById("subject").value = "";

            var x = document.getElementById("status").options[document.getElementById("status").selectedIndex];

            document.getElementById("subject").value = Y + " " + x.text;

            switch(x.text){

                case "Completed": {

                    document.getElementById("subject").style.color = "Green";

                    break;

                }

                case "In progress": {

                    document.getElementById("subject").style.color = "Orange";

                    break;

                }

                case "Not busy": {

                    document.getElementById("subject").style.color = "Red";

                    break;

                }

                default: {

                    break;

                }

            }

        }

    </script>

</head>

<body>

    <input type="text" id="subject">

    <select id="status" onchange="myFunction()" style="display:none">

        <option value="1"> Completed </option>

        <option value="2"> In progress </option>

        <option value="3" selected="selected"> Not busy </option>

    </select>

    <button id="btnSend" onclick="changeConstValue()" style="display:block"> Send value </button>

</body>

</html>
 
Ultima modifica:

Skills07

Head of Development
Staff Forum
Utente Èlite
35,407
11,483
CPU
Ryzen 7 5800x
Dissipatore
Deepcool gammax l240 v2
Scheda Madre
Aourus Gigabyte X-470 ultra gaming
HDD
Samsung Evo 850 250gb ,2tb x 2 toshiba P300, 256 Ssd silicon power, Samsung evo plus 1tb nvme
RAM
32 gb G.Skill Tridentz 3200 mhz RGB
GPU
Zotac - RTX 3070 Ti Trinity OC
Monitor
ASUS TUF QHD 165hz IPS, ITEK GCF 165hz IPS QHD, Samsung Curvo 144hz QHD
PSU
Seasonic Focus 650w 80 platinum
Case
Coolermaster h500p
Periferiche
Asus Tuf Wireless
Net
Fibra Tim 100mb
OS
Windows 10 Pro 64 bit
ciao in primis scrivi il codice con il tag code, altrimenti qui diventa illeggibile..
non capisco la tua domanda, deve cambiare il colore la tua input box in base a ciò che scegli?

per cambiare il colore del testo dovresti fare una roba tipo questa:

Codice:
document.getElementById("yourobject").style.color = "MediumSeaGreen";

questo fa cambiare il colore del testo del tuo oggetto
 

Zio_Sporko

Utente Attivo
179
26
CPU
AMD Ryzen 5 3600
Dissipatore
Corsair Hydro H100i Pro RGB
Scheda Madre
ASUS TUF B450M PRO Gaming
HDD
Samsung 970 EVO Plus NVMe M.2 250 GB; Seagate Barracuda 1TB HDD
RAM
Patriot Viper Steel 16 GB 3200 MHz
GPU
Zotac RTX 2060 Super Mini
Audio
Focusrite Scarlett 2i2 2nd Generation
Monitor
Samsung 24F390 Curved Monitor FHD da 24"
PSU
EVGA Supernova 650 G3
Case
Corsair Carbide 275Q
Periferiche
Kit Devastator 2; 2x KRK Rokit 6 G3
Net
FTTC 100Mbps
OS
Windows 10 Home x64
ciao in primis scrivi il codice con il tag code, altrimenti qui diventa illeggibile..
non capisco la tua domanda, deve cambiare il colore la tua input box in base a ciò che scegli?

per cambiare il colore del testo dovresti fare una roba tipo questa:

Codice:
document.getElementById("yourobject").style.color = "MediumSeaGreen";

questo fa cambiare il colore del testo del tuo oggetto

Devo solamente cambiare il colore a una parte di testo dell'inputbox, non a tutto.
 

Skills07

Head of Development
Staff Forum
Utente Èlite
35,407
11,483
CPU
Ryzen 7 5800x
Dissipatore
Deepcool gammax l240 v2
Scheda Madre
Aourus Gigabyte X-470 ultra gaming
HDD
Samsung Evo 850 250gb ,2tb x 2 toshiba P300, 256 Ssd silicon power, Samsung evo plus 1tb nvme
RAM
32 gb G.Skill Tridentz 3200 mhz RGB
GPU
Zotac - RTX 3070 Ti Trinity OC
Monitor
ASUS TUF QHD 165hz IPS, ITEK GCF 165hz IPS QHD, Samsung Curvo 144hz QHD
PSU
Seasonic Focus 650w 80 platinum
Case
Coolermaster h500p
Periferiche
Asus Tuf Wireless
Net
Fibra Tim 100mb
OS
Windows 10 Pro 64 bit
puoi mostrare una foto della tua casella, in modo tale che riesca a comprendere...
anche un paint con due freccine riuscirebbe a farmi capire le cose
 

Zio_Sporko

Utente Attivo
179
26
CPU
AMD Ryzen 5 3600
Dissipatore
Corsair Hydro H100i Pro RGB
Scheda Madre
ASUS TUF B450M PRO Gaming
HDD
Samsung 970 EVO Plus NVMe M.2 250 GB; Seagate Barracuda 1TB HDD
RAM
Patriot Viper Steel 16 GB 3200 MHz
GPU
Zotac RTX 2060 Super Mini
Audio
Focusrite Scarlett 2i2 2nd Generation
Monitor
Samsung 24F390 Curved Monitor FHD da 24"
PSU
EVGA Supernova 650 G3
Case
Corsair Carbide 275Q
Periferiche
Kit Devastator 2; 2x KRK Rokit 6 G3
Net
FTTC 100Mbps
OS
Windows 10 Home x64

Allegati

  • Cattura3.PNG
    Cattura3.PNG
    4.8 KB · Visualizzazioni: 90

xMattyz

Utente Attivo
241
52
Se ho ben capito ciò che vuole lui è questo:
- L'utente scrive "Ciao", clicca il bottone e gli compare una select con dei dati valori.
- L'utente clicca su uno stato (es. "Nuovo"), nella textbox comparirà "Ciao Nuovo", dove "Nuovo" ha un colore specifico, diverso da "Ciao".
Dammi un'oretta e ti giro la funzione.
 

Zio_Sporko

Utente Attivo
179
26
CPU
AMD Ryzen 5 3600
Dissipatore
Corsair Hydro H100i Pro RGB
Scheda Madre
ASUS TUF B450M PRO Gaming
HDD
Samsung 970 EVO Plus NVMe M.2 250 GB; Seagate Barracuda 1TB HDD
RAM
Patriot Viper Steel 16 GB 3200 MHz
GPU
Zotac RTX 2060 Super Mini
Audio
Focusrite Scarlett 2i2 2nd Generation
Monitor
Samsung 24F390 Curved Monitor FHD da 24"
PSU
EVGA Supernova 650 G3
Case
Corsair Carbide 275Q
Periferiche
Kit Devastator 2; 2x KRK Rokit 6 G3
Net
FTTC 100Mbps
OS
Windows 10 Home x64
Se ho ben capito ciò che vuole lui è questo:
- L'utente scrive "Ciao", clicca il bottone e gli compare una select con dei dati valori.
- L'utente clicca su uno stato (es. "Nuovo"), nella textbox comparirà "Ciao Nuovo", dove "Nuovo" ha un colore specifico, diverso da "Ciao".
Dammi un'oretta e ti giro la funzione.
Esattamente questo, grazie mille.
 

xMattyz

Utente Attivo
241
52
Una domanda, considerando che il bottone scompare, perchè non trasformi il testo risultato in dei <p> ?
Risolveresti molto facilmente
 

Zio_Sporko

Utente Attivo
179
26
CPU
AMD Ryzen 5 3600
Dissipatore
Corsair Hydro H100i Pro RGB
Scheda Madre
ASUS TUF B450M PRO Gaming
HDD
Samsung 970 EVO Plus NVMe M.2 250 GB; Seagate Barracuda 1TB HDD
RAM
Patriot Viper Steel 16 GB 3200 MHz
GPU
Zotac RTX 2060 Super Mini
Audio
Focusrite Scarlett 2i2 2nd Generation
Monitor
Samsung 24F390 Curved Monitor FHD da 24"
PSU
EVGA Supernova 650 G3
Case
Corsair Carbide 275Q
Periferiche
Kit Devastator 2; 2x KRK Rokit 6 G3
Net
FTTC 100Mbps
OS
Windows 10 Home x64
Una domanda, considerando che il bottone scompare, perchè non trasformi il testo risultato in dei <p> ?
Risolveresti molto facilmente
Perché mi hanno chiesto di farlo con una inputbox e non con altro; lo so che sarebbe molto più facile ma non posso proprio fare altrimenti. :(
 
Ultima modifica:

Skills07

Head of Development
Staff Forum
Utente Èlite
35,407
11,483
CPU
Ryzen 7 5800x
Dissipatore
Deepcool gammax l240 v2
Scheda Madre
Aourus Gigabyte X-470 ultra gaming
HDD
Samsung Evo 850 250gb ,2tb x 2 toshiba P300, 256 Ssd silicon power, Samsung evo plus 1tb nvme
RAM
32 gb G.Skill Tridentz 3200 mhz RGB
GPU
Zotac - RTX 3070 Ti Trinity OC
Monitor
ASUS TUF QHD 165hz IPS, ITEK GCF 165hz IPS QHD, Samsung Curvo 144hz QHD
PSU
Seasonic Focus 650w 80 platinum
Case
Coolermaster h500p
Periferiche
Asus Tuf Wireless
Net
Fibra Tim 100mb
OS
Windows 10 Pro 64 bit
allora devi semplicemente colorare il testo alla destra del tuo testo precedente.
 

Zio_Sporko

Utente Attivo
179
26
CPU
AMD Ryzen 5 3600
Dissipatore
Corsair Hydro H100i Pro RGB
Scheda Madre
ASUS TUF B450M PRO Gaming
HDD
Samsung 970 EVO Plus NVMe M.2 250 GB; Seagate Barracuda 1TB HDD
RAM
Patriot Viper Steel 16 GB 3200 MHz
GPU
Zotac RTX 2060 Super Mini
Audio
Focusrite Scarlett 2i2 2nd Generation
Monitor
Samsung 24F390 Curved Monitor FHD da 24"
PSU
EVGA Supernova 650 G3
Case
Corsair Carbide 275Q
Periferiche
Kit Devastator 2; 2x KRK Rokit 6 G3
Net
FTTC 100Mbps
OS
Windows 10 Home x64
All'interno di un inputtext non è poi così banale, non è pensato per far cose del genere.
Allora mi sa che dovrò dare la brutta notizia in ufficio...grazie mille lo stesso :)
 

Skills07

Head of Development
Staff Forum
Utente Èlite
35,407
11,483
CPU
Ryzen 7 5800x
Dissipatore
Deepcool gammax l240 v2
Scheda Madre
Aourus Gigabyte X-470 ultra gaming
HDD
Samsung Evo 850 250gb ,2tb x 2 toshiba P300, 256 Ssd silicon power, Samsung evo plus 1tb nvme
RAM
32 gb G.Skill Tridentz 3200 mhz RGB
GPU
Zotac - RTX 3070 Ti Trinity OC
Monitor
ASUS TUF QHD 165hz IPS, ITEK GCF 165hz IPS QHD, Samsung Curvo 144hz QHD
PSU
Seasonic Focus 650w 80 platinum
Case
Coolermaster h500p
Periferiche
Asus Tuf Wireless
Net
Fibra Tim 100mb
OS
Windows 10 Pro 64 bit
Si può fare fidati, ora perchè non ho tempo di scriverti una funzione perchè sono a lavoro e sto cercando di fare un merging da xml, ma appena ho tempo provo a scriverti due righe
 

Zio_Sporko

Utente Attivo
179
26
CPU
AMD Ryzen 5 3600
Dissipatore
Corsair Hydro H100i Pro RGB
Scheda Madre
ASUS TUF B450M PRO Gaming
HDD
Samsung 970 EVO Plus NVMe M.2 250 GB; Seagate Barracuda 1TB HDD
RAM
Patriot Viper Steel 16 GB 3200 MHz
GPU
Zotac RTX 2060 Super Mini
Audio
Focusrite Scarlett 2i2 2nd Generation
Monitor
Samsung 24F390 Curved Monitor FHD da 24"
PSU
EVGA Supernova 650 G3
Case
Corsair Carbide 275Q
Periferiche
Kit Devastator 2; 2x KRK Rokit 6 G3
Net
FTTC 100Mbps
OS
Windows 10 Home x64
Si può fare fidati, ora perchè non ho tempo di scriverti una funzione perchè sono a lavoro e sto cercando di fare un merging da xml, ma appena ho tempo provo a scriverti due righe
Grazie, mi faciliteresti un sacco il lavoro.
 
Stato
Discussione chiusa ad ulteriori risposte.

Entra

oppure Accedi utilizzando
Discord Ufficiale Entra ora!