Avaleht
uus teema   vasta Tarkvara »  Programmeerimine »  Javascript - ei oska teha... märgi kõik teemad loetuks
märgi mitteloetuks
vaata eelmist teemat :: vaata järgmist teemat
Hinnavaatlus :: Foorum :: Uudised :: Ärifoorumid :: HV F1 ennustusvõistlus :: Pangalink :: Telekavad :: HV toote otsing
autor
sõnum Saada viide sõbrale.  :: Teata moderaatorile teata moderaatorile
otsing:  
Stemugram
HV kasutaja

liitunud: 02.12.2001
sõnum 01.12.2012 19:37:45 Javascript - ei oska teha... vasta tsitaadiga
Mul on üks tabel kuhu saab javascriptiga lisada ja kustutada ridasid. Nüüd oleks vaja, et kui klaviatuurilt vajutad näiteks tähte "n" siis lisatkse rida. Vajalikud skriptid leidsin internetist üles aga tööle ei oska panna.

Äkki keegi oskaks aidata?
Igatahes 12. reale oleks vaja kirja panna, et käivitatakse see rea lisamise funktsioon.

javascript:
  1. <html>
  2.         <head> 
  3.                 <style>
  4.                         #loader { position: fixed; left:50%; top:30px; display:none }
  5.                 </style>
  6.                 <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
  7.                 <script type="text/javascript" src="http://pulkitgoyal.in/Demo/jMatrixBrowse/lib/jquery/hotkeys/jquery.hotkeys.js"></script>
  8. <script type="text/javascript">  
  9. $(document).ready(function(){
  10. $(document).bind("keydown", "n", function(e) {
  11.  //alert("TEST");
  12.  
  13. });
  14. });
  15. </script>
  16.  
  17. <script type="text/javascript">  
  18. $(function(){
  19.         var editTemplate = '<tr><form id="t"><td><input name="" type="text" /></td><td><input name="jnr" type="text" /></td><td><input name="aeg" type="text" /></td><td><a class="save" href="#"><img src="images/save.png" alt="save" /></a><a class="delete_new" href="#"><img src="images/icon_del_light.png" alt="delete" /></a></td>      </form></tr>';
  20.  
  21.         $(".add_row").click(function() {
  22.                 $("table tr").first().after(editTemplate);
  23.                 addEvents();
  24.         });
  25.        
  26.         function addEvents() {
  27.                 $(".save").click(function() {
  28.                         $('#loader').show();
  29.                         var id = $(this).parent().parent().find('input[name="id"]').val();
  30.                         var jnr = $(this).parent().parent().find('input[name="jnr"]').val();
  31.                         var aeg = $(this).parent().parent().find('input[name="aeg"]').val();
  32.                         var currentItem = this;
  33.                        
  34.                         if(aeg!='' && jnr!='') {
  35.                                 $.post("index.php",
  36.                                 {
  37.                                 "id": id,
  38.                                 "jnr": jnr,
  39.                                 "aeg": aeg,
  40.                                 "action": "add_new"
  41.                                 },
  42.                                 function(data){
  43.                                         $(currentItem).parent().parent().replaceWith(data.row);
  44.                                         addEvents();
  45.                                         $('#loader').hide();
  46.                                 }, "json");
  47.                         } else {
  48.                                 $('#loader').hide();
  49.                                 alert('!!!');
  50.                         }
  51.                 });
  52.                
  53.                 $(".delete_new").click(function() {
  54.                         $(this).parent().parent().remove();
  55.                 });
  56.                
  57.                 // Eemaldab rea
  58.                 $(".delete_row").click(function() {
  59.                         $('#loader').show();
  60.                         var id = $(this).parent().parent().find("td:first").html();
  61.                         $(this).parent().parent().remove();
  62.                         $.post("index.php", { "action": "delete_row", "id": id }, function(){
  63.                                 $('#loader').hide();
  64.                         });
  65.                 });
  66.         }
  67.        
  68.         addEvents();
  69. });
  70.  
  71. </script>
  72.         </head>
  73.         <body>
  74.                 <div id="loader"><img src="images/ajax-loader.gif"></div> <!-- Ajax Loader -->
  75.                 <table border="1">
  76.         <tr>
  77.                 <th>id</th>
  78.                 <th>jnr</th>
  79.                 <th>aeg</th>
  80.                 <th style="width:90px">Lisa <a class="add_row" href="#"><img src="images/icon_add_light.png" alt="add" /></a></th>
  81.         </tr>
  82.         <tr>
  83.                 <td>422</td>
  84.                 <td>30</td>
  85.                 <td>1990-03-22</td>
  86.                 <td><a class="delete_row" href="#"><img src="images/icon_del_light.png" alt="delete" /></a></td>
  87.         </tr>
  88.         <tr>
  89.                 <td>421</td>
  90.                 <td>29</td>
  91.                 <td>1999-03-22</td>
  92.                 <td><a class="delete_row" href="#"><img src="images/icon_del_light.png" alt="delete" /></a></td>
  93.         </tr>
  94. </table>
  95. </body>
  96. </html>
Kommentaarid: 2 loe/lisa Kasutajad arvavad:  :: 0 :: 0 :: 2
tagasi üles
vaata kasutaja infot saada privaatsõnum
andrusny
Kreisi kasutaja
andrusny

liitunud: 20.03.2006
sõnum 01.12.2012 19:58:54 vasta tsitaadiga
javascript:
  1.  
  2. <script type="text/javascript"> 
  3.  
  4. $(function(){
  5.  
  6.         var editTemplate = '<tr><form id="t"><td><input name="" type="text" /></td><td><input name="jnr" type="text" /></td><td><input name="aeg" type="text" /></td><td><a class="save" href="#"><img src="images/save.png" alt="save" /></a><a class="delete_new" href="#"><img src="images/icon_del_light.png" alt="delete" /></a></td>      </form></tr>';
  7.  
  8.  $(document).bind("keydown", "n", function(e) {
  9.  
  10.  //alert("TEST");
  11.  
  12.   $("table tr").first().after(editTemplate);
  13.  
  14.                 addEvents();
  15.  
  16. });
  17.  
  18.         $(".add_row").click(function() {
  19.  
  20.                 $("table tr").first().after(editTemplate);
  21.  
  22.                 addEvents();
  23.  
  24.         });
  25.  
  26.        
  27.  
  28.         function addEvents() {
  29.  
  30.                 $(".save").click(function() {
  31.  
  32.                         $('#loader').show();
  33.  
  34.                         var id = $(this).parent().parent().find('input[name="id"]').val();
  35.  
  36.                         var jnr = $(this).parent().parent().find('input[name="jnr"]').val();
  37.  
  38.                         var aeg = $(this).parent().parent().find('input[name="aeg"]').val();
  39.  
  40.                         var currentItem = this;
  41.  
  42.                        
  43.  
  44.                         if(aeg!='' && jnr!='') {
  45.  
  46.                                 $.post("index.php",
  47.  
  48.                                 {
  49.  
  50.                                 "id": id,
  51.  
  52.                                 "jnr": jnr,
  53.  
  54.                                 "aeg": aeg,
  55.  
  56.                                 "action": "add_new"
  57.  
  58.                                 },
  59.  
  60.                                 function(data){
  61.  
  62.                                         $(currentItem).parent().parent().replaceWith(data.row);
  63.  
  64.                                         addEvents();
  65.  
  66.                                         $('#loader').hide();
  67.  
  68.                                 }, "json");
  69.  
  70.                         } else {
  71.  
  72.                                 $('#loader').hide();
  73.  
  74.                                 alert('!!!');
  75.  
  76.                         }
  77.  
  78.                 });
  79.  
  80.                
  81.  
  82.                 $(".delete_new").click(function() {
  83.  
  84.                         $(this).parent().parent().remove();
  85.  
  86.                 });
  87.  
  88.                
  89.  
  90.                 // Eemaldab rea
  91.  
  92.                 $(".delete_row").click(function() {
  93.  
  94.                         $('#loader').show();
  95.  
  96.                         var id = $(this).parent().parent().find("td:first").html();
  97.  
  98.                         $(this).parent().parent().remove();
  99.  
  100.                         $.post("index.php", { "action": "delete_row", "id": id }, function(){
  101.  
  102.                                 $('#loader').hide();
  103.  
  104.                         });
  105.  
  106.                 });
  107.  
  108.         }
  109.  
  110.        
  111.  
  112.         addEvents();
  113.  
  114. });
  115.  
  116.  
  117.  
  118. </script>
  119.  

_________________
Kommentaarid: 7 loe/lisa Kasutajad arvavad:  :: 0 :: 0 :: 7
tagasi üles
vaata kasutaja infot saada privaatsõnum mine selle kasutaja kodulehele
Stemugram
HV kasutaja

liitunud: 02.12.2001
sõnum 01.12.2012 21:59:37 vasta tsitaadiga
Tänud!

Nüüd oleks vaja, et selle lisatava rea teine veerg oleks aktiivne.
Järgnev kood mul küll tööle ei hakanud millegi pärast.

javascript:
  1. $(document).ready(function(){ 
  2.    $("input[name=jnr]").focus(); 
  3. });
Kommentaarid: 2 loe/lisa Kasutajad arvavad:  :: 0 :: 0 :: 2
tagasi üles
vaata kasutaja infot saada privaatsõnum
henri17
HV kasutaja
henri17

liitunud: 01.10.2006
sõnum 11.12.2012 04:49:56 vasta tsitaadiga
Jutumärgid peavad "jnr" ümber ka olema.
javascript:
  1. $(document).ready(function(){
  2.    $('input[name="jnr"]').focus(); 
  3. });
Kommentaarid: 21 loe/lisa Kasutajad arvavad:  :: 0 :: 0 :: 21
tagasi üles
vaata kasutaja infot saada privaatsõnum
näita postitusi alates eelmisest:   
uus teema   vasta Tarkvara »  Programmeerimine »  Javascript - ei oska teha...
[vaata eelmist teemat] [vaata järgmist teemat]
 lisa lemmikuks
näita foorumit:  
 ignoreeri teemat 
sa ei või postitada uusi teemasid siia foorumisse
sa ei või vastata selle foorumi teemadele
sa ei või muuta oma postitusi selles foorumis
sa ei või kustutada oma postitusi selles foorumis
sa ei või vastata küsitlustele selles foorumis
sa ei saa lisada manuseid selles foorumis
sa võid manuseid alla laadida selles foorumis



Hinnavaatlus ei vastuta foorumis tehtud postituste eest.