Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Problem z dynamicznie ładowanymi danymi do UI jquery Dialog
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
Mayka
Mam problem z moim skrypcikiem.. wypociłem sobie coś takiego:
  1. $(function() {
  2. var name;
  3. var email;
  4. var password;
  5. var allFields = $( [] ).add( name ).add( email ).add( password );
  6. var tips = $( ".validateTips" );
  7.  
  8. function updateTips( t ) {
  9. tips
  10. .text( t )
  11. .addClass( "ui-state-highlight" );
  12. setTimeout(function() {
  13. tips.removeClass( "ui-state-highlight", 1500 );
  14. }, 500 );
  15. }
  16.  
  17. function checkLength( o, n, min, max ) {
  18. if ( o.val().length > max || o.val().length < min ) {
  19. o.addClass( "ui-state-error" );
  20. updateTips( "Długość "+n+" musi być pomiędzy" +
  21. min + " i " + max + "." );
  22. return false;
  23. } else {
  24. return true;
  25. }
  26. }
  27.  
  28. function checkRegexp( o, regexp, n ) {
  29. if ( !( regexp.test( o.val() ) ) ) {
  30. o.addClass( "ui-state-error" );
  31. updateTips( n );
  32. return false;
  33. } else {
  34. return true;
  35. }
  36. }
  37.  
  38. $( "#register-user" )
  39. .button()
  40. .click(function() {
  41.  
  42. var rejestracja_usera = $(document.createElement('div'));
  43. rejestracja_usera.load('rejestracja.html');
  44. rejestracja_usera.dialog({
  45. height: 500,
  46. width: 650,
  47. modal: true,
  48. buttons: {
  49. "Stwórz konto ": function() {
  50. var bValid = true;
  51. allFields.removeClass( "ui-state-error" );
  52. name = document.getElementById("name");
  53. email = document.getElementById("email");
  54. password = document.getElementById("password");
  55. bValid = bValid && checkLength( name, "Nazwy użytkownika", 3, 16 );
  56. bValid = bValid && checkLength( email, "Adresu email", 6, 80 );
  57. bValid = bValid && checkLength( password, "hasła", 5, 16 );
  58.  
  59. bValid = bValid && checkRegexp( name, /^[a-z]([0-9a-z_])+$/i, "Login musi składać się tylko z cyfr i liter oraz zaczynać literą." );
  60. // From jquery.validate.js (by joern), contributed by Scott Gonzalez: http://projects.scottsplayground.com/email...ess_validation/
  61. bValid = bValid && checkRegexp( email, /^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i, "Błędny format: np. firma@domena.pl " );
  62. bValid = bValid && checkRegexp( password, /^([0-9a-zA-Z])+$/, "Hasło może zawierać tylko litery i cyfry" );
  63.  
  64. if ( bValid ) {
  65. $( "#users tbody" ).append( "<tr>" +
  66. "<td>" + name.val() + "</td>" +
  67. "<td>" + email.val() + "</td>" +
  68. "<td>" + password.val() + "</td>" +
  69. "</tr>" );
  70. $( this ).dialog( "close" );
  71. }
  72. },
  73. Cancel: function() {
  74. $( this ).dialog( "close" );
  75. }
  76. },
  77. close: function() {
  78. allFields.val( "" ).removeClass( "ui-state-error" );
  79. }
  80. });
  81. });});

I mam przycisk który to otwiera, wszystko było ok do momentu w którym nie zrobiłem dynamicznego ładowania treści.. i coś sie stało z zmiennymi ? Tylko nie wiem co, ja chyba nigdy nie dojde z nimi do porozumienia, zawsze mam z tym problem..
I wywala mi błąd:
TypeError: o is null
if ( o.val().length > max || o.val().length < min ) {

(w linii 18) ktoś mi powie dlaczego ?
nospor
bValid = bValid && checkLength( name, "Nazwy użytkownika", 3, 16 );
Nigdzie nie widzę, byś zmienną name gdziekolwiek określał
Mayka
No linijka 2 a pozniej przypisuje wartość w 52
Czy to znowu nie tak ?
nospor
A wybacz, starość nie radość, nie zauważyłem smile.gif

Z tego wynika, że document.getElementById("name") nie znajduje ci pola o ID="name"
Masz takowe?
Mayka
Spoko wink.gif No własnie nie znajduje tylko dlaczego ? w pliku rejestracja html jest tylko :
  1. <form>
  2. <label for="name">Name</label>
  3. <input type="text" name="name" id="name" class="text ui-widget-content ui-corner-all" />
  4. <label for="email">Email</label>
  5. <input type="text" name="email" id="email" value="" class="text ui-widget-content ui-corner-all" />
  6. <label for="password">Password</label>
  7. <input type="password" name="password" id="password" value="" class="text ui-widget-content ui-corner-all" />
  8. </form>


Wiec na moj gust to jest pole name..

Powiem wiecej.. jak wstawie sobie do linijki 54 alert(name);
to mam taki komunikat : [object HTMLInputElement] ale jak zamienie to na
name = document.getElementsByName("name")[0].value;
to pobiera to co jest w polu name... Nic z tego nie rozumiem..
nospor
I tu leży pies pogrzebany.
Ty ten form masz o tu:
rejestracja_usera
zaś pól szukasz w dokumencie strony. A to dwie różne rzeczy smile.gif

Czyli nie:
name = document.getElementById("name");
a:
name = rejestracja_usera.find("#name").get(0);
Analogicznie reszta.

ps: skoro już używasz jQuery to naprawdę mógłbyś pisać jak należy a nie bawisz się jeszcze w zwykły js DOM

ps: mówisz ze alert wyświetla ci obiekt name? Hmm.... a nie powinien wink.gif

Pewnie na stronie masz gdzieś jeszcze pole o id="name" smile.gif
W takim razie chodzi o email albo o password smile.gif
Mayka
Cytat(nospor @ 5.12.2012, 15:42:15 ) *
I tu leży pies pogrzebany.
Ty ten form masz o tu:
rejestracja_usera
zaś pól szukasz w dokumencie strony. A to dwie różne rzeczy smile.gif

Czyli nie:
name = document.getElementById("name");
a:
name = rejestracja_usera.find("#name").get(0);
Analogicznie reszta.

ps: skoro już używasz jQuery to naprawdę mógłbyś pisać jak należy a nie bawisz się jeszcze w zwykły js DOM

ps: mówisz ze alert wyświetla ci obiekt name? Hmm.... a nie powinien wink.gif

Pewnie na stronie masz gdzieś jeszcze pole o id="name" smile.gif
W takim razie chodzi o email albo o password smile.gif


Nie wiedziałem że tak można tongue.gif Ale z getem tak jak podałeś jest taki komunikat jak wyżej.. HTMLobject cos tam.
ale zrobiłem name = rejestracja_usera.find("#name").val(); i alert zwraca wartość pola
ale nadal brakuje niby tego o.val
nospor
Ma być tak:
name = rejestracja_usera.find("#name")
I to name masz przekazać do checkLength
Identycznie masz zrobić z email oraz password
Mayka
Cytat(nospor @ 5.12.2012, 15:47:40 ) *
Ma być tak:
name = rejestracja_usera.find("#name")
I to name masz przekazać do checkLength
Identycznie masz zrobić z email oraz password


Działa, biggrin.gif Tylko dlaczego alert(name) zwraca OBJECT Object ? To jak bede chciał pobrać wartości tego do jquery to w ten sam sposób ?

No dobra pośpieszyłem sie.. działa w sensie nie wywala błędu ale teraz nie wywala też i komunikatu w "validateTips".. i nie pozwala przejśc dalej, gdzie jeszcze jest jakiś babol ?
viking
Zainstaluj firebug, w kodzie strony console.log(obiekt); i możesz sobie popatrzeć co konkretnie to jest, jakie ma atrybuty itd. Szybciej niż zastanawiać się na czym pracujemy.
Mayka
Cytat(viking @ 5.12.2012, 15:55:35 ) *
Zainstaluj firebug, w kodzie strony console.log(obiekt); i możesz sobie popatrzeć co konkretnie to jest, jakie ma atrybuty itd. Szybciej niż zastanawiać się na czym pracujemy.


No bez firebuga to ja sie nie ruszam już wink.gif Ale czego mam szukać w tym logu ? Bo tu zwraca milion opcji tongue.gif
nospor
Cytat
ale teraz nie wywala też i komunikatu w "validateTips"..
No to zobacz czemu. Czy wszystko trzeba palcem pokazywac....
Kod
function checkLength( o, n, min, max ) {

alert(o.val().length);      
      if ( o.val().length > max || o.val().length < min ) {
alert('Wszedłem tu?');
                o.addClass( "ui-state-error" );

                updateTips( "Długość "+n+" musi być pomiędzy" +

                    min + " i  " + max + "." );

                return false;

            } else {

                return true;

            }

        }

Co wyświetla?
Mayka
Ilość wpisanych znakow i "wszedłem tu" no ale i co w związku z tym ze nie wyswietla sie napis ?
nospor
Dzięki temu wiemy, że działa poprawnie walidacja znaków.
Dzięki temu wiemy, że nie działa wyświetlanie tekstów. Teraz tam właśnie masz szukać błędu.
Mayka
Cytat(nospor @ 6.12.2012, 07:26:03 ) *
Dzięki temu wiemy, że działa poprawnie walidacja znaków.
Dzięki temu wiemy, że nie działa wyświetlanie tekstów. Teraz tam właśnie masz szukać błędu.


No dobra wiemy.. tylko ty wiesz dlaczego nie działa to wpisywanie a ja nie tongue.gif

edit:

Mam jeszcze jedno pytanie, chciałbym sie dostać do wartości zwracanej przez NicEdit, ładowane jest tak :
  1. bkLib.onDomLoaded(function() { nicEditors.allTextAreas() });


i znalazłem takie coś ale to działa mi na stronie lokalnej a jak jest ładowana przez diva to nie bardzo wiem jak sie dostać do tego ?

  1.  
  2. bkLib.onDomLoaded(function(){
  3. var myEditor = new nicEditor({fullPanel : true }).panelInstance('myArea2');
  4. myEditor.addEvent('add', function() {
  5. alert( myEditor.instanceById('myArea2').getContent() );
  6. });
  7. });
  8.  
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.