Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

2 Stron V   1 2 >  
Reply to this topicStart new topic
> [AJAX][Java][JavaScript] dynamiczna zmiana buttonu i pola input
shpaque
post 11.06.2018, 14:46:39
Post #1





Grupa: Zarejestrowani
Postów: 651
Pomógł: 3
Dołączył: 31.01.2011
Skąd: Warszawa

Ostrzeżenie: (10%)
X----


Pomożecie? smile.gif

o ile button przeskakuje na "Anuluj" - to nie wraca i poza tym nic sie nie dzieje:

  1. <?php
  2. $countCats = count($catalog);
  3.  
  4. if ($countCats < 1)
  5. {
  6. echo "Ten klient nie ma dodanego żadnego katalogu.<br>";
  7. echo "<button class=\"btn btn-md text-center btn-submit\" type=\"submit\" name=\"addcat\"><b>Dodaj katalog</b></button>";
  8. }
  9. else
  10. {
  11. for ($i = 0; $i < $countCats; $i++)
  12. {
  13. $lp = $i+1;
  14.  
  15. echo "
  16. <div class=\"row\">
  17. <div class=\"col-sm-1\">
  18. <div class=\"form-group\">
  19. <label>Lp</label>
  20. <input class=\"form-control text-center\" type=\"text\" name=\"lp\" value=\"".$lp."\" disabled />
  21. </div>
  22. </div>
  23. <div class=\"col-sm-4\">
  24. <div class=\"form-group\">
  25. <label>Tytuł katalogu</label>
  26. <input class=\"form-control text-center\" type=\"text\" name=\"newCatalogTitle".$i."\" value=\"".$catalog[$i] -> title."\" required />
  27. </div>
  28. </div>
  29. <div class=\"col-sm-2\">
  30. <div class=\"form-group\">
  31. <label>Plik katalogu</label>
  32. <input class=\"form-control text-center\" type=\"text\" id=\"newCatalogFile".$i."\" name=\"newCatalogFile".$i."\" value=\"".$catalog[$i] -> file."\" required disabled />
  33. </div>
  34. </div>
  35. <div class=\"col-sm-1\">
  36. <div class=\"form-group\">
  37. <label></label>
  38. <button class=\"btn btn-md text-center btn-back\" type=\"button\" id=\"changeCatFile".$i."\" name=\"changeCatFile".$i."\" onclick=\"changeFile();\">Zmień plik</button>
  39. </div>
  40. </div>
  41. </div>
  42. ";
  43.  
  44. echo "
  45. <script>
  46. function changeFile(){
  47. $(document).ready(function(){
  48. if ($('#newCatalogFile".$i."').prop('type: text')){
  49. $('#changeCatFile".$i."').html('Zmień plik');
  50. $('#newCatalogFile".$i."').prop('type: text', 'disabled: true');
  51. }
  52. else{
  53. $('#changeCatFile".$i."').html('Anuluj');
  54. $('#newCatalogFile".$i."').prop('type: file', 'disabled: false');
  55. }
  56. });
  57. }
  58. </script>
  59. ";
  60. }
  61. }
  62. ?>
Go to the top of the page
+Quote Post
nospor
post 11.06.2018, 14:50:54
Post #2





Grupa: Moderatorzy
Postów: 36 440
Pomógł: 6290
Dołączył: 27.12.2004




wywal to
$(document).ready(function(){

i staraj sie na przyszlosc doczytac co robia rzeczy ktorych uzywasz bo potem takie kwiatki


--------------------

"Myśl, myśl, myśl..." - Kubuś Puchatek || "Manual, manual, manual..." - Kubuś Programista
"Szukaj, szukaj, szukaj..." - Kubuś Odkrywca || "Debuguj, debuguj, debuguj..." - Kubuś Developer

Go to the top of the page
+Quote Post
shpaque
post 11.06.2018, 14:54:36
Post #3





Grupa: Zarejestrowani
Postów: 651
Pomógł: 3
Dołączył: 31.01.2011
Skąd: Warszawa

Ostrzeżenie: (10%)
X----


teraz nawet button sie nie przelacza - w ogole nieaktywny
Go to the top of the page
+Quote Post
nospor
post 11.06.2018, 14:55:36
Post #4





Grupa: Moderatorzy
Postów: 36 440
Pomógł: 6290
Dołączył: 27.12.2004




pokaz kod po zmianach

bo rozumiem ze oprocz
$(document).ready(function(){
wywaliles tez koncowke tej funkcji czyli jeden } oraz jeden ) ?


--------------------

"Myśl, myśl, myśl..." - Kubuś Puchatek || "Manual, manual, manual..." - Kubuś Programista
"Szukaj, szukaj, szukaj..." - Kubuś Odkrywca || "Debuguj, debuguj, debuguj..." - Kubuś Developer

Go to the top of the page
+Quote Post
shpaque
post 11.06.2018, 14:56:59
Post #5





Grupa: Zarejestrowani
Postów: 651
Pomógł: 3
Dołączył: 31.01.2011
Skąd: Warszawa

Ostrzeżenie: (10%)
X----


  1. function changeFile(){
  2. if ($('#newCatalogFile".$i."').prop('type: text')){
  3. $('#newCatalogFile".$i."').prop('type: text', 'disabled: true');
  4. $('#changeCatFile".$i."').html('Zmień plik');
  5. }
  6. else{
  7. $('#newCatalogFile".$i."').prop('type: file', 'disabled: false');
  8. $('#changeCatFile".$i."').html('Anuluj');
  9. }
  10. });
  11. </script>
Go to the top of the page
+Quote Post
nospor
post 11.06.2018, 14:58:13
Post #6





Grupa: Moderatorzy
Postów: 36 440
Pomógł: 6290
Dołączył: 27.12.2004




Jednak nie wywaliles..... tylle czasu z js sie bawisz i nawet do konsoli bledow nie zagladasz jeszcze?


--------------------

"Myśl, myśl, myśl..." - Kubuś Puchatek || "Manual, manual, manual..." - Kubuś Programista
"Szukaj, szukaj, szukaj..." - Kubuś Odkrywca || "Debuguj, debuguj, debuguj..." - Kubuś Developer

Go to the top of the page
+Quote Post
trueblue
post 11.06.2018, 14:59:42
Post #7





Grupa: Zarejestrowani
Postów: 6 761
Pomógł: 1822
Dołączył: 11.03.2014

Ostrzeżenie: (0%)
-----


http://api.jquery.com/prop/


--------------------
Go to the top of the page
+Quote Post
shpaque
post 11.06.2018, 15:04:09
Post #8





Grupa: Zarejestrowani
Postów: 651
Pomógł: 3
Dołączył: 31.01.2011
Skąd: Warszawa

Ostrzeżenie: (10%)
X----


to co tak? tez nie idzie

  1. function changeFile(){
  2. if ($('#newCatalogFile".$i."').prop('type: text')){
  3. $('#newCatalogFile".$i."').prop('type: text');
  4. $('#newCatalogFile".$i."').attr('disabled: true');
  5. $('#changeCatFile".$i."').html('Zmień plik');
  6. }
  7. else{
  8. $('#newCatalogFile".$i."').prop('type: file');
  9. $('#newCatalogFile".$i."').attr('disabled: false');
  10. $('#changeCatFile".$i."').html('Anuluj');
  11. }
  12. }
  13. </script>
Go to the top of the page
+Quote Post
nospor
post 11.06.2018, 15:06:24
Post #9





Grupa: Moderatorzy
Postów: 36 440
Pomógł: 6290
Dołączył: 27.12.2004




Tak, wlasnie tak. Teraz przejdzmy dalej. Proste debugowanie:

Kod
                     function changeFile(){
                        if ($('#newCatalogFile".$i."').prop('type: text')){
alert("Widzisz 1?");
                           $('#newCatalogFile".$i."').prop('type: text');
                           $('#newCatalogFile".$i."').attr('disabled: true');
                           $('#changeCatFile".$i."').html('Zmień plik');
                        }
                        else{
alert("A moze widzisz 2?");
                           $('#newCatalogFile".$i."').prop('type: file');
                           $('#newCatalogFile".$i."').attr('disabled: false');
                           $('#changeCatFile".$i."').html('Anuluj');
                        }
                     }


--------------------

"Myśl, myśl, myśl..." - Kubuś Puchatek || "Manual, manual, manual..." - Kubuś Programista
"Szukaj, szukaj, szukaj..." - Kubuś Odkrywca || "Debuguj, debuguj, debuguj..." - Kubuś Developer

Go to the top of the page
+Quote Post
shpaque
post 11.06.2018, 15:08:34
Post #10





Grupa: Zarejestrowani
Postów: 651
Pomógł: 3
Dołączył: 31.01.2011
Skąd: Warszawa

Ostrzeżenie: (10%)
X----


ale ja mam w konsoli pusto
Go to the top of the page
+Quote Post
nospor
post 11.06.2018, 15:09:45
Post #11





Grupa: Moderatorzy
Postów: 36 440
Pomógł: 6290
Dołączył: 27.12.2004




Niemozliwe. Przy poprzednim kodzie gdzie zostawiles }) powinienies miec bledy w konsoli. Moze patrzysz nie na te konsole co trzeba... Ja mowie o konsoli przegladarki.

Niewazne, odpal debug co ci podalem


--------------------

"Myśl, myśl, myśl..." - Kubuś Puchatek || "Manual, manual, manual..." - Kubuś Programista
"Szukaj, szukaj, szukaj..." - Kubuś Odkrywca || "Debuguj, debuguj, debuguj..." - Kubuś Developer

Go to the top of the page
+Quote Post
shpaque
post 11.06.2018, 15:11:36
Post #12





Grupa: Zarejestrowani
Postów: 651
Pomógł: 3
Dołączył: 31.01.2011
Skąd: Warszawa

Ostrzeżenie: (10%)
X----


nie mam alertow za to wyswietla mi tresc pod spodem:

  1. function changeFile(){ if ($('#newCatalogFile0').prop('type: text')){ alert("Widzisz 1?"); $('#newCatalogFile0').prop('type: text'); $('#newCatalogFile0').attr('disabled: true'); $('#changeCatFile0').html('Zmień plik'); } else{ alert("A moze widzisz 2?"); $('#newCatalogFile0').prop('type: file'); $('#newCatalogFile0').attr('disabled: false'); $('#changeCatFile0').html('Anuluj'); } }
Go to the top of the page
+Quote Post
nospor
post 11.06.2018, 15:12:32
Post #13





Grupa: Moderatorzy
Postów: 36 440
Pomógł: 6290
Dołączył: 27.12.2004




facepalmxd.gif
No ale miales to dac w sekcji SCRIPT


--------------------

"Myśl, myśl, myśl..." - Kubuś Puchatek || "Manual, manual, manual..." - Kubuś Programista
"Szukaj, szukaj, szukaj..." - Kubuś Odkrywca || "Debuguj, debuguj, debuguj..." - Kubuś Developer

Go to the top of the page
+Quote Post
shpaque
post 11.06.2018, 15:13:51
Post #14





Grupa: Zarejestrowani
Postów: 651
Pomógł: 3
Dołączył: 31.01.2011
Skąd: Warszawa

Ostrzeżenie: (10%)
X----


index.php?page=edit&id=227632&c=Brunner:287 Uncaught ReferenceError: changeFile is not defined
at HTMLButtonElement.onclick (index.php?page=edit&id=227632&c=Brunner:287)

oj kurde wkleilem calosc i wywalilo scripty

wywala od razu 2
Go to the top of the page
+Quote Post
nospor
post 11.06.2018, 15:15:57
Post #15





Grupa: Moderatorzy
Postów: 36 440
Pomógł: 6290
Dołączył: 27.12.2004




Super, jak juz opanowales proste debugowanie to teraz sie wkoncu skup i zajrzyj do linka co podal trueblue bo zle uzywasz prop().
To po pierwsze
A po drugie masz totalnie zla logike:
jesli TYPE jest text to ustaw TYPE na text.
No przeciez to nie ma zadnego sensu.

Zebys lepiej zrozumial:
Jesli x to 3 to ustaw x na 3
w przeciwnym wypadku ustaw x na "nie3"


--------------------

"Myśl, myśl, myśl..." - Kubuś Puchatek || "Manual, manual, manual..." - Kubuś Programista
"Szukaj, szukaj, szukaj..." - Kubuś Odkrywca || "Debuguj, debuguj, debuguj..." - Kubuś Developer

Go to the top of the page
+Quote Post
shpaque
post 11.06.2018, 15:20:11
Post #16





Grupa: Zarejestrowani
Postów: 651
Pomógł: 3
Dołączył: 31.01.2011
Skąd: Warszawa

Ostrzeżenie: (10%)
X----


  1. $( "input" ).change(function() {
  2. var $input = $( this );
  3. $( "p" ).html(
  4. ".attr( \"checked\" ): <b>" + $input.attr( "checked" ) + "</b><br>" +
  5. ".prop( \"checked\" ): <b>" + $input.prop( "checked" ) + "</b><br>" +
  6. ".is( \":checked\" ): <b>" + $input.is( ":checked" ) + "</b>" );
  7. }).change();


ok ale to musze inaczej cala funkcje zrobic czy co?
Go to the top of the page
+Quote Post
Neutral
post 11.06.2018, 15:41:49
Post #17





Grupa: Zarejestrowani
Postów: 286
Pomógł: 46
Dołączył: 10.01.2016

Ostrzeżenie: (0%)
-----


Czy mógłbyś nakreślić, co dokładnie próbujesz osiągnąć?

Czy chodzi Ci o wzięcie wartości z input type checkbox?

Kod
var input = document.getElementsByTagName('input');
for(var i=0;i<input.length;i++) {
    input[i].addEventListener('change',function(e) {
        console.log(e.target.value);
    },false);
}
Go to the top of the page
+Quote Post
shpaque
post 11.06.2018, 17:37:01
Post #18





Grupa: Zarejestrowani
Postów: 651
Pomógł: 3
Dołączył: 31.01.2011
Skąd: Warszawa

Ostrzeżenie: (10%)
X----


nie,m to akurat byl przyklad.

chce za pomoca czegos takiego:

  1. function changeFile(){
  2. if ($('#newCatalogFile".$i."').attr('type: text')){
  3. $('#newCatalogFile".$i."').prop('disabled');
  4. $('#changeCatFile".$i."').html('Zmień plik');
  5. }
  6. else{
  7. $('#newCatalogFile".$i."').attr('type: file');
  8. $('#newCatalogFile".$i."').prop('disabled');
  9. $('#changeCatFile".$i."').html('Anuluj');
  10. }
  11. }
  12. </script>


zrobic zeby button #changeCatFile po kliknieciu zmienil inputa #newCatalogFile na "type=file" wylaczajac duisabled i po kliknieciu anuluj - spowrotem na type=text i disabled
Go to the top of the page
+Quote Post
Neutral
post 11.06.2018, 17:58:18
Post #19





Grupa: Zarejestrowani
Postów: 286
Pomógł: 46
Dołączył: 10.01.2016

Ostrzeżenie: (0%)
-----


  1. <button id="changeCatFile">changeCatFile</button>
  2. <input type="text" id="newCatalogFile" disabled="disabled"/>


Kod
var i=0;
document.getElementById('changeCatFile').addEventListener('click',function() {
    
    if(i==0) {
        document.getElementById('newCatalogFile').setAttribute('type','file');
        document.getElementById('newCatalogFile').disabled = false;
        i=1;
    }else {
        document.getElementById('newCatalogFile').setAttribute('type','text');
        document.getElementById('newCatalogFile').disabled = true;
        i=0;
    }
    
},false);
Go to the top of the page
+Quote Post
Neutral
post 11.06.2018, 18:11:11
Post #20





Grupa: Zarejestrowani
Postów: 286
Pomógł: 46
Dołączył: 10.01.2016

Ostrzeżenie: (0%)
-----


Kod
document.getElementById('changeCatFile').textContent = 'your new content';


Dlaczego zmieniłeś poprzedni kod, który Ci wysłałem? Ten Twój chyba nie działa.

Ten post edytował Neutral 11.06.2018, 18:19:24
Go to the top of the page
+Quote Post

2 Stron V   1 2 >
Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Wersja Lo-Fi Aktualny czas: 29.03.2024 - 10:48