περασμα τιμών απο checkbox σε text field

Κώδικας, πληροφορίες, ερωτήσεις και απαντήσεις σχετικές με την JavaScript.

Συντονιστές: WebDev Moderators, Super-Moderators

Απάντηση
quit
Δημοσιεύσεις: 147
Εγγραφή: 09 Δεκ 2008 11:54

περασμα τιμών απο checkbox σε text field

Δημοσίευση από quit » 27 Ιούλ 2010 12:43

καλημέρα παιδια, παιδευομαι αρκετες μέρες και δεν μπορώ να τα καταφέρω.
εχω ενα <input type=text> το οποιο εχει μια τιμή και από κάτω 3 checkboxes τα οποια το καθένα έχει μια δικη του τιμη. Θέλω όταν κάνω κλικ σε ένα απο τα checkbox ή και στα τρία συγχρόνως να παιρνει την τιμή που έχει το checkbox και να την προσθετει στο <input type=text>. Δηλαδή αν τσεκαρω και τα 3 checkbox στο <input type=text> θα έχει προστεθει οι τιμές από τα checkbox και αν τα κανω uncheck να αφαιρειται απο το <input type=text> η τιμή του κάθε checkbox αντιστοιχα.

Άβαταρ μέλους
burnmind
Script Master
Δημοσιεύσεις: 954
Εγγραφή: 26 Σεπ 2009 02:14
Τοποθεσία: UK
Επικοινωνία:

περασμα τιμών απο checkbox σε text field

Δημοσίευση από burnmind » 27 Ιούλ 2010 13:56

Κανονικά θα έπρεπε να post-άρεις τον κώδικά σου και να βοηθηθείς πάνω σ'αυτόν.

Ο "χορός του ήλιου" που κάνω τελευταία μπας και σταματήσει να βρέχει εδώ πάνω έχει ως προϋπόθεση να κάνω καλές πράξεις ( :P ), οπότε ορίστε ένα παράδειγμα αυτού που κατάλαβα ότι θες να κάνεις (γίνεται και με άλλους τρόπους):

HTML:

Κώδικας: Επιλογή όλων

<input type="text" id="textbox" value="3" />
<input type="checkbox" value="1" id="box1" onclick="doTheMath&#40;&#41;" />
<input type="checkbox" value="2" id="box2" onclick="doTheMath&#40;&#41;" />
<input type="checkbox" value="3" id="box3" onclick="doTheMath&#40;&#41;" />
JavaScript (θέλει jQuery):

Κώδικας: Επιλογή όλων

var previousVal;

$&#40;document&#41;.ready&#40;function&#40;&#41;&#123;
   previousVal = parseInt&#40;$&#40;'#textbox'&#41;.val&#40;&#41;&#41;;
&#125;&#41;;

function doTheMath&#40;&#41;
&#123;
  var val1 = 0;
  var val2 = 0;
  var val3 = 0;
  
  if &#40;$&#40;'#box1'&#41;.is&#40;'&#58;checked'&#41;&#41;
  &#123;
    val1 = parseInt&#40;$&#40;'#box1'&#41;.val&#40;&#41;&#41;;
  &#125;
  if &#40;$&#40;'#box2'&#41;.is&#40;'&#58;checked'&#41;&#41;
  &#123;
    val2 = parseInt&#40;$&#40;'#box2'&#41;.val&#40;&#41;&#41;;
  &#125;
  if &#40;$&#40;'#box3'&#41;.is&#40;'&#58;checked'&#41;&#41;
  &#123;
    val3 = parseInt&#40;$&#40;'#box3'&#41;.val&#40;&#41;&#41;;
  &#125;
  
  $&#40;'#textbox'&#41;.val&#40;previousVal + val1 + val2 + val3&#41;;
&#125;

quit
Δημοσιεύσεις: 147
Εγγραφή: 09 Δεκ 2008 11:54

περασμα τιμών απο checkbox σε text field

Δημοσίευση από quit » 27 Ιούλ 2010 14:39

ευχαριστω πολύ burNMind θα το δοκιμάσω.
Πιστευω να μην κολήσω κάπου.
Να σε ρωτήσω και κάτι ακόμα, αν θέλω την νέα τιμή που θα έχει το text field πως θα την στέλνω? Γιατι πιστεύω αν στέλνω το value του text αφού έχω τσεκάρει ένα checkbox θα στέλνεται μόνο το 3 ή κανώ λάθος?

quit
Δημοσιεύσεις: 147
Εγγραφή: 09 Δεκ 2008 11:54

περασμα τιμών απο checkbox σε text field

Δημοσίευση από quit » 30 Ιούλ 2010 13:01

καλημέρα παιδια, θελω από το παραπάνω scriptaki να πάρω την νέα τιμή που έχει id="textbox" εφόσον ο χρήστης εχει κανει click σε καποιο checkbox. Αυτο που δεν γνωριζω είναι αν μπορώ να πάρω την νέα τιμή από το id="textbox" χωρίς να χρησιμοποιήσω κάποια φορμα.
Δηλάδη όταν κλικαρω καποιο checkbox να έχω την τιμή του?
Γινεται χωρίς φόρμα ή όχι?

Άβαταρ μέλους
korgr
Honorary Member
Δημοσιεύσεις: 5067
Εγγραφή: 07 Οκτ 2008 18:30
Τοποθεσία: Corinth
Επικοινωνία:

περασμα τιμών απο checkbox σε text field

Δημοσίευση από korgr » 30 Ιούλ 2010 14:50

Κώδικας: Επιλογή όλων

<input type="text" id="textbox" value="3" /> 
<input type="checkbox" value="1" id="box1" onclick="doTheMath&#40;this&#41;" /> 
<input type="checkbox" value="2" id="box2" onclick="doTheMath&#40;this&#41;" /> 
<input type="checkbox" value="3" id="box3" onclick="doTheMath&#40;this&#41;" /> 

Κώδικας: Επιλογή όλων

var previousVal; 

$&#40;document&#41;.ready&#40;function&#40;&#41;&#123; 
   previousVal = parseInt&#40;$&#40;'#textbox'&#41;.val&#40;&#41;&#41;; 
&#125;&#41;; 

function doTheMath&#40;elm&#41; 
&#123;
 var lastCheckedValue = &#40;elm.checked&#41;?  elm.value &#58; lastCheckedValue;
  var val1 = 0; 
  var val2 = 0; 
  var val3 = 0; 
  
  if &#40;$&#40;'#box1'&#41;.is&#40;'&#58;checked'&#41;&#41; 
  &#123; 
    val1 = parseInt&#40;$&#40;'#box1'&#41;.val&#40;&#41;&#41;; 
  &#125; 
  if &#40;$&#40;'#box2'&#41;.is&#40;'&#58;checked'&#41;&#41; 
  &#123; 
    val2 = parseInt&#40;$&#40;'#box2'&#41;.val&#40;&#41;&#41;; 
  &#125; 
  if &#40;$&#40;'#box3'&#41;.is&#40;'&#58;checked'&#41;&#41; 
  &#123; 
    val3 = parseInt&#40;$&#40;'#box3'&#41;.val&#40;&#41;&#41;; 
  &#125; 
  
  $&#40;'#textbox'&#41;.val&#40;previousVal + val1 + val2 + val3&#41;; 
&#125;
Η μεταβλητη lastCheckedValue θα εχει παντα την τιμη του τελευταιου checkbox που επιλεχθηκε. Το θεμα ειναι τι θελεις να κανεις με αυτη την τιμη? Αν θες να την αποθηκευσεις, θα πρεπει να την στειλεις στον server ειτε μεσω φορμας είτε με κληση ajax.

Απάντηση

Επιστροφή στο “JavaScript και Frameworks”

Μέλη σε σύνδεση

Μέλη σε αυτήν τη Δ. Συζήτηση: Δεν υπάρχουν εγγεγραμμένα μέλη και 0 επισκέπτες