[JavaScript] Tablica i generowanie Opcje

[dezerter_af]

Witam,

Dzięki pomocy użytkownikom i dzięki internetowi mam pewien kawałek kodu. Z JS nigdy nie miałem styczności, tylko wiem jak go wstawić na stronę Mam dwie tablice (gdzieś przeczytałem, że można tak zrobić). Chcę aby text wprowadzony w input id "nazwa" był rozbijany na znaki i kodowany wg tablica2.

[HTML] pobierz, plaintext 
<input type="text" id="nazwa" onKeyUp="symbole();">
<input type="text" id="symbol" readonly="readonly">
<script type="text/javascript">
function symbole() {
	var tablica = [];
	var tablica1 = new Array('a','ą','b','c','ć','d','e','ę','f','g','h','i','j','k','l','ł','m','n','ń','o','ó','p','q','r','s','ś','t','u','v','w','x','y','z','ź','ż');
	var tablica2 = new Array('a1','a2','b3','c4','c5','d6','e7','e8','f9','g1','h2','i3','j4','k5','l6','l7','m8','n9','n1','o2','o3','p4','q5','r6','s7','s8','t9','u1','v2','w3','x4','y5','z6','z7','z8');
	tablica array ["a, b, c"] = array "1, 2, 3";
	tablica["qq"] = "symbol 2";
	tablica["foo"] = "symbol trzeci";
	nazwa = document.getElementById("nazwa");
	symbol = document.getElementById("symbol");
	symbol.value = tablica[nazwa.value] !== undefined ? tablica[nazwa.value] : "";
}
</script>
[HTML] pobierz, plaintext 

Pozdrawiam,
Sergiusz Kotecki

W zasadzie to wpadłem na nowy trop czyli str.replace.
Ale tak jak mówiłem nigdy nie miałem styczności z JS i już po prostu wariuje bo nie wiem jak mam to zrobić. Czyli wpisuje w jeden input tekst a on jest zamieniany na kod. Czyli tak jak wg. poniższego skryptu.

Bardzo proszę o pomoc.

[HTML] pobierz, plaintext 
<input type="text" id="nazwa" onKeyUp="symbole();">
<input type="text" id="symbol" readonly="readonly">
<script type="text/javascript">
function symbole() {
	var tablica = [];
	var tablica1 = new Array('a','ą','b','c','ć','d','e','ę','f','g','h','i','j','k','l','ł','m','n','ń','o','ó','p','q','r','s','ś','t','u','v','w','x','y','z','ź','ż');
	var tablica2 = new Array('a1','a2','b3','c4','c5','d6','e7','e8','f9','g1','h2','i3','j4','k5','l6','l7','m8','n9','n1','o2','o3','p4','q5','r6','s7','s8','t9','u1','v2','w3','x4','y5','z6','z7','z8');
	wartosc_input = $("nazwa").val();
	wartosc_input = str_replace(tablica1, tablica2, wartosc_input);
 
	nazwa = document.getElementById("nazwa");
	symbol = document.getElementById("symbol");
	symbol.value = tablica2[nazwa.value] !== undefined ? tablica2[nazwa.value] : "";
}
</script>
[HTML] pobierz, plaintext 

[kamil4u]

http://jsfiddle.net/5dDKy/ ? Opisz dokładniej o co Ci chodzi!

[dezerter_af]

W zasadzie to działa super i prawie tak jak chciałem ale...

Potrzebuję dwóch inputów, w jeden wpisuje tekst a w drugim automatycznie pojawia się już zakodowany. Jeżeli ktoś mi pomoże i będzie działać to mogę zrobić jakieś małe donate na paypal

[CuteOne]

[JAVASCRIPT] pobierz, plaintext 
 
function myReplace(str) { 
 
	var replace = new Array('a','ą','b','c','ć','d','e','ę','f','g','h','i','j','k','l','ł','m','n','ń','o','ó','p','q','r','s','ś','t','u','v','w','x','y','z','ź','ż'); 
	var by = new Array('a1','a2','b3','c4','c5','d6','e7','e8','f9','g1','h2','i3','j4','k5','l6','l7','m8','n9','n1','o2','o3','p4','q5','r6','s7','s8','t9','u1','v2','w3','x4','y5','z6','z7','z8');
 
	for (var i=0; i<replace.length; i++) { 
 
		str = str.replace(replace[i], by[i]); 
	} 
	return str; 
} 
 
function symbole() {
 
	nazwa = document.getElementById("nazwa").value;
	document.getElementById("symbol").value = myReplace(nazwa);
}
[JAVASCRIPT] pobierz, plaintext 

[dezerter_af]

Powyższy przykład nie działa : >
http://jsfiddle.net/5dDKy/1/

[kamil4u]

http://jsfiddle.net/5dDKy/2/

--edit--
I poprawiona wersja poprzednika: http://jsfiddle.net/5dDKy/3/
Chociaż słowo poprawiona to za dużo napisane... Wystarczyło wywołać funkcję

Ten post edytował kamil4u 14.06.2012, 19:19:45

[dezerter_af]

Panowie, świetnie i elegancko Wszystko gra gitara ale pytanie : P

Czy jest jakiś sposób na ignorowanie znaków?

[kamil4u]

Jest. W moim przypadku już to zrobiłem.

Mamy tam kod:

Kod

return (a2[ a1.indexOf( char ) ] || '');

Czyli, jeżeli nie będzie znaku w tablicy to zostanie zwrócona wartość '', czyli nic.

Chyba, że chodzi Ci o coś innego, wtedy opisz dokładniej.

[dezerter_af]

nie wiem dlaczego nie pojawiło się tam "wielkich". Chodzi o rozróżnianie liter. Aktualnie kiedy wpiszę małe jest ok, bo tak jest w tablicy ale co z dużymi?

Tutaj znalazłem "rozwiązanie" ale brak styczności ze JS sprawia, że nie wiem jak to zastosować:
http://forum.php.pl/index.php?showtopic=111291

[kamil4u]

http://jsfiddle.net/5dDKy/4/

[dezerter_af]

WOW! Ten kod działą najlepiej ze wszystkich które zostały podane.

Dziękuje bardzo mocno : )

Jeszcze ostatnie pytanie, wczoraj byłem w domu jak to pisałem. Teraz nie działa sprawdzanie czy login jest zajęty czy nie. Da się coś na to poradzić czy pozostaje już zrezygnować ze sprawdzania czy login jest zajęty ?

[HTML] pobierz, plaintext 
            <tr>
                <td class="tklient_panel_n">login</td>
                <td class="tklient_panel_w">
                    <input type="text" name="login" value="<?php echo $klient_login ?>" onkeyup="sprawdz_login(<?php echo $id ?>)" id="login">
                    <div style="display: inline" id="login_status"></div>
                </td>
            </tr>
            <tr>
                <td class="tklient_panel_n">hasło</td>
                <td class="tklient_panel_w"><input type="text" name="haslo" id="haslo" value="<?php echo $klient_haslo ?>"></td>
            </tr>
		<script type="text/javascript">
function change( char ){
var a1,a2;
char = char.toLowerCase();
a1 = ['a','ą','b','c','ć','d','e','ę','f','g','h','i','j','k','l','ł','m','n','ń','o','ó','p','q','r','s','ś','t','u','v','w','x','y','z','ź','ż'];
a2 = ['a1','a2','b3','c4','c5','d6','e7','e8','f9','g1','h2','i3','j4','k5','l6','l7','m8','n9','n1','o2','o3','p4','q5','r6','s7','s8','t9','u1','v2','w3','x4','y5','z6','z7','z8'];
return (a2[ a1.indexOf( char ) ] || '');
}
document.getElementById('login').onkeyup = function(){
    var i,el;
    el = document.getElementById('haslo');
    el.value = '';
    for( i=0; i<this.value.length; i++){
        el.value += change( this.value[i] );
    }
}
		</script>
[HTML] pobierz, plaintext 

A tutaj funkcja sprawdzająca login:

[HTML] pobierz, plaintext 
function sprawdz_login(klient)
{
 login=document.getElementById("login").value;
 
 if ( login.length>0 )
   {
    var xmlhttp;
 
    if ( window.XMLHttpRequest )
      {
       xmlhttp=new XMLHttpRequest();
      }
    else
      {
       xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
 
    xmlhttp.onreadystatechange=function()
      {
       if ( xmlhttp.readyState==4 && xmlhttp.status==200 )
         {
          document.getElementById("login_status").innerHTML=xmlhttp.responseText;
         }
      }
 
    xmlhttp.open("GET","sprawdz_login_klient.php?login="+login+"&klient="+klient+"&nr="+Math.random(),true);
 
    xmlhttp.send();
   }
 else
   {
    document.getElementById("login_status").innerHTML="";
   }
}
[HTML] pobierz, plaintext 

@bump

[kamil4u]

Kod

<input type="text" name="login" value="<?php echo $klient_login ?>" onkeyup="sprawdz_login(<?php echo $id ?>)" id="login">

->

Kod

<input type="text" name="login" value="<?php echo $klient_login ?>" id="login">

i

Kod

document.getElementById('login').onkeyup = function(){
var i,el;
el = document.getElementById('haslo');
el.value = '';
for( i=0; i<this.value.length; i++){
el.value += change( this.value[i] );
}
}

->

Kod

document.getElementById('login').onkeyup = function(){
var i,el;
el = document.getElementById('haslo');
el.value = '';
for( i=0; i<this.value.length; i++){
el.value += change( this.value[i] );
}

sprawdz_login(<?php echo $id ?>);
}

Poducz się podstaw JS, bo z takimi prostymi rzeczami to powinienem Ci dać link do kursu JS, a nie gotowca dawać